post.hbs

{{!< default}}

<main id="post-page" class="page-wrap" role="main">
    {{! Everything inside the #post tags pulls data from the post }}
    <article class="{{post_class}}">
    {{#post}}
         {{#contentFor "metaTags"}} 
            <meta property="article:author" content="{{author.name}}">
        {{/contentFor}}

        <div>    
            <header class="post-header">
                {{#if image}}
                	<img src="{{image}}" alt="{{{title}}}" />
                {{/if}}
                
                <h2 class="post-title">
                    <a href="{{url}}"><span>{{{title}}}</span></a>
                </h2>
            </header>

            <section class="post-content">
                {{content}}
            </section>

            <footer class="post-footer">
	    
	    <section class="share">
                    <h4>Share this post</h4>
                    <a class="icon-twitter" href="http://twitter.com/share?text={{encode title}}&url={{url absolute="true"}}"
                        onclick="window.open(this.href, 'twitter-share', 'width=550,height=235');return false;">
                        <span class="hidden">Twitter</span>
                    </a>
                    <a class="icon-fb" href="https://www.facebook.com/sharer/sharer.php?u={{url absolute="true"}}"
                        onclick="window.open(this.href, 'facebook-share','width=580,height=296');return false;">
                        <span class="hidden">Facebook</span>
                    </a>
                    <a class="icon-gplus" href="https://plus.google.com/share?url={{url absolute="true"}}"
                       onclick="window.open(this.href, 'google-plus-share', 'width=490,height=530');return false;">
                        <span class="hidden">Google+</span>
                    </a>
                </section>
		
                <section class="author">
                    {{#if author.image}}
                    <a href="{{author.website}}" class="post-author-avatar">
                        <img src="{{author.image}}" alt="{{author.name}}">
                    </a>
                    {{/if}}

                    <h3>{{author.name}}</h3>
                    <p>{{author.bio}}</p>
                </section>

                
            </footer>

            <section class="post-comments">
                <div id="disqus_thread"></div>
            </section>
        </div>

        <aside class="post-meta">
            <time datetime="{{date format='YYYY-MM-DD'}}">
                {{date format="MMM DD"}}
                <span>{{date format="YYYY"}}</span>
            </time> 

            <dl>
                <dt class="item-author">by</dt>
                <dd>{{author}}</dd>
               
                {{#if tags}}
                <dt class="item-tags">tagged as:</dt>
                <dd>
                    <ul>
                      {{#foreach tags}}
                        <li><a href="{{url}}">{{name}}</a>{{#if @last}} {{else}}, {{/if}}</li>
                      {{/foreach}}
                    </ul>
                </dd>
                {{/if}}
            </dl>
        </aside>
        
        <nav class="pagination">
            <div>
        	    {{#prev_post}}
        	    <a class="older-posts" href="{{url}}" title="{{title}}">← Previous post</a>
        	    {{/prev_post}}
        	    
        	    {{#next_post}}
        	   	<a class="newer-posts" href="{{url}}" title="{{title}}">Next post →</a>
        	   	{{/next_post}}
        	</div>
        </nav>
    {{/post}}
    </article>
</main>

<script type="text/javascript">
  {{> config}}

  {{#post}}
    var disqus_identifier = '{{id}}';
  {{/post}}

  if(typeof DISQUS !== 'object') {
    (function () {
    var s = document.createElement('script'); s.async = true;
    s.type = 'text/javascript';
    s.src = '//' + disqus_shortname + '.disqus.com/embed.js';
    (document.getElementsByTagName('HEAD')[0] || document.getElementsByTagName('BODY')[0]).appendChild(s);
    }());
  }
</script>