activate-posts-extension.adoc

Activate posts extension (blog, news, etc)

Table of Contents

• Create the posts directory in the project root
• Enable the Posts extensions and Partial helper
• Create a directory for partials in the project root
• Create a partial to layout a post
• Create the base layout for a post
• Create the layout for pagination
• Show all posts on front page
• Create a new post
• Add Atom feed site
• Clean and preview site to see changes
• Enable Tagger extension
• Add tag links below post
• Clean and preview site to see changes
• Next: Extensionless URLs

Previous: Configure a theme for AsciiDoc and the website

Tutorial 8

This tutorial…​

Create the posts directory in the project root

$ mkdir posts

Enable the Posts extensions and Partial helper

_ext/pipeline.rb (partial)

Awestruct::Extensions::Pipeline.new do

  helper Awestruct::Extensions::Partial

  extension Awestruct::Extensions::Posts.new '/posts'

  extension Awestruct::Extensions::Paginator.new :posts, '/index',
      :page_name => 'posts/page/', :per_page => 5

  extension Awestruct::Extensions::Atomizer.new :posts, '/feed.xml',
      :num_entries => 10

end

Create a directory for partials in the project root

$ mkdir _partials

Create a partial to layout a post

_partials/post.html.haml

- author_url = page.post.author_url || site.author_url
- post_url = "#{site.ctx_path}#{page.post.url}"
%article.post
  %header.post-head
    %h1.title
      %a{:href=>post_url}=page.post.title
    %h4
      %em by
      %a.author{:href=>author_url}
        %img(src="#{author_url}.png" width=24 height=24)
        =page.post.author || site.author
      on
      %time.pubdate{:datetime=>page.post.date.strftime('%FT%T%:z')}
        =page.post.date.strftime '%B %e, %Y'
  .post-body
    =page.post.content

Create the base layout for a post

_layout/post.html.haml

---
layout: base
---
=partial 'post.html.haml', :post => page

Create the layout for pagination

_partials/pagination.html.haml

- paginator = page.paginator
.pagination-centered
  %ul.pagination
    - if paginator.previous_page
      %li.arrow
        %a(href="#{site.ctx_path}#{paginator.previous_page.url}")
          %i.icon-step-backward
    - else
      %li.arrow.unavailable
        %a(href='#')
          %i.icon-step-backward
    %li #{paginator.current_page_index + 1} of #{paginator.pages.size}
    - if paginator.next_page
      %li.arrow
        %a(href="#{site.ctx_path}#{paginator.next_page.url}")
          %i.icon-step-forward
    - else
      %li.arrow.unavailable
        %a(href='#')
          %i.icon-step-forward

Show all posts on front page

Edit index.html.haml

---
layout: base
---
.row
  .large-12.columns
    %h1 Welcome to #{Asciidoctor.render site.name, :doctype => :inline}!

.row
  .large-12.columns.posts
    - page.posts.each do |post|
      =partial 'post.html.haml', :post => post, :listing => true
    =partial 'pagination.html.haml', :paginator => page.posts

Create a new post

posts/docs-workshop-rwx-2013.adoc

= Docs Workshop at RWX 2013
Author Name
2013-12-04
:page-tags: [conference, rwx]

Content of first post, reporting from RWX!

Tip	The default layout for a post is post, so you don’t have to specify it in the AsciiDoc header.

Add Atom feed site

Edit _layouts/base.html.haml

%link(rel='alternate'
      type='application/atom+xml'
      href="#{site.ctx_path}/feed.xml")

Clean and preview site to see changes

$ rake clean preview

Enable Tagger extension

Add declaration below Paginator in _ext/pipeline.rb

extension Awestruct::Extensions::Tagger.new :posts, '/index',
    'posts/tag', :per_page => 5

Add tag links below post

Append to _partials/post.html.haml

  %footer.post-footer
    - if page.post.tags
      .tags<
        %i.label.icon-tags
        -#=page.post.tag_links
        - page.post.tags.each_with_index do |tag, idx|
          - unless idx.zero?
            =', '
          %a{:href=>"#{site.ctx_path}#{tag.primary_page.url}"}=tag

Clean and preview site to see changes

$ rake clean preview

Next: Extensionless URLs