Post Order on tag/{slug} page

I would like to display my posts in order from oldest to newest. I found this Ghost tutorial. However, it is not working. I think it is because I am trying to order posts on the tag/{slug} page. When I add the following line to the taxonomies section of the routes.yaml file - order: published_at asc and then I upload to Ghost Admin > Labs I get an error message that says:

The following definition "order" is invalid: Unknown taxonomy.


I also tried this in my tag-part-one.hbs file without any luck:

{{!< default}}

<div class="page-width">
    {{#tag}}
        <div>
            <h1>{{ name }}</h1>
        </div>
    {{/tag}}

    <div class="posts">
        {{#foreach posts filter="published_at asc"}}
            <a href="{{url absolute="true"}}">
                {{title}}
            </a>
        {{/foreach}}
    </div>
</div>

I found this post, which I think the author is asking the same thing as me but there was no reply. So, I am trying with my own post.

How should I go about ordering posts on my tag/{slug} page?

It is a bit hacky but I ended up just tweaking the publish dates of the posts to get them in the order I needed…

1 Like

Can anyone help with doing this properly?

There is no #get posts in the tags.hbs file.

So it must be passed into the context from somewhere else.

But I can’t see anything in the default or index or any other .hbs file as to how this is done.

I want to order by slug (I mark the slugs a,b,c,d etc.). No problem doing i the home page, i.e. index.hbs file.

But what is going on with the tabs page?

Thanks.

(Tags.hbs is not a general Ghost file, although some themes provide one. But since you refer to #get posts, I’m guessing you mean tag.hbs? Please update if not.)

The tag.hbs page receives the tag data and posts with that tag, as part of its context. They’re just there, because its a tag page.

Unfortunately, taxonomies don’t take an order parameter.

Two workarounds:

Option A: ignore the posts included and get your own, still using tag.hbs. Here’s a basic example that can be adapted to your theme.

{{#tag}}
{{!-- header stuff for the tag here--}}
{{/tag}}
{{#get "posts" filter="tag:{{tag.slug}}" order="slug asc" page=pagination.page limit=@config.posts_per_page as |myposts|}}

        {{#foreach myposts}}
            {{> "post-card"}} {{!-- adjust for your theme --}}
        {{/foreach}}
{{/get}}

{{pagination}}

**Update: fixed an error in the code above. **

That should work because you have the same number of posts with the tag, so the pagination helper can still help paginate the posts, event though you’re not displaying the ones it expects

Option B. Use a channel. Channels paginate and are non-exclusive, so you can use one to collect all posts with a specific tag. (If you’ve ever wanted multiple tags on a tag page, this is a good way, too.)

In your routes.yaml (uploaded in /ghost > settings > labs)

routes:
  /yourtag/:
    template: tag
    order: slug asc
    controller: channel
    filter: tags:[yourtag]
    data: tag.yourtag

collections:
  /:
    permalink: /{slug}/
    template: index

taxonomies:
  tag: /tag/{slug}/
  author: /author/{slug}/

(Collections and taxonomies shown for completeness. If you already have a customized routes file, you’d want to add the bit under routes to it.)

If you only need to sort the posts of a couple of tags, you could make a routes entry like this for each one. If you need to sort posts for dozens and dozens of tags, then I think option A is definitely better, because this would be a lot of work!

That worked perfectly in my tag.hbs file. Problem solved. Thank you so much.

1 Like

Just out of interest, how was the #get posts list being passed into the context of the tag.hbs page in its unedited default state?

Ghost provides appropriate context (i.e. the tag name, image, and description, and the (first page of) posts with that tag) to the tag.hbs template. You can read more here, if interested!

1 Like