The snippets of code from my personal website made in Docpad

collections.pages.docpad.coffee

collections:
    pages: ->
         @getCollection("html").findAllLive({isPage:true},[{order:1}]).on "add", (model) ->
            model.setMetaDefaults({layout:"default"})
    
    posts: (database) ->
        database.findAllLive({relativeOutDirPath:'posts'},[{date:-1}]).on "add", (model) ->
            model.setMetaDefaults({layout:"post"})
    
    projects: ->
        @getCollection('html').findAllLive({relativeOutDirPath:'projects'},[{title:1}]).on "add", (model) ->
            model.setMetaDefaults({layout:"project"})
        
    frontpage: ->
        @getCollection("html").findAllLive({relativeOutDirPath: $in: ['posts','projects']},[{date: -1}])

menu.default.html

<div id="menu">
    <ul>
        <% for page in @getCollection("pages").toJSON(): %>
            <li class="<%= if page.id is @document.id then 'active' else 'inactive' %>">
                <% if page.id is @document.id: %>
                    <%= page.title %>
                <% else: %>
                    <a href="<%= page.url %>"><%= page.title %></a>
                <% end %>
            </li>
        <% end %>
    </ul>
</div>

post-content.html

<div id="post">
    <div id="post-header">
        <h2>
            <% if @post.id is @document.id: %>
                <%= @post.title %>
            <% else: %>
                <a href='<%= @post.url%>'><%= @post.title %></a>
            <% end %>
        </h2>
        <div id="post-meta">
            <p>
                <%= @post.date.toLocaleDateString() %> | Posted in
                <% for tag in @post.tags: %>
                    <a id="post-category" href="/tags/<%= tag %>.html"><%= tag %></a>
                <% end %>
            </p>
        </div>
    </div>
    <div id="post-content">
        <%- @post.contentRenderedWithoutLayouts %> 
    </div>
</div>

post.html

---
layout: "default"
---

<!--
    Commenting is based on: http://ivanzuzak.info/2011/02/18/github-hosted-comments-for-github-hosted-blogs.html
-->
<div id="post">
    <%- @partial('post-content', {post: @document})%>
    <div id="post-footer">
        <div>
            <%- @getNavLinks() %>
        </div>
    </div>
    
    <script type="text/javascript" src="http://datejs.googlecode.com/svn/trunk/build/date-en-US.js"></script>

    <script type="text/javascript">
      $("#post p").each( function(index) {
        if (index > 0 && $.trim($(this).text()).length > 0) {
          $(this).attr("id", "par" + index.toString());
          var html = $(this).html();
          $(this).html(html + " <a href='#par" + index.toString() + "'>#</a>");
        }
      });
    </script>
    
    <div id="post-comments>
        <h2>Comments</h2>
        <div id="post-comment-header">
            Want to leave a comment? Visit <a href="https://github.com/<%= @site.githubuser %>/<%= @site.githubrepository %>/issues/<%= @document.commentIssueId %>"> this post's issue page on 
            GitHub</a> (you'll need a GitHub account).
        </div>
    </div>
    
    <script type="text/javascript">

      function loadComments(data) {
        for (var i=0; i<data.length; i++) {
          var cuser = data[i].user.login;
          var cuserlink = "https://www.github.com/" + data[i].user.login;
          var clink = "https://github.com/<%= @site.githubuser %>/<%= @site.githubrepository %>/issues/<%= @document.commentIssueId %>#issuecomment-" + data[i].url.substring(data[i].url.lastIndexOf("/")+1);
          var cbody = data[i].body_html;
          var cavatarlink = data[i].user.avatar_url;
          var cdate = Date.parse(data[i].created_at).toString("yyyy-MM-dd HH:mm:ss");

          $("#post-comments").append("<div id='post-comment'><div id='post-comment-header'><div id='post-comment-gravatar'>" + '<img src="' + cavatarlink + '" alt="" width="20" height="20">' + "</div><a id='post-comment-user' href=\""+ cuserlink + "\">" + cuser + "</a><a id='post-comment-date' href=\"" + clink + "\">" + cdate + "</a></div><div id='post-comment-body'>" + cbody + "</div></div>");
        }
      }

      $.ajax("https://api.github.com/repos/<%= @site.githubuser %>/<%= @site.githubrepository %>/issues/<%= @document.commentIssueId %>/comments", {
        headers: {Accept: "application/vnd.github.full+json"},
        dataType: "json",
        success: function(msg){
          loadComments(msg);
       }
      });
    </script>
</div>

project-linkedposts.html

<div id="project-linkedposts">
    <h3>Posts referencing <%= @title %></h3>
    <ul>
        <% for doc in @getCollection('posts').findAll({tags: '$in': @title}).toJSON(): %>
            <li><a href="<%= doc.url %>"><%= doc.title %></a></li>
        <% end %>
    </ul>
</div>

project.html

---
layout: "default"
---

<div class="project">
    <h2><%- @document.title %></h2>
    <div>
        <%- @content %>
    </div>
    <div>
        <%- @partial('project-linkedposts', { title: @document.title })%>
    </div>
</div>

recent.default.html

<h2>Recent</h2>
<ul>
    <% for recent in @getCollection("frontpage").toJSON()[0..9]: %>
        <li><a href="<%= recent.url %>"><%= recent.title %></a></li>
    <% end %>
</ul>

tags.default.html

<h2>Tags</h2>
<% for tag, data of @getTagCloud(): %>
    <a href="<%= data.url %>" style="font-size: <%- 100 + data.weight * 25 %>%">
        <%= tag %>
    </a>
<% end %>

tags.html

---
layout: default
---

<div id="posts">
    <h3 id="post-tags-header">Posts tagged with: <%= @document.tag %></h3>
    <% for post in @getCollection('documents').findAll({tags: '$in': @document.tag}, [date:-1]).toJSON(): %>
        <div id="post-spacer">
            <%- @partial('post-content', {post: post})%>
        </div>
    <% end %>
</div>