diff --git a/src/components/Page/Page.js b/src/components/Page/Page.js index ed51674f..f53f0aa4 100644 --- a/src/components/Page/Page.js +++ b/src/components/Page/Page.js @@ -21,6 +21,15 @@ const preventDefault = e => { e.preventDefault(); }; +const twitterPageURL = siteTwitterHandle => { + if (siteTwitterHandle && siteTwitterHandle.charAt(0) === '@') { + return `https://twitter.com/${siteTwitterHandle.substring(1)}`; + } else if (siteTwitterHandle) { + return `https://twitter.com/${siteTwitterHandle}`; + } + return null; +}; + class PageComponent extends Component { componentDidMount() { this.historyUnlisten = this.props.history.listen(() => scrollToTop()); @@ -83,6 +92,7 @@ class PageComponent extends Component { const { pathname, search = '' } = history.location; const pathWithSearch = `${pathname}${search}`; + const canonicalRootURL = config.canonicalRootURL; const siteTitle = config.siteTitle; const schemaTitle = intl.formatMessage({ id: 'Page.schemaTitle' }, { siteTitle }); const schemaDescription = intl.formatMessage({ id: 'Page.schemaDescription' }); @@ -91,7 +101,7 @@ class PageComponent extends Component { const facebookImgs = facebookImages || [ { name: 'facebook', - url: `${config.canonicalRootURL}${facebookImage}`, + url: `${canonicalRootURL}${facebookImage}`, width: 1200, height: 630, }, @@ -99,7 +109,7 @@ class PageComponent extends Component { const twitterImgs = twitterImages || [ { name: 'twitter', - url: `${config.canonicalRootURL}${twitterImage}`, + url: `${canonicalRootURL}${twitterImage}`, width: 600, height: 314, }, @@ -123,17 +133,42 @@ class PageComponent extends Component { // eslint-disable-next-line react/no-array-index-key const metaTags = metaToHead.map((metaProps, i) => ); + const facebookPage = config.siteFacebookPage; + const twitterPage = twitterPageURL(config.siteTwitterHandle); + const instagramPage = config.siteInstagramPage; + const sameOrganizationAs = [facebookPage, twitterPage, instagramPage].filter(v => v != null); + // Schema for search engines (helps them to understand what this page is about) // http://schema.org // We are using JSON-LD format - const schemaJSONString = - schema || - JSON.stringify({ + + // Schema attribute can be either single schema object or an array of objects + // This makes it possible to include several different items from the same page. + // E.g. Product, Place, Video + const schemaFromProps = Array.isArray(schema) ? schema : [schema]; + const schemaArrayJSONString = JSON.stringify([ + ...schemaFromProps, + { '@context': 'http://schema.org', - '@type': 'WebPage', + '@type': 'Organization', + '@id': `${canonicalRootURL}#organization`, + url: canonicalRootURL, + name: siteTitle, + sameAs: sameOrganizationAs, + logo: `${canonicalRootURL}/static/webapp-icon-192x192.png`, + address: config.address, + }, + { + '@context': 'http://schema.org', + '@type': 'WebSite', + url: canonicalRootURL, description: schemaDescription, name: schemaTitle, - }); + publisher: { + '@id': `${canonicalRootURL}#organization`, + }, + }, + ]); return (