Update sitemap example to include posts and exclude sample page (#5723)

* Update sitemap example to include posts and exclude sample page

* this page isn't secret

* no need to have custom html.js here

* add some information and change link to point to sitemap produced by this example

examples/sitemap/gatsby-config.js

@@ -15,6 +15,9 @@ module.exports = {
     `gatsby-transformer-remark`,
     {
       resolve: `gatsby-plugin-sitemap`,
+      options: {
+        exclude: [`/secret`],
+      },
     },
   ],
 }

examples/sitemap/gatsby-node.js

@@ -1,4 +1,49 @@
 const path = require(`path`)
+const slash = require(`slash`)
+
+exports.createPages = ({ graphql, boundActionCreators }) => {
+  const { createPage } = boundActionCreators
+
+  return new Promise((resolve, reject) => {
+    const blogPostTemplate = path.resolve(`src/templates/template-blog-post.js`)
+    graphql(
+      `
+        {
+          allMarkdownRemark(
+            limit: 1000
+            filter: { frontmatter: { draft: { ne: true } } }
+          ) {
+            edges {
+              node {
+                fields {
+                  slug
+                }
+              }
+            }
+          }
+        }
+      `
+    ).then(result => {
+      if (result.errors) {
+        console.log(result.errors)
+        reject(result.errors)
+      }
+
+      // Create blog posts pages.
+      result.data.allMarkdownRemark.edges.forEach(edge => {
+        createPage({
+          path: edge.node.fields.slug, // required
+          component: slash(blogPostTemplate),
+          context: {
+            slug: edge.node.fields.slug,
+          },
+        })
+      })
+
+      resolve()
+    })
+  })
+}
 
 exports.onCreateNode = ({ node, boundActionCreators, getNode }) => {
   const { createNodeField } = boundActionCreators

examples/sitemap/package.json

@@ -10,7 +10,9 @@
     "gatsby-transformer-remark": "latest",
     "gatsby-plugin-sitemap": "latest"
   },
-  "keywords": ["gatsby"],
+  "keywords": [
+    "gatsby"
+  ],
   "license": "MIT",
   "main": "index.js",
   "scripts": {

examples/sitemap/src/pages/index.js

@@ -4,10 +4,14 @@ const IndexRoute = () => (
   <div>
     <p>
       Welcome to the GatsbyJS Sitemap Demo. Visit{` `}
-      <a href="https://www.gatsbyjs.org/sitemap.xml">
+      <a href="/sitemap.xml">
         to see the generated sitemap.
       </a>
     </p>
+    <p>
+      Note: gatsby-plugin-sitemap uses <code>siteMetadata.siteUrl</code>{` `}
+      defined in gatsby-config.js to construct absolute URLs!
+    </p>
   </div>
 )
 

examples/sitemap/src/pages/page-2.js

@@ -0,0 +1,10 @@
+import React from 'react'
+
+const Page = () => (
+  <div>
+    <h1>Not so secret page</h1>
+    <p>This page should be included in sitemap.xml</p>
+  </div>
+)
+
+export default Page

examples/sitemap/src/pages/secret.js

@@ -0,0 +1,10 @@
+import React from 'react'
+
+const Secret = () => (
+  <div>
+    <h1>Secret page</h1>
+    <p>This page should be excluded from sitemap.xml</p>
+  </div>
+)
+
+export default Secret

examples/sitemap/src/templates/template-blog-post.js

@@ -0,0 +1,33 @@
+import React from 'react'
+
+class BlogPost extends React.Component {
+  render() {
+    const { html, frontmatter } = this.props.data.markdownRemark
+    return (
+      <div>
+        <h1>{frontmatter.title}</h1>
+        <div className="container content">
+          <div dangerouslySetInnerHTML={{ __html: html }} />
+        </div>
+      </div>
+    )
+  }
+}
+
+export default BlogPost
+
+export const PageQuery = graphql`
+  query blogPostBySlug($slug: String!) {
+    markdownRemark(fields: { slug: { eq: $slug } }) {
+      html
+      frontmatter {
+        title
+      }
+    }
+    site {
+      siteMetadata {
+        title 
+      }
+    }
+  }
+`