post.hbs

{{!< default}}
{{#post}}
  <div class="post-wrapper">
    <main id="site-main">
      <article class="post {{post_class}}">
        <header class="post-header">
          <div class="post-header-details">
            {{!-- Post Primary Tag --}}
            {{#primary_tag}}
              <a href="{{url}}" style="color:{{accent_color}};"
                class="post-primary-tag">
                {{name}}
              </a>
            {{/primary_tag}}
            {{!-- Post Title --}}
            <h1 class="post-title">{{title}}</h1>
            {{!-- Post Summary --}}
            {{#if custom_excerpt}}
              <p class="post-excerpt">{{custom_excerpt}}</p>
            {{/if}}
            {{!-- Post Metadata --}}
            <div class="post-meta">
              {{#primary_author}}
                <div class="post-meta-author-avatar">
                  {{#if profile_image}}
                    <img class="post-meta-author-img" src="{{img_url profile_image}}" alt="{{name}}" />
                  {{else}}
                    <i class="fa-sharp fa-solid fa-user-pen"></i>
                  {{/if}}
                </div>
              {{/primary_author}}
              <div class="post-published-meta">
                {{#primary_author}}
                  <a href="{{url}}" class="post-meta-author-name">{{name}}</a>
                {{/primary_author}}
                <div class="post-published-time-meta">
                  <time datetime="{{date format="YYYY-MM-DD"}}">{{date}}</time>
                  <span class="post-meta-separator"> • </span>
                  {{#if reading_time}}
                    <span class="reading-time">{{reading_time}}</span>
                  {{/if}}
                </div>
              </div>
            </div>
            {{!-- Post Image --}}
            {{#if feature_image}}
              <div class="post-image">
                <img src="{{img_url feature_image}}"
                  alt="{{#if feature_image_alt}}{{feature_image_alt}}{{else}}{{title}}{{/if}}" />
                {{#if feature_image_caption}}
                  <figcaption>{{feature_image_caption}}</figcaption>
                {{/if}}
              </div>
            {{/if}}
            {{!-- Post Series TOC --}}
            {{> "series/toc" }}
          </div>
        </header>
        <section class="post-content">
          {{content}}
        </section>
        {{> "post/post-tags"}}
        {{!--

          This is currently not possible with Ghost's dynamic routing. See discussion:
          https://forum.ghost.org/t/dynamic-routing-for-next-previous-post-helper/9279

          {{> "series/nextprev" }}

        --}}
        {{> "post/author-info"}}
      </article>
    </main>
  </div>
  {{!-- Post Footer --}}
  <div class="post-after">
    <div class="post-after-wrapper">
      {{> "post/post-comments"}}
      {{> "post/support" }}
      {{!-- The {#get} helper below fetches some of the latest posts here
      so that people have something else to read when they finish this one.

      This query gets the latest 3 posts on the site, but adds a filter to
      exclude the post we're currently on from being included. --}}
      {{#get "posts" filter="id:-{{id}}" limit="3" as |more_posts|}}
        {{#if more_posts}}
          <section class="related-posts">
            <h4 class="related-posts-header">Related Posts</h4>
            <div class="related-posts-wrapper">
              {{#foreach more_posts}}
                {{> "post-card"}}
              {{/foreach}}
            </div>
          </section>
        {{/if}}
      {{/get}}
    </div>
  </div>
{{/post}}