How to make a custom post template for all posts in a route?

Themes
1

Hi! I’m working on a custom theme. I’ve pretty much got it figure out /except/ that I need some posts rendered differently than others. My routes.yaml looks like this:

collections:
  /products/:
     permalink: /products/{slug}/
     template: storefront
     filter: primary_tag:products
  /:
     permalink: /{slug}/
     template: index

That’s working great to get mydomain.tld/products rendered with the ‘storefront.hbs’ template.
Where I’m stumped is how to by default render the items in that route (i.e. mydomain.tld/products/post_slug) using a custom file. (I know I can create a custom-whatever.hbs and then select it on the individual post page. But I want all the posts to get the custom template automatically.)

Is my best option to edit post.hbs to detect what the current route is and to change the rendering there? Or is there a better way I’m overlooking?

For anyone interested, here’s the WIP: A shopping experience for Ghost

2

Bumpity bump bump. Anyone know the answer to this one?

3

I know there’s a template option available, but I don’t remember if it applies to the collection page only, or both the collection page, and all the posts in the collection. I think it’s the collection page only.

Assuming the collection template doesn’t work, you can use the {{#has}} helper to compare attributes of a post:

{{{#has tag="products"}}
  {{!-- Product post --}}
{{#else}}
  {{!-- not a product post --}}
{{/has}}

Depending on how different the template is, you could use that logic in posts.hbs to use a different template, or you can use it to control how certain smaller portions of the template render

4

In my testing last month, it seemed to be only the collection page. Yeah, I was hoping not to have to bake the logic into post.hbs, but that might be the best option.

5

Hi! I encountered the same issue and I just found a solution that I am somewhat happy with.

According with this webpage you should be able to create post-{templateName}.hbs, but for whatever reason I can’t get it to work.

So I ended up going with using partials in the post.hbs file, so in your case it would look something like this:

{{!< default}}

{{#has tag="products"}}
	{{> post-product}}
{{else}}
	<main class="site-main>
		{{#post}}
			{{> "content" width="wide"}}
		{{/post}}
		{{#if @custom.show_related_posts}}
			{{> "related-posts"}}
		{{/if}}
		{{#post}}
			{{> "comments"}}
		{{/post}}
	{{/has}}
{{/post}}

Where you have a post-product.hbs file in the partials folder and there you’d modify how the post page for products look. I also left in the {{else}} block ghost’s default post style as a fallback, which I’d say it’s good practice (arguably you could create another partial for that, like post-default.hbs).

In my case I have two primary_tags (which I haven’t been able to use in the #has helper so I just use tag) so my structure looks more like:

{{!< default}}

{{#has tag="tag1"}}
	{{...}}
{{else}}
	{{#has tag="tag2"}}
		{{...}}
	{{else}}
		...
	{{/has}}
{{/has}}

This way at least each post type has a different file and it’s not all bunched up in the same file.

Hope this helps!