mirror of
https://github.com/facebook/docusaurus.git
synced 2025-06-06 21:03:47 +02:00
feat(v2): improve seo (#1588)
* feat(v2): improve seo - Add doc specific seo information - Add twitter meta tags to seo in theme Layout * Cannot use svg in SEO image * Add docs about SEO * add site default image for seo * Resolve PR discussion * Add `image` to config optional fields * Use theme config instead of root config for image, rename in front matter * Use absolute url for image (wont work on preview) * update docs for frontmatter field for seo * refactor * pages seo * fix * nits again'
This commit is contained in:
parent
684a2461bd
commit
2491c53ba9
6 changed files with 99 additions and 11 deletions
|
@ -15,19 +15,48 @@ import Footer from '@theme/Footer';
|
|||
import './styles.css';
|
||||
|
||||
function Layout(props) {
|
||||
const context = useDocusaurusContext();
|
||||
const {siteConfig = {}} = context;
|
||||
const {favicon, tagline, title: defaultTitle} = siteConfig;
|
||||
const {children, title, noFooter, description} = props;
|
||||
const {siteConfig = {}} = useDocusaurusContext();
|
||||
const {
|
||||
favicon,
|
||||
tagline,
|
||||
title: defaultTitle,
|
||||
themeConfig: {image: defaultImage},
|
||||
url: siteUrl,
|
||||
} = siteConfig;
|
||||
const {
|
||||
children,
|
||||
title,
|
||||
noFooter,
|
||||
description,
|
||||
image,
|
||||
keywords,
|
||||
permalink,
|
||||
} = props;
|
||||
const metaTitle = title || `${defaultTitle} · ${tagline}`;
|
||||
const metaImage = `${siteUrl}${withBaseUrl(image || defaultImage)}`;
|
||||
return (
|
||||
<React.Fragment>
|
||||
<Head defaultTitle={`${defaultTitle} · ${tagline}`}>
|
||||
{title && <title>{`${title} · ${tagline}`}</title>}
|
||||
<Head>
|
||||
{metaTitle && <title>{metaTitle}</title>}
|
||||
{metaTitle && <meta property="og:title" content={metaTitle} />}
|
||||
{favicon && <link rel="shortcut icon" href={withBaseUrl(favicon)} />}
|
||||
{description && <meta name="description" content={description} />}
|
||||
{description && (
|
||||
<meta property="og:description" content={description} />
|
||||
)}
|
||||
{keywords && keywords.length && (
|
||||
<meta property="keywords" content={keywords} />
|
||||
)}
|
||||
{metaImage && <meta property="og:image" content={metaImage} />}
|
||||
{metaImage && <meta property="twitter:image" content={metaImage} />}
|
||||
{metaImage && (
|
||||
<meta name="twitter:image:alt" content={`Image for ${metaTitle}`} />
|
||||
)}
|
||||
{permalink && <meta property="og:url" content={siteUrl + permalink} />}
|
||||
<meta
|
||||
name="twitter:card"
|
||||
content={image || favicon ? 'summary_large_image' : 'summary'}
|
||||
/>
|
||||
</Head>
|
||||
<Navbar />
|
||||
{children}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue