How to style the first blog post different from another post in ghost

by Enamul Haque in Ghost on March 21, 2019

Sometimes, on our ghost blog theme, we want to show some posts of our blog post lists differently. We need to show some different extra contents but we can’t.

Here is the solution. In this way, we can easily show different postcard in a different style.

{{#foreach posts}}
    {{#has number="1"}}
      <h1>Post is different style</h1>
    {{/has}}
    {{^has number="1"}}
    <div class="col-lg-6 grid-item py-4">
        <h1>Post is common style</h1>
    </div>
    {{/has}}
{{/foreach}}

This is the default post loop of ghost theme. {{#has number="1"}}{{/has}} is used to show the specific number post. You can use your chosen number that you want. {{^has number="1"}}{{/has}} is used to exclude the post number what is shown as a specific number post.
You can use the number number="1" as you want.

I have used this in my Delas theme. Here you can see how it looks nice. You can get more in details from the helpers of ghost blog

You can see our themes. You can create blog from our themes