Как отобразить теги в jekyll и заставить тег щелкать по всем соответствующим публикациям коллекции - PullRequest
Новая
       7

Как отобразить теги в jekyll и заставить тег щелкать по всем соответствующим публикациям коллекции

0 голосов
/ 19 февраля 2019

Я хочу отобразить все теги из своих публикаций коллекции на боковой панели, и чтобы каждый тег проходил по всем соответствующим сообщениям.Я также хотел бы отобразить количество раз, которое тег использовался следующим образом:

tag_name (10)

Это то, что у меня есть в настоящее время, когда все теги представлены в виде списка, ноЯ не могу понять, как заставить тег кликать по всем соответствующим страницам, а также отображать размер. 

<ul class="">
    {% assign tags =  site.vacancies | map: 'tags' | join: ','  | split: ',' | uniq %}
     {% for tag in tags %}
        <li class="text-capitalize">
            <a href="{{ tag }}" class="sidebar-tag">{{ tag }}</a>
        </li>
     {% endfor %}
 </ul>

Ответы [ 2 ]

0 голосов
/ 25 марта 2019

Во-первых, извлеките все теги в список с помощью site.tags предоставьте Переменные Jekyll 

{% capture site_tags %}{% for tag in site.tags %}{{ tag | first }}{% unless forloop.last %},{% endunless %}{% endfor %}{% endcapture %}
{% assign tags_list = site_tags | split:',' | sort_natural %}

Во-вторых, получите ссылку для каждого тега с соответствующим количеством сообщений соответственно 

<ul>
  {% for item in (0..site.tags.size) %}{% unless forloop.last %}
    {% capture this_word %}{{ tags_list[item] | strip_newlines }}{% endcapture %}
    <li><a href="#{{ this_word}}" class="tag"><span class="tag-name">{{ this_word }}</span> <span class="count">{{ site.tags[this_word].size }}</span></a></li>
  {% endunless %}{% endfor %}
</ul>

В-третьих, показать название каждого тега, а также имя и дату его сообщения. 

{% for item in (0..site.tags.size) %}{% unless forloop.last %}
  {% capture this_word %}{{ tags_list[item] | strip_newlines }}{% endcapture %}
    <article id="{{ this_word }}">
    <h2 class="tag-heading tag-name">{{ this_word }}</h2>
        <ul>
    {% for post in site.tags[this_word] %}{% if post.title != null %}
      <li><a href="{{ site.url }}{{ post.url }}" title="{{ post.title }}" >{{ post.date | date: '%m/%d/%Y' }} ---- {{ post.title }}</a></li>
    {% endif %}{% endfor %}
        </ul>
    </article>
{% endunless %}{% endfor %}
0 голосов
/ 19 февраля 2019

Таким образом, есть способ сделать это, создав массив тегов, итерируя по публикациям в коллекции и используя много жидкости ... и я решил сделать свой собственный обходной путь.

У меня есть мастерсписок всех тегов, которые я использую, хранится в /_data/tagList.yml.Каждый тег имеет имя и слаг, и вы можете добавить больше полей, например описание, если хотите.Я перебираю данные в tagList, и для каждого тега есть ссылка на выделенную страницу, на которой перечислены все сообщения, содержащие этот тег.

Если вы следовали документам Jekyll иВы использовали tags в начале, и вы последовательно называете свои теги, тогда вы можете использовать фильтр site.tags[tag.name] | size, чтобы подсчитать, сколько сообщений имеет этот тег.

Недостатки этого обходного пути:

  • вам нужно обновлять tagList.yml каждый раз, когда вы создаете новый тег
  • вам нужно создать новую страницу для этого тега (не имеет большого значения, так как вы можете просто скопировать /вставьте код с других страниц тегов и просто измените тег, который вы ищете)
  • вы должны убедиться, что вы последовательны в именовании и использовании тегов 
//   /_data/tagList.yml
- name: Coding
  slug: coding

- name: UnpopularOpinion
  slug: unpopular-opinion

//   /_posts/2019-01-01-example.html
---
tags: [Coding, UnpopularOpinion]
---

//   /blog/tags.html
{% for tag in site.data.tagList %}
    <div>
        <h2><a href="/blog/tags/{{tag.slug}}.html">{{tag.name}}</a></h2>
        {% assign postCount = site.tags[tag.name] | size %}
        <em>
            {% if postCount == 1 %}
                {{postCount}} post
            {% else %}
                {{postCount}} posts
            {% endif %}
        </em>
    </div>
{% endfor %}

//   /blog/tags/coding.html
{% assign numPosts = site.tags.Coding | size %}
{% if numPosts == 0 %}
    <p>No posts have this tag...yet.</p>
{% endif %}

{% for post in site.tags.Coding %}
    ...code to display a post...
{% endfor %}
...