page.hbs

{{!< default}}

<section class="wrapper wrapper-post">
  <div class="wrapper-container">
    <article itemscope itemtype="http://schema.org/BlogPosting" role="article" class="post {{post_class}}">
      {{#post}}
        <section class="post-container">
          <header class="post-header">
            <h1 itemprop="name headline" class="post-title"><a href="{{url}}" itemprop="url" data-pjax title="{{{title}}}">{{{title}}}</a></h1>
            {{! A subtitle not available in Ghosts yet }}
            <!--h2 itemprop="about" class="post-subtitle"></h2-->
          </header>
          <aside class="post-side">
            <div class="post-author">
              {{#if author.image}}
                <a href="{{author.website}}" class="post-author-avatar">
                  <img src="{{author.image}}" alt="{{author.name}}">
                </a>
              {{/if}}
              <div class="post-author-info">
                <a href="{{author.website}}" class="post-author-name">
                  {{author.name}}
                </a>
                <p class="post-author-bio">{{author.bio}}</p>
              </div>
            </div>
          </aside>
          <div itemprop="articleBody" class="post-body">
            {{content}}
          </div>
          <footer class="post-footer">
            <div itemprop="author" itemscope itemtype="http://schema.org/Person" class="post-author">
              {{#if author.image}}
                <a href="{{author.website}}" class="post-author-avatar">
                  <img itemprop="image" src="{{author.image}}" alt="{{author.name}}">
                </a>
              {{/if}}
              <div class="post-author-info">
                <h4 class="post-footer-heading">Written By</h4>
                <a href="{{author.website}}" itemprop="url" class="post-author-name">
                  <span itemprop="name">{{author.name}}</span>
                </a>
                <p itemprop="description" class="post-author-bio">{{author.bio}}</p>
              </div>
            </div>
            <div class="post-social">
              <h4 class="post-footer-heading">Spread the word</h4>
              <a href="#" data-action="share-twitter"><i class="fa fa-fw fa-lg fa-twitter"></i></a>
              <a href="#" data-action="share-facebook"><i class="fa fa-fw fa-lg fa-facebook"></i></a>
              <a href="#" data-action="share-gplus"><i class="fa fa-fw fa-lg fa-google-plus"></i></a>
            </div>
          </footer>
        </section>
      {{/post}}
    </article>

    {{> footer this}}
  </div>
</section>