Setting up Gatsby blog hierarchical URL slug structure

user_5443318 0
Viewed 643

I am currently using the Gatsby Starter blog (https://github.com/gatsbyjs/gatsby-starter-blog) - I can get this running locally without issue.

However I want to change the URL structure -

currently if I make a blog post called 'hello world', then the URL will be 'www.example/hello-world'. I want the URLs to be in the form of 'www.example/blog/hello-world'.

I've seen a few posts about changing settings in gatsby-node.js but nothing specifically addresses my issue. I am unclear what I need to change as both the Gatsby links API and web dev are fairly new to me.

gatsby hyperlink url html javascript
1 Answers

You need to change this line

    createPage({
      path: `/blog${node.fields.slug}`, // this line
      component: blogPost,
      context: {
        slug: post.node.fields.slug,
        previous,
        next,
      },
    })
user_36893640
Related