Quais são algumas boas maneiras de implementar trilhas de navegação em um site Jekyll?
Estou ciente de que existem migalhas de pão de nível único emhttp: //raphinou.github.com/jekyll-base mas estou procurando algumas boas maneiras de terbreadcrumbs em um site Jekyll quando os diretórios atingem uma profundidade de quatro ou cinco níveis.
(Sim, estou ciente de que o Jekyll é principalmente um mecanismo de blog e que talvez eu não deva usá-lo para um site de uso geral, especialmente com muitos níveis de diretório. Também estou ciente dehttp: //octopress.or mas não encontrou um plugin adequado.)
Baseado fortemente emhttp: //forums.shopify.com/categories/2/posts/2217 Eu vim com o seguinte layout Jekyll para migalhas de pão, cuja variação você pode ver em ação emhttp: //crimsonfu.github.com/members/pdurbi. Você deve ver a farinha de rosca "home »membros»" no topo
Aqui está o meu layout. Sim, é feio. Eu não estudei muito líquido. Você pode sugerir uma maneira melhor?
<html>
<head>
<title>{{ page.title }}</title>
<style type="text/css">
#bread ul {
padding-left: 0;
margin-top: 2px;
margin-bottom: 2px;
}
#bread ul li {
display: inline;
font-size: 70%;
}
</style>
</head>
<body>
<div id="bread">
<ul>
{% assign url = {{page.url}} %}
{% assign delimiter = '/' %}
{% capture allparts %}{{ url | replace: delimiter, ' ' }}{% endcapture %}
{% capture myFirstWord %}{{ allparts | truncatewords: 1 | remove: '...' }}{% endcapture %}
{% capture minusFirst %}{{ allparts | replace_first: myFirstWord, '' }}{% endcapture %}
{% capture mySecondWord %}{{ minusFirst | truncatewords: 1 | remove: '...' }}{% endcapture %}
{% capture minusSecond %}{{ minusFirst | replace_first: mySecondWord, '' }}{% endcapture %}
{% capture myThirdWord %}{{ minusSecond | truncatewords: 1 | remove: '...' }}{% endcapture %}
{% capture minusThird %}{{ minusSecond | replace_first: myThirdWord, '' }}{% endcapture %}
{% capture myFourthWord %}{{ minusThird | truncatewords: 1 | remove: '...' }}{% endcapture %}
{% capture minusFourth %}{{ minusThird | replace_first: myFourthWord, '' }}{% endcapture %}
{% capture myFifthWord %}{{ minusFourth | truncatewords: 1 | remove: '...' }}{% endcapture %}
{% if myFirstWord contains '.html' %}
<li><a href="/">home</a> </li>
{% elsif mySecondWord contains '.html' %}
<li><a href="/">home</a> » </li>
{% unless mySecondWord == 'index.html' %}
<li><a href="/{{myFirstWord}}">{{myFirstWord}}</a> » </li>
{% endunless %}
{% elsif myThirdWord contains '.html' %}
<li><a href="/">home</a> » </li>
<li><a href="/{{myFirstWord}}">{{myFirstWord}}</a> » </li>
{% unless myThirdWord == 'index.html' %}
<li><a href="/{{myFirstWord}}/{{mySecondWord}}">{{mySecondWord}}</a> » </li>
{% endunless %}
{% elsif myFourthWord contains '.html' %}
<li><a href="/">home</a> » </li>
<li><a href="/{{myFirstWord}}">{{myFirstWord}}</a> » </li>
<li><a href="/{{myFirstWord}}/{{mySecondWord}}">{{mySecondWord}}</a> » </li>
{% unless myFourthWord == 'index.html' %}
<li><a href="/{{myFirstWord}}/{{mySecondWord}}/{{myThirdWord}}">{{myThirdWord}}</a> » </li>
{% endunless %}
{% elsif myFifthWord contains '.html' %}
<li><a href="/">home</a> » </li>
<li><a href="/{{myFirstWord}}">{{myFirstWord}}</a> » </li>
<li><a href="/{{myFirstWord}}/{{mySecondWord}}">{{mySecondWord}}</a> » </li>
<li><a href="/{{myFirstWord}}/{{mySecondWord}}/{{myThirdWord}}">{{myThirdWord}}</a> » </li>
{% unless myFifthWord == 'index.html' %}
<li><a href="/{{myFirstWord}}/{{mySecondWord}}/{{myThirdWord}}/{{myFourthWord}}">{{myFourthWord}}</a> » </li>
{% endunless %}
{% else %}
<li><a href="/">home</a> » </li>
<li><a href="/{{myFirstWord}}">{{myFirstWord}}</a> » </li>
<li><a href="/{{myFirstWord}}/{{mySecondWord}}">{{mySecondWord}}</a> » </li>
<li><a href="/{{myFirstWord}}/{{mySecondWord}}/{{myThirdWord}}">{{myThirdWord}}</a> » </li>
<li><a href="/{{myFirstWord}}/{{mySecondWord}}/{{myThirdWord}}/{{myFourthWord}}">{{myFourthWord}}</a> » </li>
{% endif %}
</ul>
</div>
<h1>{{ page.title }}</h1>
{{ content }}
</body>
</html>