How to set meta data of your custom routes & collections in Ghost

Ghost is very practical and makes it easy to create custom routes and collections, allowing you to tailor your content and optimize it for search engines and social media platforms through meta data settings.

The main steps for setting the meta data for your custom routes and collections:

1. Add the data property to the route or collection with the page slug.
2. Create the page with the slug you specified earlier.
3. Add the meta data in your page settings.
4. Upload the new routes.yaml file.

Now, we'll go into more details and also give you some examples of how you can set meta data for custom routes and collections in Ghost.

Meta data settings in Ghost

The two main types of content relevant for setting meta data are pages and tags. In the context of Ghost, pages are the backbone of your website, acting as static elements that convey critical information. Tags in Ghost are a powerful organizational tool, grouping related content together.

For more details check out our detailed overview of page settings, going beyond meta data.

When talking about meta data in pages and tags, you can set the following extra context for search engines:

• Meta title — set a different title for search engines. In Ghost, the recommended length is up to 60 characters for pages and 70 characters for tags
• Meta description — set a different description for search engines. In Ghost, the recommended length is up to 145 characters for pages and 156 characters for tags
• Canonical URL — To prevent search engines from indexing duplicate content, specify the canonical URL. This is crucial for maintaining a coherent and effective SEO strategy

Beyond these settings, you can set X (Twitter) and Facebook specific information like: title, description, and image.

Now that we have an understanding of the settings, let’s see how these can be applied when using custom routes.

Custom routes, collections, and channels

Before delving into the meta data settings, let's revisit the fundamentals of custom routes and collections in Ghost. Custom routes enable you to create unique URLs for specific pieces of content, offering a personalized navigation experience for your audience. Collections and channels, allow you to group related content, shaping the way it's presented on your site.

Creating custom routes and collections involves utilizing the routes.yaml file in your Ghost theme. This file acts as a configuration hub, letting you define the structure and organization of your content. Each route and collection can be tailored, giving you the option to set: permalink, template, filter, and data.

We won’t go into more details on all of that as we have covered it before, in our Dynamic routing and routes.yaml post, but next we will look into the data property.

Data property in routes and collections

Collections and routes accept a data property, which will pass in the data to the collection or route.

Let’s look at an example to understand this. You might have a portfolio and blog collection. here’s how you can set the title, description, and meta data for these collections. Here’s the routes setup:

collections:
	/blog/:
		permalink: /blog/{slug}/
		template: blog
		filter: tag:blog
		data: tag.blog
  /portfolio/:
    permalink: /portfolio/{slug}/
    template: portfolio
    filter: tags:[case-study,project]
    data: page.portfolio

Let’s look at each collection separately:

1. The blog collection will have all posts with the blog tag, and the title, description as well as meta data will all come from the blog tag. With this setup, the blog tag will redirect to the /blog/ page. To control the meta settings go and edit them from the tag settings.
2. The portfolio collection will have all posts with the case study or project tag. In this case, the meta data is sourced from the /portfolio/ page instead of the tag. To control the meta settings go and edit them from the page settings.

Too many redirects

As with all settings you have to be careful and look out for some common issues you might experience in case your settings and data don’t match.

If you face an ERR_TOO_MANY_REDIRECTS on a collection route that’s likely from one of your collections where you specified the data property but the corresponding page was not created.

For example, if I have the portfolio collection from the above example, I need to have a page with the /portfolio/ URL, otherwise, it will end up in a redirect loop.

Following this guide, you can create custom routes and collections and at the s ame time control the meta data either via pages or tags to have tighter control and optimize your SEO.