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

У меня есть следующий код в файле 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>

jekyll jekyll-extensions
person hikaru12    schedule 03.07.2015    source источник

Ответы (1)


arrow_upward
3
arrow_downward

Догадаться. Если вам интересно, как сделать то же самое, сначала настройте страницу 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;
}

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

person hikaru12    schedule 05.07.2015
comment
Это unless p.categories == empty правильно? Что такое p? Мне это кажется неправильным, но я действительно не знаю этого языка, поэтому я просто спрашиваю. - person pgr; 24.04.2017
comment
Возможным улучшением является использование фильтра slugify для создания якорей, превращающего A multi word category в a-multi-word-category. - person pgr; 24.04.2017