How to change the /blog URL path

Jan 9, 2025

Customization

Read time: 4 minutes

top-down aerial drone view of LAX runway with the text "/ BLOG" (forward slash), IMAX 70mm

Creating a website with a blog is effortless with SanityPress. Out of the box, the blog homepage and individual posts are organized under the /blog URL path.

But what if "blog" doesn’t align with your vision? No problem—customizing it to fit your needs is a breeze with a few tweaks to your SanityPress codebase.

In this guide, we’ll walk you through the steps to update the blog’s URL path. For this example, we’ll show you how to change /blog to /press. Let’s dive in!

GROQ queries to update🔗

7 files:

next.config.ts:

// line 30
- destination.internal->._type == 'blog.post' => '/blog/',
+ destination.internal->._type == 'blog.post' => '/press/',

src/app/sitemap.ts

// line 10
- !(metadata.slug.current in ['404', 'blog/*']) &&
+ !(metadata.slug.current in ['404', 'press/*']) &&

// line 21
- 'url': $baseUrl + 'blog/' + metadata.slug.current,
- 'url': $baseUrl + 'press/' + metadata.slug.current,

src/app/(frontend)/[...slug]/page.tsx

//  line 26
- !(metadata.slug.current in ['index', 'blog/*'])
+ !(metadata.slug.current in ['index', 'press/*'])

//  line 38
- !(metadata.slug.current in ['index', 'blog/*'])
+ !(metadata.slug.current in ['index', 'press/*'])

src/app/(frontend)/blog/[slug]/page.tsx

// line 63
- query: groq`*[_type == 'page' && metadata.slug.current == 'blog/*'][0]{
+ query: groq`*[_type == 'page' && metadata.slug.current == 'press/*'][0]{

src/app/(frontend)/blog/rss.xml/route.ts

// line 15
- 'blog': *[_type == 'page' && metadata.slug.current == 'blog'][0]{
+ 'blog': *[_type == 'page' && metadata.slug.current == 'press'][0]{

src/ui/modules/search/store.ts

// line 68
- !(metadata.slug.current in ['404', 'blog/*']) &&
+ !(metadata.slug.current in ['404', 'press/*']) &&

src/ui/modules/blog/Category.tsx

// line 17
- pathname: '/blog',
+ pathname: '/press',

String values to update🔗

5 files:

src/lib/processMetadata.ts

// line 31
- 'application/rss+xml': '/blog/rss.xml',
+ 'application/rss+xml': '/press/rss.xml',

src/lib/processUrl.ts

// line 13
- const segment = page?._type === 'blog.post' ? 'blog' : null
+ const segment = page?._type === 'blog.post' ? 'press' : null

src/sanity/presentation.ts

// line 25
- route: '/blog/:slug',
+ route: '/press/:slug',

src/sanity/lib/processSlug.ts

// line 17
- const segment = _type === 'blog.post' ? '/blog/' : '/'
+ const segment = _type === 'blog.post' ? '/press/' : '/'

src/sanity/schemaTypes/documents/page.ts

// line 110
- (['blog', 'blog/*'].includes(slug) && VscEdit) ||
+ (['press', 'press/*'].includes(slug) && VscEdit) ||

One last step🔗

Lastly, we want to change the folder name that handles the Next.js routing for the blog pages:

👇 src/app/(frontend)/blog/*
🆕 src/app/(frontend)/press/*

Let us know below if you'd like further refinements!

Lombard Street in San Francisco, a wavy street between a neighborhood with bushes and flowers, street sign with the text "Blog Path", cityscape of San Franscisco in the distant background, IMAX 70mm