---
layout:                                 page
title:                                  Starter Blog
tagline:                                posts by category
date:                                   2023-01-01 01:00:00 +100
description:                            Browse articles by category

categories:                             [ Blog ]
tags:                                   [ Navigator, Categories ]

sort:                                   date
toc:                                    true
fab_menu_id:                            open_toc

pagination:
  enabled:                              false
  permalink:                            /page:num/

analytics:                              true
comments:                               false

exclude_from_search:                    true
regenerate:                             true                                    # needed to update pages

resources:                              [ animate ]
resource_options:
  - attic:
      padding_top:                      400
      padding_bottom:                   50
      opacity:                          0.5
      slides:
        - url:                          /assets/images/modules/attics/matthaeus-1920x1280.jpg
          alt:                          Photo by Matthaeus
          alignY:                       top
          badge:
            type:                       unsplash
            author:                     Matthaeus
            href:                       https://unsplash.com/@matthaeus123
---

{% comment %} Liquid procedures
-------------------------------------------------------------------------------- {% endcomment %}
{% capture get_page_path %}themes/{{site.template.name}}/procedures/global/get_page_path.proc{% endcapture %}
{% capture select_icon_size %}themes/{{site.template.name}}/procedures/global/select_icon_size.proc{% endcapture %}
{% capture get_category_item %}themes/{{site.template.name}}/procedures/global/get_category_item.proc{% endcapture %}
{% capture create_word_cloud %}themes/{{site.template.name}}/procedures/global/create_word_cloud.proc{% endcapture %}

{% comment %} Set config files
-------------------------------------------------------------------------------- {% endcomment %}
{% assign template_config         = site.data.j1_config %}
{% assign blocks                  = site.data.blocks %}
{% assign modules                 = site.data.modules %}
{% assign plugins                 = site.data.plugins %}

{% comment %} Set config data
-------------------------------------------------------------------------------- {% endcomment %}
{% assign blog_navigator_defaults = modules.defaults.blog_navigator.defaults %}
{% assign blog_navigator_settings = modules.blog_navigator.settings %}

{% comment %} Set config options
-------------------------------------------------------------------------------- {% endcomment %}
{% assign blog_navigator_options  = blog_navigator_defaults | merge: blog_navigator_settings %}

{% comment %} Variables
-------------------------------------------------------------------------------- {% endcomment %}
{% assign truncate_words          = site.excerpt_truncate_words %}
{% assign category_blacklist      = template_config.posts.category_blacklist %}


{% if site.permalink == 'none' %}
  {% capture browser_page_url %}{{page.url}}.html{% endcapture %}
{% else %}
  {% capture browser_page_url %}{{page.url}}{% endcapture %}
{% endif %}

{% include {{get_page_path}} mode='absolute' %}
{% assign navigator_path = page_path|remove_first:'archive' %}

{% capture navigator %}{{navigator_path}}{% endcapture %}
{% capture date_view %}{{page_path}}/dateview/{% endcapture %}
{% capture category_view %}{{page_path}}/categoryview/{% endcapture %}
{% capture tag_view %}{{page_path}}/tagview/{% endcapture %}
{% capture all_view %}{{page_path}}/{% endcapture %}

{% if page.sort == 'title' %}
  {% assign sorted_posts = site.posts|sort: 'title' %}
{% elsif page.sort == 'date' %}
  {% assign sorted_posts = site.posts|sort: 'date' %}
{% else %}
  {% assign sorted_posts = site.posts|sort: 'date' %}
{% endif %}

{% comment %} TODO: skip_words NOT longer needed? Already done
by processing of categories
--------------------------------------------------------------------------------
{% capture skip_words %} Posts Public {% endcapture %}
--------------------------------------------------------------------------------
{% endcomment %}

{% comment %} category processing
-------------------------------------------------------------------------------- {% endcomment %}
{% for category in category_blacklist %}
{% assign capitalized = category|capitalize %}
  {% capture black_list %}{{black_list|append: capitalized}}{% unless forloop.last %},{% endunless %}{% endcapture %}
{% endfor %}
{% assign skip_categories = black_list | split: "," | join: " " %}

