Как связать категории сообщений в Jekyll

Question

У меня есть следующий код в моем index.html для Jekyll. Я пытаюсь найти способ связать категории, связанные с каждым сообщением, с самим постом. Итак, если сообщение содержит категорию «путешествия», я хочу нажать ссылку, в которой говорится «путешествие», которое приведет меня ко всем позициям, классифицированным как таковые.

<ul class="post-list" style="list-style-type: none;"> 
{% for post in paginator.posts %} 
    {% unless post.categories contains 'portfolio' %} 
    <li> 
    <h3><a href="{{ post.url }}">{{ post.title }}</a></h3> 
    <span class="post-meta">{{ post.date | date: "%c" }}</span> &nbsp; 
    Filed In: 
    {% unless p.categories == empty %} 
        {% for categories in post.categories %} 
         <a href="/{{ categories | first }}">{{ categories }}</a> //problem area 
        {% endfor %} 
       {% endunless %} 
    &nbsp; 
    {{ post.excerpt }} <a href="{{ post.url }}">Find out more...</a><br><br>  
    </li> 
    {% endunless %} 
    {% endfor %} 
</ul> 

Answer 1

Обдумал это. Для кого-то еще интересно, как это сделать, сначала настройте страницу categories.html в корневом каталоге. На этой странице будут перечислены все сообщения, соответствующие определенной категории. Он превращает имена категорий в именованные якорные пули как таковые <a href="#{{ category | first | remove:' ' }}", а затем предыдущий код создает фактический именованный якорь div, который отображает сообщение, связанное с этой категорией. Наконец, в разделе или разделе, где вы хотите отобразить список категорий, вы представляете последний бит кода, который ссылается на именованный анкерный раздел на вашей странице categories.html.

Первый кусок кода, чтобы войти в Categories.html:

<h2>Posts by Category</h2> 
<ul> 
{% for category in site.categories %} 
<li><a href="#{{ category | first | remove:' ' }}"><strong>{{ category | first }}</strong></a></li> 
{% if forloop.last %} 
    {% else %} 
    {% endif %} 
    {% endfor %} 
</ul> 

Второй кусок кода, чтобы войти в Categories.html:

{% for category in site.categories %} 
<div class="catbloc" id="{{ category | first | remove:' ' }}"> 
<h2>{{ category | first }}</h2> 
<ul> 
{% for posts in category %} 
{% for post in posts %} 
{% if post.url %} 
<li> 
    <a href="{{ post.url }}"> 
<time>{{ post.date | date: "%B %d, %Y" }}</time> - 
{{ post.title }} 
</a> 
</li> 
{% endif %} 
{% endfor %} 
{% endfor %} 
</ul> 
    </div> 
    {% endfor %} 

Третий кусок кода, чтобы идти туда, где вы хотите отображать именованный якорь связанные категории:

Filed In: 
{% unless p.categories == empty %} 
{% for categories in post.categories %} 
<a href="http://localhost:4000/category.html#{{categories}}">{{ categories }}</a> 
{% endfor %} 
{% endunless %} 

Используйте следующий CSS для предотвращения прежде чем вы нажимаете на них:

.catbloc:not(:target){ 
display: none; 
} 

Надеюсь, это поможет!