diff --git a/gatsby-config.js b/gatsby-config.js index 89ba194..aba38cd 100644 --- a/gatsby-config.js +++ b/gatsby-config.js @@ -7,6 +7,7 @@ module.exports = { siteMetadata: { title: 'devthread.ru', + keywords: 'веб разработка, javascript, seo, программирование, reactjs, graphql', siteName: 'Cборник статей и руководств - devthread.ru', titleTemplate: '%s · статьи и руководства по веб-разработке', description: 'Cборник статей и руководств по тематике веб-разработки и IT для того чтобы помочь вам', diff --git a/src/components/Article/Article.js b/src/components/Article/Article.js index 7a2166d..37c22f1 100644 --- a/src/components/Article/Article.js +++ b/src/components/Article/Article.js @@ -12,12 +12,11 @@ import VkIcon from '../../images/vk-icon.svg' import TwitterIcon from '../../images/twitter-icon__large.svg' import FacebookIcon from '../../images/facebook-icon__large.svg' -const Article = ({ data: { slug, title, image, description, category, tags, time, date }, html }) => { +const Article = ({ data: { slug, keywords, title, image, description, category, tags, time, date }, html }) => { const { siteMetadata: { siteUrl } } = useSiteMetadataQuery() - return ( <> - +
diff --git a/src/components/SEO/SEO.js b/src/components/SEO/SEO.js index 123befe..cfda727 100644 --- a/src/components/SEO/SEO.js +++ b/src/components/SEO/SEO.js @@ -4,7 +4,7 @@ import PropTypes from 'prop-types' import { Helmet } from 'react-helmet' import { useLocation } from '@reach/router' -const SEO = ({ title, description, image, type }) => { +const SEO = ({ title, keywords, description, image, type, canonical }) => { const { pathname } = useLocation() const { siteMetadata } = useSiteMetadataQuery() @@ -14,12 +14,17 @@ const SEO = ({ title, description, image, type }) => { type: type || 'website', image: image || 'custom image url...', description: description || siteMetadata.description, - url: `${siteMetadata.siteUrl}${pathname}` + keywords: keywords || siteMetadata.keywords, + url: `${siteMetadata.siteUrl}${pathname}`, + canonical: canonical || `${siteMetadata.siteUrl}${pathname}` } return ( + {seo.keywords && ( + + )} { {seo.description && ( )} + diff --git a/src/hooks/useSiteMetadataQuery.js b/src/hooks/useSiteMetadataQuery.js index e568e80..872c89f 100644 --- a/src/hooks/useSiteMetadataQuery.js +++ b/src/hooks/useSiteMetadataQuery.js @@ -6,6 +6,7 @@ const useSiteMetadata = () => { site { siteMetadata { title + keywords titleTemplate siteName description diff --git a/src/pages/books.js b/src/pages/books.js index fd35214..306c639 100644 --- a/src/pages/books.js +++ b/src/pages/books.js @@ -55,7 +55,7 @@ export const query = graphql` title image { childImageSharp { - fluid { + fluid(maxWidth: 1400) { ...GatsbyImageSharpFluid } } diff --git a/src/templates/articleTemplate.js b/src/templates/articleTemplate.js index 328764e..8b19ec4 100644 --- a/src/templates/articleTemplate.js +++ b/src/templates/articleTemplate.js @@ -35,6 +35,7 @@ export const pageQuery = graphql` html frontmatter { slug + keywords title image { childImageSharp { diff --git a/src/templates/categoryTemplate.js b/src/templates/categoryTemplate.js index 1e01426..d78be08 100644 --- a/src/templates/categoryTemplate.js +++ b/src/templates/categoryTemplate.js @@ -2,6 +2,7 @@ import React from "react" import { Main } from '../ui/ui' import { Grid, Row, Col } from 'react-flexbox-grid' import { graphql } from 'gatsby' +import useSiteMetadataQuery from '../hooks/useSiteMetadataQuery' import useCategoriesQuery from '../hooks/useCategoriesQuery' import SEO from '../components/SEO/SEO' import Layout from '../components/Layout/Layout' @@ -14,9 +15,11 @@ import Newsletter from '../components/Newsletter/Newsletter' const CategoryPage = ({ data: { allMarkdownRemark: edges }, pageContext: { title } }) => { const { categories } = useCategoriesQuery() + const { siteMetadata: { siteUrl } } = useSiteMetadataQuery() + return ( - +
@@ -60,7 +63,7 @@ export const pageQuery = graphql` title image { childImageSharp { - fluid { + fluid(maxWidth: 1400) { ...GatsbyImageSharpFluid } } diff --git a/src/templates/tagTemplate.js b/src/templates/tagTemplate.js index 5dc3329..501c3c6 100644 --- a/src/templates/tagTemplate.js +++ b/src/templates/tagTemplate.js @@ -2,6 +2,7 @@ import React from "react" import { Main } from '../ui/ui' import { Grid, Row, Col } from 'react-flexbox-grid' import { graphql } from 'gatsby' +import useSiteMetadataQuery from '../hooks/useSiteMetadataQuery' import useCategoriesQuery from '../hooks/useCategoriesQuery' import SEO from '../components/SEO/SEO' import Layout from '../components/Layout/Layout' @@ -14,9 +15,11 @@ import Newsletter from '../components/Newsletter/Newsletter' const TagPage = ({ data: { allMarkdownRemark: edges }, pageContext: { title } }) => { const { categories } = useCategoriesQuery() + const { siteMetadata: { siteUrl } } = useSiteMetadataQuery() + return ( - +
@@ -60,7 +63,7 @@ export const pageQuery = graphql` title image { childImageSharp { - fluid { + fluid(maxWidth: 1400) { ...GatsbyImageSharpFluid } } diff --git a/static/admin/config.yml b/static/admin/config.yml index c32ab43..a5b83bd 100644 --- a/static/admin/config.yml +++ b/static/admin/config.yml @@ -12,6 +12,7 @@ collections: fields: - {label: "Template Key", name: "templateKey", wisdget: "hidden", default: "article"} - {label: "Slug", name: "slug", widget: "string"} + - {label: "Keywords", name: "keywords", widget: "list"} - {label: "Время чтения", name: "time", widget: "string"} - {label: "Заголовок", name: "title", widget: "string"} - {label: "Популярная статья", name: "popular", widget: "boolean", default: false}