{% capture site_category_word_list %}{% for category in site.categories %}{{category|first|capitalize|lstrip|rstrip}}{% unless forloop.last %},{% endunless %}{% endfor %}{% endcapture %}
{% assign category_words = site_category_word_list|split:',' %}
{% assign categories = category_words|uniq %}

{% for category in categories %}
  {% if skip_categories contains category %} {% continue %} {% endif %}
  {% capture category_list %}{{category_list|append: category}}{% unless forloop.last %},{% endunless %}{% endcapture %}
{% endfor %}

{% comment %} language detection
-------------------------------------------------------------------------------- {% endcomment %}
{% if site.language == "en" %}
  {% assign language = "en" %}
{% elsif site.language == "de"%}
  {% assign language = "de" %}
{% else %}
  {% assign language = "en" %}
{% endif %}

{% if language == "en" %}
  {% assign readmore_text               = "read" %}
  {% assign category_view_button_text = blog_navigator_options.button_text.view_selector.category_view.en %}
  {% assign date_view_button_text     = blog_navigator_options.button_text.view_selector.date_view.en %}
  {% assign archive_view_button_text  = blog_navigator_options.button_text.view_selector.archive_view.en %}
  {% assign tag_view_button_text      = blog_navigator_options.button_text.view_selector.tag_view.en %}

  {% assign view_headline             = blog_navigator_options.category_view.page_text.en.headline %}
  {% assign view_description_text     = blog_navigator_options.category_view.page_text.en.description %}
{% endif %}

{% if language == "de" %}
  {% assign readmore_text               = "lesen" %}

  {% assign category_view_button_text = blog_navigator_options.button_text.view_selector.category_view.de %}
  {% assign date_view_button_text     = blog_navigator_options.button_text.view_selector.date_view.de %}
  {% assign archive_view_button_text  = blog_navigator_options.button_text.view_selector.archive_view.de %}
  {% assign tag_view_button_text      = blog_navigator_options.button_text.view_selector.tag_view.de %}

  {% assign view_headline             = blog_navigator_options.category_view.page_text.de.headline %}
  {% assign view_description_text     = blog_navigator_options.category_view.page_text.de.description %}
{% endif %}

{% comment %} Debugging
--------------------------------------------------------------------------------
skip_categories:            {{skip_categories | debug}}
site_category_word_list:    {{site_category_word_list | debug}}
--------------------------------------------------------------------------------
{% endcomment %}


{% comment %} Main
-------------------------------------------------------------------------------- {% endcomment %}
<!-- [INFO   ] [ {{page.url}} ] [Generate HTML}] -->
{% include {{create_word_cloud}} source="categories" word_list=category_list %}

<!-- [INFO   ] [ {{page.url}} ] [Generate HTML}] -->
<div class="paginator ml-3">
  <ul class="pagination raised-z0">
    <li class="page-item"><a class="page-link" href="{{navigator|prepend: site.baseurl}}" alt="Blog Navigator">Navigator</a></li>
    <li class="page-item"><a class="page-link" href="{{date_view}}" alt="View by Date">{{date_view_button_text}}</a></li>
    <!-- li class="page-item"><a class="page-link" href="{{tag_view}}" alt="{{tag_view_button_text}}">By Tag</a></li -->
    <li class="page-item"><a class="page-link" href="{{all_view}}" alt="View All">{{archive_view_button_text}}</a></li>
  </ul>
</div>

