Changing the (blog) articles path

In this guide, we will change the path of the blog from /all-articles to /blog.

The path of the blog is defined in the allArticlesPath variable in site.settings.js. By default, it is set to /all-articles.

Here's what we need to do:

1. Change the allArticlesPath variable in site.settings.js to /blog
2. Rename the /app/all-articles folder to /app/blog
3. Optionally, update any links to /all-articles to /blog

1. Change the allArticlesPath variable in site.settings.js to /blog

Open /data/config/site.settings.js and change the allArticlesPath variable to /blog.

const { metadata } = require('./metadata');

/** @typedef {import("siteSettingsInterface.ts").SiteConfig } */
const siteConfig = {
  ...metadata,

  blogPath: '', // Best for SEO is to have articles under the root path.
- allArticlesPath: '/all-articles',
+ allArticlesPath: '/blog',
  ...
};

2. Rename the /app/all-articles folder to /app/blog

This is where the blog page components are located by default. We need to rename this folder to /app/blog.

3. Optionally, change update any links to /all-articles to /blog

It is common to have linked to the blog from either the header navigation, the footer links or search bar. If you have done this, you will need to update the links to /blog.

Updating the header navigation

Update the articles link in headerNavLinks.ts to /blog.

export const headerNavLinks = [
  { href: '/', title: 'Home' },
  { href: '/pricing', title: 'Pricing' },
  { href: '/about', title: 'About' },
- { href: '/all-articles', title: 'Articles' }
+ { href: '/blog', title: 'Blog' }
];

Updating the footer navigation

Update the articles link in footerNavLinks.ts to /blog.

export const footerLinks = [
  {
    columnName: 'Company',
    links: [
      { href: '/', title: 'Home' },
      { href: '/pricing', title: 'Pricing' },
      { href: '/about', title: 'About' },
-     { href: '/all-articles', title: 'All articles' }
+     { href: '/blog', title: 'Blog' }
    ]
  },
  ...
];

Updating the search bar

Update the articles link in searchLinks.ts to /blog.

export const searchLinks = [
  ...
  {
    id: 'all-articles',
-   name: 'Articles',
+   name: 'Blog',
    keywords: '',
    section: 'Navigation',
-   href: '/all-articles'
+   href: '/blog'
  }
  ...
]