Featured-First Post Order in Ghost

Making featured posts show up first in Ghost Casper theme (instead of the default reverse chronological order).

By default (I'm using the default Casper theme), Ghost will do a reverse chronological order of your post (i.e. newest first). Also, starting from the first post, every 6th posts will be a large post card ( .post-card-large ), due to the {{#has index="nth:6"}} condition here.

One thing I want to change regarding display order is to make some popular/featured post go first, then everything else. This way at least the first large post card occupying the most prominent location is a popular post.

One plausible way to do it might be to do two loops in the index.hbs like suggested here. However, doing this the post would have two sets of index (one set for featured, the other for normal posts) and the treatment for large card per every 6th post will be broken!

It turned out the desired feature first order is actually very easy to achieve with routes.yaml (see more info here).

In admin, go to Settings > Labs > Routes and download the current routes.yaml, which should look like this:

routes:

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

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

Add order: featured desc, published_at desc to the / collection

routes:

collections:
  /:
    permalink: /{slug}/
    template: index
    order: featured desc, published_at desc

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

Then, go to Settings > Labs > Routes, upload the new yaml file. That's it!


See here for more Ghost editing tips: 👇
Using Ghost - Ran Ding
Notes on using Ghost platform.