<div class="post-search-results ml-3">
  {% if blog_navigator_options.category_view.page_text.enabled %}
  <div class="view-description">{{view_description_text}}</div>
  {% endif %}

  <div class="post-headline">
    <h1 id="post-headline notoc" class="mt-5">{{view_headline}}</h1>
  </div>
  {% assign tags = site.categories|sort %}
  {% for tag in tags %}
    {% assign category = tag|first %}
    {% unless category_list contains category %} {% continue %} {% endunless %}
    <h2 id="{{tag|first|downcase}}" class="anchor-link mb-4"><i class="mdi mdi-pin mr-1"></i>{{tag|first|capitalize}}</h2>

      {% for post in sorted_posts %}
        {%if post.categories contains tag[0]%}
          {% assign category = tag|first %}
          {% include {{get_category_item}} category=category %}
          {% include {{select_icon_size}} family=icon_family size=icon_size %}
          {% assign icon_size = size %}
          {% comment %} {% assign excerpt = post.excerpt|truncatewords: truncate_words|replace:'...',' ...'|strip_html %} {% endcomment %}
          {% assign excerpt = post.excerpt|truncatewords: truncate_words|replace:'...',' ...' %}

          <!-- Collect comment provider details -->
          {% for sharing in builder_config.sharing_provider %}
            {% assign provider      = sharing.provider %}
            {% assign likes_count   = sharing.likes_count %}
            {% assign comment_count = sharing.comment_count %}
          {% endfor %}

          <article class="card raised-z3 mb-5">
            <h3 id="{{100000|rand}}" class="card-header bg-primary notranslate">{{post.title}}</h3>
            <div class="row mx-0">

              <!-- [INFO   ] [j1.pages.blog.navigator.archive          ] [Check if post image is available] -->
              {% if post.image %}
              <!-- [INFO   ] [j1.pages.blog.navigator.archive          ] [Post image is available] -->
              <div class="col-md-6 img-bg--fill px-0"
                style="border-right: 1px dotted rgba(0, 0, 0, 0.25); background-image: url({{post.image}});">
              </div>
              {% else %}
              <!-- [INFO   ] [j1.pages.blog.navigator.archive          ] [Post image missing, using configured default image] -->
              <div class="col-md-6 img-bg--fill px-0"
                style="border-right: 1px dotted rgba(0, 0, 0, 0.25); background-image: url({{blog_navigator_options.post_image}});">
              </div>
              {% endif %}

              <div class="col-md-6 p-0">
                <div class="card-body r-text-300">{{excerpt}}</div>
                <div class="card-footer not-rounded r-text-200">
                  <div class="card-footer-text">

                    {% if post.date %}
                      {% if language == "en" %}
                        <i class="mdi mdi-calendar-blank md-grey-600 mr-1"></i>{{post.date | localize: "%Y %B, %e"}}
                      {% endif %}
                      {% if language == "de" %}
                        <i class="mdi mdi-calendar-blank md-grey-600 mr-1"></i>{{post.date | localize: "%-d. %B %Y"}}
                      {% endif %}
                    {% endif %}
                    {% if likes_count %}
                    <span class="font-weight-bold"> · </span>
                    <i class="mdi mdi-heart mr-1"></i> {{likes_count}}
                    {% endif %}
                    {% if comment_count %}
                    <span class="font-weight-bold"> · </span>
                    <i class="mdi mdi-comment mr-1"></i> {{comment_count}}
                    {% endif %}

                    <!-- Cleanup categories by given blacklist -->
                    {% assign my_categories = post.categories | difference: category_blacklist %}

                    <!-- Build element strings -->
                    {% assign categories    = my_categories |join: " · "  %}
                    {% assign tags          = post.tags | join: " · "  %}

                    <p class="result-item-text small text-muted mb-3 notranslate">
                      <i class="mdi mdi-tag-text-outline mdi-18px mr-1"></i>
                      <span class="sr-categories">{{categories}}</span>
                      <br>
                      <i class="mdi mdi-tag mdi-18px mr-1"></i>
                      <span class="sr-tags">{{tags}}</span>
                  </p>

                  </div>
                  <a class="card-link text-muted text-lowercase"
                     href="{{post.url}}#readmore">
                     {{readmore_text}} · {{post.tagline}}
                  </a>
                </div>
              </div>
            </div>
          </article>
        {% endif %}
      {% endfor %}
  {% endfor %}
</div>