ranieri
ranieri

Reputation: 2078

Jekyll multidirectory website

I'm moving my website to Jekyll since Wordpress is way too bloated and far from easy to use for a simple blog+portfolio. I am then facing a problem which I could not solve looking at the documentation (and even the examples, since they are very very simple).

I want to have a site with a landing page at / (ok), a blog on the directory /blog/ and the posts at /blog/post-title/ (ok, I think) and a portfolio with my jobs at /portfolio/ with jobs at /portfolio/job-title/, but I cannot create this last directory.

I tried creating a _jobs dir inside the portfolio dir, and then looping through it with

{% for job in site.jobs %}
  ...html...
{% endfor %}

Since the blog example uses this same syntax, but with posts instead of jobs. How should I do to access this portfolio/_jobs directory and loop through the files?

The tree of the Jekyll folder is as follows:

.
├── blog
│   ├── index.html
│   └── _posts
│       ├── 2013-02-19-hello-world.markdown
│       └── 2014-03-01-welcome-to-jekyll.markdown
├── _config.yml
├── css
│   ├── main.css
│   └── syntax.css
├── _includes
│   ├── footer.html
│   ├── header.html
│   └── sidebar.html
├── _layouts
│   ├── default.html
│   ├── job.html
│   └── post.html
├── portfolio
│   ├── index.html
│   └── _jobs
│       └── jekyll-portfolio.markdown

Upvotes: 1

Views: 209

Answers (1)

David Hutchison
David Hutchison

Reputation: 2353

Jekyll does not support this as simply as in your example yet, it is coming in 2.0 however.

You could add a key/value pair to the YAML header of the child pages to signify that it should appear on the main portfolio index page. I have a similar setup that I use to define what pages should appear in the main navigation for my site.

The URL customisation for the portfolio pages can only be achieved by using the permalink setting in the YAML header of each child page.

portfolio/jobs/jekyll-portfolio.markdown etc

---
group: jobs
---

portfolio/index.html

<ul>
{% for node in site.pages %}
    {% if 'jobs' == node.group %}
    <li><a href="{{node.url}}">{{node.title}}</a></li>
    {% endif %}
{% endfor %}
</ul>

You may be able to avoid requiring the group attribute if you changed the if condition to do substring matching of the URL, but this solution is easier to understand.

Upvotes: 2

Related Questions