Question

Just like this page http://brandonmathis.com/projects/, how can I create a project with its own index?

Was it helpful?

Solution

Here's one option:

Create a directory called projects in your Octopress site root. Inside it, put a file 'index.html' and a directory _posts: so you'll have something along the lines of this:

_layouts/
_plugins/
_posts/
    some_post_that_is_not_a_project.md
projects/
    index.html
    _posts/
        some_project.md
        some_other_project.md
index.html
config.yml

Any post you make inside that _posts directory will automatically belong to the 'projects' category. This means that you can then put something like the following in projects/index.html:

<ul>
{% for post in site.categories.projects %}
    <li>
    <a href="/{ post.permalink }}">
        <img src="{{ post.image }} alt="{{ post.title }}></img>
        <h3>{{ post.title }}</h3>
        <p>{{ post.summary }}</p>
    </a>
    </li>
{% endfor %}
</ul>

And then have posts like this:

---
title: Fancy buttons
image: /path/to/some/image.jpg
summary: |
    I created Fancy Buttons (a Compass plugin) to make it easy to design gorgeous
    customizable CSS buttons in seconds.
|
---

Here is the longer content of this post etc etc which will
appear on the project page itself...

This is a nice way of doing it, because you have a clear, sensible directory structure that's easy to navigate and maintain.

Hope this helps.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top