diff --git a/config.js b/config.js
index 0b586a03..469a07bb 100644
--- a/config.js
+++ b/config.js
@@ -4,7 +4,7 @@ module.exports = {
siteDescription:
'Learn about the components of the Ocean Protocol software stack, and how to run or use the components relevant to you.',
siteUrl: process.env.SITE_URL || 'https://docs.oceanprotocol.com',
- siteIcon: 'src/images/profile.png',
+ siteIcon: 'node_modules/@oceanprotocol/art/logo/favicon-black.png',
siteCompany: 'Ocean Protocol Foundation Ltd.',
analyticsId: 'UA-60614729-11',
social: {
diff --git a/package.json b/package.json
index f865cf19..5f69a61f 100644
--- a/package.json
+++ b/package.json
@@ -22,7 +22,7 @@
"deploy": "./scripts/deploy.sh"
},
"dependencies": {
- "@oceanprotocol/art": "^2.0.0",
+ "@oceanprotocol/art": "^2.1.0",
"axios": "^0.18.0",
"classnames": "^2.2.6",
"gatsby": "^2.0.52",
diff --git a/src/components/Layout.jsx b/src/components/Layout.jsx
index e0e14205..27e9646e 100755
--- a/src/components/Layout.jsx
+++ b/src/components/Layout.jsx
@@ -1,45 +1,17 @@
import React from 'react'
import PropTypes from 'prop-types'
-import Helmet from 'react-helmet'
-import { graphql, StaticQuery } from 'gatsby'
import Header from './Header'
import Footer from './Footer'
-const query = graphql`
- query {
- site {
- siteMetadata {
- siteTitle
- siteDescription
- }
- }
- }
-`
-
const Layout = ({ children, header }) => {
const headerElement = header ||
return (
- {
- const siteMeta = data.site.siteMetadata
-
- return (
- <>
-
-
-
- {headerElement}
- {children}
-
-
- )
- }}
- />
+ <>
+ {headerElement}
+ {children}
+
+
)
}
diff --git a/src/components/Seo.jsx b/src/components/Seo.jsx
new file mode 100644
index 00000000..40356978
--- /dev/null
+++ b/src/components/Seo.jsx
@@ -0,0 +1,95 @@
+import React from 'react'
+import PropTypes from 'prop-types'
+import { StaticQuery, graphql } from 'gatsby'
+import Helmet from 'react-helmet'
+
+const query = graphql`
+ query {
+ site {
+ siteMetadata {
+ siteTitle
+ siteDescription
+ siteUrl
+ siteIcon
+ siteCompany
+ social {
+ twitter
+ }
+ }
+ }
+ }
+`
+
+const MetaTags = ({ title, description, url, image, schema, siteMeta }) => (
+
+
+
+ {title && {title}}
+
+
+
+ {/* General tags */}
+
+
+
+
+ {/* Schema.org tags */}
+
+
+ {/* OpenGraph tags */}
+
+ {documentSEO && }
+
+
+
+
+ {/* Twitter Card tags */}
+
+
+
+
+
+
+)
+
+MetaTags.propTypes = {
+ description: PropTypes.string,
+ image: PropTypes.string,
+ url: PropTypes.string,
+ schema: PropTypes.string,
+ title: PropTypes.string,
+ siteMeta: PropTypes.object
+}
+
+const SEO = ({ title, description, slug }) => (
+ {
+ const siteMeta = data.site.siteMetadata
+
+ return (
+
+ )
+ }}
+ />
+)
+
+SEO.propTypes = {
+ title: PropTypes.string,
+ description: PropTypes.string,
+ slug: PropTypes.string
+}
+
+export default SEO
diff --git a/src/pages/index.jsx b/src/pages/index.jsx
index 69b76e9f..d8fa51a9 100755
--- a/src/pages/index.jsx
+++ b/src/pages/index.jsx
@@ -1,8 +1,8 @@
import React from 'react'
import PropTypes from 'prop-types'
import { Link, graphql } from 'gatsby'
-import Helmet from 'react-helmet'
import classnames from 'classnames'
+import SEO from '../components/Seo'
import Layout from '../components/Layout'
import Content from '../components/Content'
import HeaderHome from '../components/HeaderHome'
@@ -38,12 +38,8 @@ SectionLink.propTypes = {
const IndexPage = ({ data, location }) => (
<>
-
-
-
+
+
}>
diff --git a/src/templates/Doc.jsx b/src/templates/Doc.jsx
index 4ab5513b..e4fcd4d7 100644
--- a/src/templates/Doc.jsx
+++ b/src/templates/Doc.jsx
@@ -10,6 +10,7 @@ import DocToc from '../components/DocToc'
import DocContent from '../components/DocContent'
import DocHeader from '../components/DocHeader'
import DocFooter from '../components/DocFooter'
+import SEO from '../components/Seo'
import styles from './Doc.module.scss'
export default class DocTemplate extends Component {
@@ -22,7 +23,7 @@ export default class DocTemplate extends Component {
const { location } = this.props
const post = this.props.data.markdownRemark
const sections = this.props.data.allSectionsYaml.edges
- const { section } = post.fields
+ const { section, slug } = post.fields
const { title, description } = post.frontmatter
const { tableOfContents } = post
@@ -37,10 +38,11 @@ export default class DocTemplate extends Component {
return (
<>
- {title}
-
+
+
+