Create a gist now

Instantly share code, notes, and snippets.

What would you like to do?
A quick example Harp app that uses the correct title for your blog in the correct place.

A quick example Harp app that uses the correct title for your blog in the correct place.

The App

app/
  |- _harp.json
  |- _layout.ejs
  |- index.ejs
  |+ posts/
      |- _data.json
      |- there-is-no-spoon.md
      |- by-the-way.md

_harp.json

{
  "globals": {
    "title": "egeozcan",
    "tagline": "My Awesome Harp Based Blog"
  }
}

posts/_data.json

{
  "there-is-no-spoon": {
    "title": "There Is No Spoon",
    "tags": ["intro", "personal"],
    "date": "2012-02-07"
  },
  "by-the-way": {
    "title": "By The Way",
    "tags": ["intro", "javascript"],
    "date": "2012-02-07"
  }
}

_layout.ejs

<!DOCTYPE>
<html>
  <head>
    <title><%= title %> | <%= tagline %></title>
  </head>
  <body>
    <%- yield %>
  </body>
</html>

index.ejs

<h1><%= title %></h1>
<ul>
  <% for (var slug in public.posts._data) { %>
    <% var post = public.posts._data[slug] %> 
    <li>
      <a href="posts/<%= slug %>">
        <%= post.title %>
      </a>
    </li>
  <% } %>
</ul>

So, if I’m at /posts/there-is-no-spoon, there’s a corresponding title in the _data.json, so my title tag will be <title>There Is No Spoon | My Awesome Harp Based Blog</title>. There is no _data.json file in the root directory, so there is no metadata for the index page. This means title falls back to whatever’s in the harp.json, if there is anything. So, on the index page, the title is <title>There Is No Spoon | My Awesome Harp Based Blog</title>

You could even take this further. If I wanted to add a different tagline on the By The Way post:

_data.json

{
  "there-is-no-spoon": {
    "title": "There Is No Spoon",
    "tags": ["intro", "personal"],
    "date": "2012-02-07"
  },
  "by-the-way": {
    "title": "By The Way",
    "tags": ["intro", "javascript"],
    "date": "2012-02-07",
    "tagline": "This is my Harp post"
  }
}

Now, one /posts/by-the-way, the title will be <title>By The Way | This is my Harp post</title>.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment