Layouts

CMS.js uses a simple templater engine that uses <%= %> to render template data and <% %> to render JavaScript in template. For example, if we wanted to display a post's title and render some JavaScript:

<div>
  <h1><%= data.title %></h1>
  <p><% 5 + 5 %></p>
</div>

We can use these basic rules to build a post list layout by doing:

<div class="posts-list fade-in">
  <% data.posts.forEach(function(post) { %>
    <% if(!post.draft) { %>
      <article class="post">
        <h1 class="post-title">
          <a href="<%= post.permalink %>"><%= post.title %></a>
        </h1>
        <time class="post-date">5/28/2015</time>
        <div class="post-content">
          <% if(post.excerpt) { %>
            <p><%= post.excerpt %></p>
          <% } %>
        </div>
      </article>
    <% } %>
  <% }) %>
</div>