This shows a sample layout for a knowledge base. Each square could link to a tag archive page. In this example, font icons from Font Awesome are used for the graphics, and the layout is pulled from the Modern Business theme. .
Here’s the sample knowledge-base style layout:
Knowledge Base Categories
The layout uses Bootstrap 5 cards in a responsive grid. The row-cols-* classes set how many cards appear in each row at different screen widths, and the icons are stacked Font Awesome icons. View the source of this page (pages/mydoc/mydoc_kb_layout.md) to see the code.
Generating a list of all pages with a certain tag
If you don’t want to link to a tag archive index, but instead want to list all pages that have a certain tag, you could use this code:
Getting started pages:
<ul>
{% assign sorted_pages = site.pages | sort: 'title' %}
{% for page in sorted_pages %}
{% for tag in page.tags %}
{% if tag == "getting_started" %}
<li><a href="{{ page.url | remove_first: "/" }}">{{page.title}}</a></li>
{% endif %}
{% endfor %}
{% endfor %}
</ul>
Here’s the result:
Getting started pages:
- About Ruby, Gems, Bundler, and other prerequisites
- About the theme's author
- Getting started with the Documentation Theme for Jekyll
- Install Jekyll on Linux
- Install Jekyll on Mac
- Pages
- Posts
- Release notes 5.0
- Release notes 6.0
- Release notes 7.0
- Release notes 8.0
- Sidebar Navigation
- Support
- Supported features