1
0
mirror of https://github.com/kremalicious/blog.git synced 2025-01-06 19:55:40 +01:00

slight refactor

This commit is contained in:
Matthias Kretschmann 2018-09-25 01:39:38 +02:00
parent 0c60576f26
commit 3aabf39c27
Signed by: m
GPG Key ID: 606EEEF3C479A91F

View File

@ -1,4 +1,4 @@
import React, { Component } from 'react' import React from 'react'
import PropTypes from 'prop-types' import PropTypes from 'prop-types'
import { StaticQuery, graphql } from 'gatsby' import { StaticQuery, graphql } from 'gatsby'
import Helmet from 'react-helmet' import Helmet from 'react-helmet'
@ -24,45 +24,15 @@ const query = graphql`
} }
` `
class SEO extends Component { const createSchemaOrg = (
static propTypes = { blogURL,
post: PropTypes.object, title,
slug: PropTypes.string, siteMeta,
postSEO: PropTypes.bool postSEO,
} postURL,
image,
render() { description
return ( ) => {
<StaticQuery
query={query}
render={data => {
const siteMeta = data.contentYaml
const { post, slug, postSEO } = this.props
let title
let description
let image
let postURL
if (postSEO) {
const postMeta = post.frontmatter
title = `${postMeta.title} ¦ ${siteMeta.tagline}`
description = postMeta.description
? postMeta.description
: post.excerpt
image = postMeta.image
? postMeta.image.childImageSharp.fluid.src
: siteMeta.author.avatar.childImageSharp.resize.src
postURL = `${siteMeta.url}${slug}`
} else {
title = `${siteMeta.title} ¦ ${siteMeta.tagline}`
description = siteMeta.tagline
image = siteMeta.author.avatar.childImageSharp.resize.src
}
image = `${siteMeta.url}${image}`
const blogURL = siteMeta.url
const url = postSEO ? postURL : blogURL
const schemaOrgJSONLD = [ const schemaOrgJSONLD = [
{ {
'@context': 'http://schema.org', '@context': 'http://schema.org',
@ -105,8 +75,18 @@ class SEO extends Component {
} }
) )
} }
return schemaOrgJSONLD
}
return ( const MetaTags = ({
description,
image,
url,
schema,
postSEO,
title,
siteMeta
}) => (
<Helmet> <Helmet>
<html lang="en" /> <html lang="en" />
@ -116,9 +96,7 @@ class SEO extends Component {
<link rel="canonical" href={url} /> <link rel="canonical" href={url} />
{/* Schema.org tags */} {/* Schema.org tags */}
<script type="application/ld+json"> <script type="application/ld+json">{schema}</script>
{JSON.stringify(schemaOrgJSONLD)}
</script>
{/* OpenGraph tags */} {/* OpenGraph tags */}
<meta property="og:url" content={url} /> <meta property="og:url" content={url} />
@ -138,10 +116,75 @@ class SEO extends Component {
<meta name="twitter:image" content={image} /> <meta name="twitter:image" content={image} />
</Helmet> </Helmet>
) )
MetaTags.propTypes = {
description: PropTypes.string,
image: PropTypes.string,
url: PropTypes.string,
schema: PropTypes.string,
postSEO: PropTypes.bool,
title: PropTypes.string,
siteMeta: PropTypes.object
}
const SEO = ({ post, slug, postSEO }) => (
<StaticQuery
query={query}
render={data => {
const siteMeta = data.contentYaml
let title
let description
let image
let postURL
if (postSEO) {
const postMeta = post.frontmatter
title = `${postMeta.title} ¦ ${siteMeta.tagline}`
description = postMeta.description ? postMeta.description : post.excerpt
image = postMeta.image
? postMeta.image.childImageSharp.fluid.src
: siteMeta.author.avatar.childImageSharp.resize.src
postURL = `${siteMeta.url}${slug}`
} else {
title = `${siteMeta.title} ¦ ${siteMeta.tagline}`
description = siteMeta.tagline
image = siteMeta.author.avatar.childImageSharp.resize.src
}
image = `${siteMeta.url}${image}`
const blogURL = siteMeta.url
const url = postSEO ? postURL : blogURL
let schema = createSchemaOrg(
blogURL,
title,
siteMeta,
postSEO,
postURL,
image,
description
)
schema = JSON.stringify(schema)
return (
<MetaTags
description={description}
image={image}
url={url}
schema={schema}
postSEO={postSEO}
title={title}
siteMeta={siteMeta}
/>
)
}} }}
/> />
) )
}
SEO.propTypes = {
post: PropTypes.object,
slug: PropTypes.string,
postSEO: PropTypes.bool
} }
export default SEO export default SEO