feat: added ability to set page-specific metadata

newrelic · May 29, 2020 · f1ce455 · f1ce455
1 parent 796eb70
commit f1ce455
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 1 deletion.
diff --git a/src/markdown-pages/foo-bar-baz.md b/src/markdown-pages/foo-bar-baz.md
@@ -3,6 +3,7 @@ path: '/foo/baz'
 duration: '0 min'
 title: 'Baz'
 template: 'GuideTemplate'
+description: 'Foo Baz page description goes here'
 ---
 
 ## This is the Baz page within Foo

diff --git a/src/templates/GuideTemplate.js b/src/templates/GuideTemplate.js
@@ -8,6 +8,7 @@ import Layout from '../components/Layout';
 import BreadcrumbBar from '../components/BreadcrumbBar';
 import Container from '../components/Container';
 import Video from '../components/Video';
+import SEO from '../components/Seo';
 
 import createBreadcrumbs from '../utils/create-breadcrumbs';
 import pages from '../data/sidenav.json';
@@ -21,16 +22,18 @@ const components = {
 const GuideTemplate = ({ data }) => {
   const { mdx } = data;
   const { frontmatter, body } = mdx;
+  const { title, description } = frontmatter;
 
   const crumbs = createBreadcrumbs(frontmatter.path, pages);
 
   return (
     <Layout>
+      <SEO title={title} description={description} />
       <BreadcrumbBar crumbs={crumbs} duration={frontmatter.duration} />
       <Container>
         <div className="guideTemplate-container">
           <div>
-            <h1>{frontmatter.title}</h1>
+            <h1>{title}</h1>
             <div className="guideTemplate-content">
               <MDXProvider components={components}>
                 <MDXRenderer>{body}</MDXRenderer>
@@ -55,6 +58,7 @@ export const pageQuery = graphql`
         duration
         path
         title
+        description
       }
     }
   }