feat: add multi-language support

This commit is contained in:
welpo
2023-05-22 19:12:03 +02:00
parent e316dc25ab
commit fa9229377d
49 changed files with 1314 additions and 88 deletions

View File

@@ -1,10 +1,19 @@
{% extends "page.html" %}
{% block main_content %}
<main class="centered-header">
<main class="centered-text">
{{ macros_page_header::page_header(title="404")}}
<span>not found</span>
<div class="subheader">not found</div>
{# Default English message #}
<p>The page you requested doesn't seem to exist or has not been translated to your language yet. Check the URL for errors, or <a href="{{ config.base_url }}">return to the homepage</a>.</p>
{# Iterate through each language and display the localised 404 message along with a "Go Home" link #}
{%- for language_name, language in config.languages -%}
{%- if language_name != config.default_language -%}
<p>{{ trans(key="404_error", lang=language_name) }} <a href="{{ config.base_url }}/{{ language_name }}/">{{ trans(key="go_home", lang=language_name) }}</a>.</p>
{%- endif -%}
{%- endfor -%}
</main>
{% endblock main_content %}

View File

@@ -4,30 +4,42 @@
{{ macros_page_header::page_header(title=section.title) }}
{# Set locale for date #}
{%- if lang != config.default_language %}
{% set date_locale = trans(key="date_locale" | safe, lang=lang) %}
{% else %}
{% set date_locale = "en_GB" %}
{% endif %}
<div class="archive">
<ul class="list-with-title">
{% set section_item = get_section(path="blog/_index.md") %} {% for year, posts in
section_item.pages | group_by(attribute="year") %} {% if posts | length > 0
%}
<li>
<h2 class="listing-title">{{ year }}</h2>
<ul class="listing">
{% for post in posts %}
<li class="listing-item">
<div class="post-time">
<span class="date">
{{ post.date | date(format="%d %b") }}
</span>
</div>
<a href="{{ post.permalink }}" title="{{ post.title }}"
>{{ post.title }}</a
>
<ul class="list-with-title">
{%- if lang == config.default_language %}
{%- set section_item = get_section(path="blog/" ~ "_index.md") %}
{%- else %}
{%- set section_item = get_section(path="blog/" ~ "_index." ~ lang ~ ".md") %}
{%- endif %}
{% for year, posts in
section_item.pages | group_by(attribute="year") %} {% if posts | length > 0
%}
<li>
<h2 class="listing-title">{{ year }}</h2>
<ul class="listing">
{% for post in posts %}
<li class="listing-item">
<div class="post-time">
<span class="date">
{{ post.date | date(format="%d %b", locale=date_locale) }}
</span>
</div>
<a href="{{ post.permalink }}" title="{{ post.title }}"
>{{ post.title }}</a>
</li>
{% endfor %}
</ul>
{% endif %} {% endfor %}
</li>
{% endfor %}
</ul>
{% endif %} {% endfor %}
</li>
</ul>
</ul>
</div>
{% endblock main_content %}

View File

@@ -10,19 +10,19 @@
<ul class="meta">
{% if page.draft %}
<li class="draft-label">DRAFT</li>
<li class="draft-label">{%- if lang != config.default_language %} {{ trans(key="draft" | safe, lang=lang) }} {% else %} DRAFT {% endif %}</li>
{% endif %}
{% if page.date %}
<li>{{ macros_format_date::format_date(date=page.date, short=true) }} {{ separator }}</li>
{% endif %}
<li title="{{ page.word_count }} words">&nbsp;{{ page.reading_time }} min read</li>
<li title="{{ page.word_count }} {%- if lang != config.default_language %} {{ trans(key="words" | safe, lang=lang) }} {% else %} words {% endif %}">&nbsp;{{ page.reading_time }}{%- if lang != config.default_language %} {{ trans(key="min_read" | safe, lang=lang) }} {% else %} min read {% endif %}</li>
{% if page.taxonomies and page.taxonomies.tags %}
<li>&nbsp;{{ separator }}&nbsp;Tags:&nbsp;</li>
<li>&nbsp;{{ separator }}&nbsp;{%- if lang != config.default_language -%}{{ trans(key="tags" | safe, lang=lang) | capitalize }}{% else %}Tags{%- endif -%}:&nbsp;</li>
{% for tag in page.taxonomies.tags %}
<li><a href={{ get_taxonomy_url(kind='tags' , name=tag) | safe }}>{{ tag }}</a>
<li><a href={{ get_taxonomy_url(kind='tags', name=tag, lang=lang) | safe }}>{{ tag }}</a>
{%- if not loop.last -%}
,&nbsp;
{%- endif -%}
@@ -31,7 +31,7 @@
{% endif %}
{% if page.updated %}
</ul><ul class="meta last-updated"><li>Last updated on {{ macros_format_date::format_date(date=page.updated, short=true) }}</li>
</ul><ul class="meta last-updated"><li>{%- if lang != config.default_language %} {{ trans(key="last_updated_on" | safe, lang=lang) }} {% else %} Last updated on {% endif %} {{ macros_format_date::format_date(date=page.updated, short=true) }}</li>
{% endif %}
</ul>
@@ -46,7 +46,7 @@
{% if page.extra.toc | default(value=false) %}
{% if page.toc %}
<div class="toc-container">
<h3>Table of Contents</h3>
<h3>{%- if lang != config.default_language %} {{ trans(key="table_of_contents" | safe, lang=lang) }} {% else %} Table of Contents {% endif %}</h3>
<ul>
{% for h1 in page.toc %}
<li>

View File

@@ -1,10 +1,15 @@
{% macro format_date(date, short) %}
{% if config.extra.short_date_format and short %}
{{ date | date(format=config.extra.short_date_format) }}
{% elif config.extra.long_date_format and not short %}
{{ date | date(format=config.extra.long_date_format) }}
{# Set locale #}
{%- if lang != config.default_language %}
{% set date_locale = trans(key="date_locale" | safe, lang=lang) %}
{% else %}
{% set date_locale = "en_GB" %}
{% endif %}
{% if config.extra.long_date_format and not short %}
{{ date | date(format=config.extra.long_date_format, locale=date_locale) }}
{% elif not config.extra.short_date_format and date_locale == "en_GB" %}
{% set day = date | date(format='%-d') | int %}
{% if day in [11, 12, 13] %}
@@ -29,6 +34,8 @@
{% else %}
{{ date | date(format="%B %Y") }}
{% endif %}
{% elif short %}
{{ date | date(format="%d %b %Y", locale=date_locale) }}
{% endif %}
{% endmacro %}

View File

@@ -25,7 +25,7 @@
{% if post.taxonomies.tags %}
<div class="bloglist-tags">
{% for tag in post.taxonomies.tags %}
<a class="tag" href="{{ get_taxonomy_url(kind="tags", name=tag) }}">{{ tag }}</a>
<a class="tag" href="{{ get_taxonomy_url(kind='tags', name=tag, lang=lang) | safe }}">{{ tag }}</a>
{% endfor %}
</div>
{% endif %}
@@ -38,14 +38,14 @@
{% endif %}
</div>
<a class="readmore" href={{ post.permalink }}>Read more </a>
<a class="readmore" href={{ post.permalink }}>{%- if lang != config.default_language %} {{ trans(key="read_more" | safe, lang=lang) }} {% else %} Read more {% endif %}</a>
</div>
</section>
{% endif %}
{% if not loop.last %}
{% if loop.index == max %}
<div class="all-posts">
<a href="{{ get_url(path="/blog/") }}">All posts </a>
<a href="{{ get_url(path="blog", lang=lang) }}/">{%- if lang != config.default_language %} {{ trans(key="all_posts" | safe, lang=lang) }} {% else %} All posts {% endif %}</a>
</div>
{% endif %}
{% endif %}

View File

@@ -4,25 +4,25 @@
<ul class="pagination">
{% if paginator.previous %}
<li class="page-item page-prev">
<a href="{{ paginator.previous }}" class="page-link" aria-label="Previous page">← Prev</a>
<a href="{{ paginator.previous }}" class="page-link" aria-label="{%- if lang != config.default_language %} {{ trans(key="prev" | safe, lang=lang) }}{% else %} Prev {%- endif -%}">← {%- if lang != config.default_language %} {{ trans(key="prev" | safe, lang=lang) }}{% else %} Prev {%- endif -%}</a>
</li>
{% else %}
<li class="page-item page-prev">
<span class="page-link disabled" aria-disabled="true" aria-label="Previous (disabled)">Prev</span>
<span class="page-link disabled" aria-disabled="true" aria-label="{%- if lang != config.default_language %} {{ trans(key="prev" | safe, lang=lang) }}{% else %} Prev {%- endif -%} (disabled)">{%- if lang != config.default_language %} {{ trans(key="prev" | safe, lang=lang) }}{% else %} Prev {%- endif -%}</span>
</li>
{% endif %}
<li class="page-item page-numbers">
{{ paginator.current_index }} of {{ paginator.number_pagers }}
{{ paginator.current_index }} {%- if lang != config.default_language %} {{ trans(key="of" | safe, lang=lang) }}{% else %} of {%- endif %} {{ paginator.number_pagers }}
</li>
{% if paginator.next %}
<li class="page-item page-next">
<a href="{{ paginator.next }}" class="page-link" aria-label="Next page">Next</a>
<a href="{{ paginator.next }}" class="page-link" aria-label="{%- if lang != config.default_language %} {{ trans(key="next" | safe, lang=lang) }}{% else %} Next {%- endif -%}">{%- if lang != config.default_language %} {{ trans(key="next" | safe, lang=lang) }}{% else %} Next {%- endif %}</a>
</li>
{% else %}
<li class="page-item page-next">
<span class="page-link disabled" aria-disabled="true" aria-label="Next page (disabled)">Next</span>
<span class="page-link disabled" aria-disabled="true" aria-label="{%- if lang != config.default_language %} {{ trans(key="next" | safe, lang=lang) }}{% else %} Next {%- endif -%} (disabled)">{%- if lang != config.default_language %} {{ trans(key="next" | safe, lang=lang) }}{% else %} Next {%- endif %}</span>
</li>
{% endif %}
</ul>

View File

@@ -5,7 +5,14 @@
{%- set custom_separator = config.extra.separator | default(value="•") -%}
{%- set separator = " " ~ custom_separator ~ " " -%}
{%- if current_path and current_path == "/" -%}
{# Get the base path for the current language. #}
{%- if lang != config.default_language %}
{%- set base_path = "/" ~ lang ~ "/" %}
{%- else -%}
{%- set base_path = "/" %}
{%- endif %}
{%- if current_path and current_path == base_path -%}
{%- set suffix = "" -%}
{%- set separator = "" -%}
{% elif title %}
@@ -19,9 +26,13 @@
{%- set suffix = term.name -%}
{% elif taxonomy.name %}
{# List of tags. #}
{%- set suffix = taxonomy.name | capitalize -%}
{%- if lang != config.default_language -%}
{%- set suffix = trans(key=taxonomy.name | safe, lang=lang) | capitalize -%}
{% else %}
{%- set suffix = taxonomy.name | capitalize -%}
{% endif %}
{% else %}
{%- set suffix = "Lost?" %}
{%- set suffix = "404" %}
{%- endif -%}
{# Return the final concatenated string. #}

View File

@@ -14,7 +14,7 @@
{% endif %}
</nav>
<div class="credits">
<small>Powered by <a href="https://www.getzola.org" target="_blank">Zola</a> & <a href="https://github.com/welpo/tabi" target="_blank">tabi</a></small>
<small>{%- if lang != config.default_language %} {{ trans(key="powered_by" | safe, lang=lang) }} {% else %} Powered by {% endif %} <a href="https://www.getzola.org" target="_blank">Zola</a> {%- if lang != config.default_language %} {{ trans(key="and" | safe, lang=lang) }} {% else %} & {% endif %} <a href="https://github.com/welpo/tabi" target="_blank">tabi</a></small>
</div>
</section>
</footer>

View File

@@ -1,17 +1,67 @@
<header>
<nav class="navbar">
<div class="nav-title">
<a class="home-title" href={{ config.base_url }}>{{ config.title }}</a>
<a class="home-title" href={{ get_url(path="/", lang=lang) }}>{{ config.title }}</a>
</div>
{%- if config.extra.menu %}
<div class="nav-navs">
<ul>
{% for menu in config.extra.menu %}
<li>
<a class="nav-links no-hover-padding" href={{ menu.url | safe | replace(from="$BASE_URL" , to=config.base_url) }}>{{ menu.name }}</a>
{%- if config.extra.menu %}
{% for menu in config.extra.menu %}
<li>
<a class="nav-links no-hover-padding" href={{ get_url(path=menu.url, lang=lang) | safe | replace(from="$BASE_URL", to=config.base_url) }}/>
{%- if lang != config.default_language -%}
{{ trans(key=menu.name | safe, lang=lang) }}
{%- else -%}
{{ menu.name | safe }}
{%- endif -%}
</a>
</li>
{% endfor %}
{%- endif -%}
{# Language switcher #}
{# Display the language switcher only if more than one language is available #}
{%- if config.languages | length > 1 %}
<li class="language-switcher">
<div class="dropdown" type="Button">
<div class="language-switcher-icon"></div>
{# Display the current language first in the dropdown #}
<div class="dropdown-content">
{%- if lang != config.default_language %}
{{ trans(key="language_name" | safe, lang=lang) }}
{% else %}
{{ config.extra.language_name.en }}
{%- endif %}
{# Loop through all the available languages in the config #}
{%- for lcode, language_name in config.extra.language_name -%}
{# Skip the current language to avoid linking to the current page #}
{%- if lang != lcode -%}
{# Check if the language code matches the default language #}
{%- if lcode == config.default_language -%}
{# If it does, link to the root path (no language code in URL) #}
<a type="Button" href="{{ current_url | replace(from=current_path | default(value="") | truncate(length=4, end=""), to="/") }}">{{ language_name }}</a>
{%- else -%}
{# Check if the current language is the default language #}
{%- if lang == config.default_language -%}
{# If it is, append the language code to the base URL #}
<a type="Button" href="{{ config.base_url }}/{{ lcode }}{{ current_path | default(value="/") | safe }}">{{ language_name }}</a>
{%- else -%}
{# If it's not, replace the current language code in the URL with the new one #}
<a type="Button" href="{{ current_url | replace(from='/' ~ lang ~ '/', to='/' ~ lcode ~ '/') }}"/>{{ language_name }}</a>
{%- endif -%}
{%- endif -%}
{%- endif -%}
{%- endfor -%}
</div>
</div>
</li>
{% endfor %}
{%- endif %}
{# Theme switcher #}
{%- if config.extra.theme_switcher == true -%}
<li class="theme-switcher-wrapper">
<div class="theme-switcher"></div>

View File

@@ -2,14 +2,26 @@
{% block main_content %}
{{ macros_page_header::page_header(title="All tags")}}
{%- if lang != config.default_language %}
{% set title = trans(key="tags_title" | safe, lang=lang) %}
{% else %}
{% set title = "All tags" %}
{% endif %}
{{ macros_page_header::page_header(title=title)}}
<div class="tag-cloud">
<ul class="tags">
{%- for term in terms -%}
<li class="tags-item" id "{{ term.name }}"><a href="{{ term.permalink | safe }}">
{{ term.name }}</a>
{{ term.pages | length }} post{{ term.pages | length | pluralize }}
{{ term.pages | length }}{%- if term.pages | length == 1 %}
{# Only one post. Singular. #}
{%- if lang != config.default_language %} {{ trans(key="post" | safe, lang=lang) }}{% else %} post {%- endif -%}
{% elif term.pages | length > 1 %}
{# More than one post per tag. Plural. #}
{%- if lang != config.default_language %} {{ trans(key="posts" | safe, lang=lang) }}{% else %} posts {%- endif -%}
{%- endif -%}
</li>
{%- endfor -%}
</ul>

View File

@@ -9,7 +9,7 @@
<ul class="pagination">
<li class="page-item">
<a class="all-tags" href="{{ get_url(path="/tags/") }}">All tags</a>
<a class="all-tags" href="{{ get_url(path="tags", lang=lang) }}/">{%- if lang != config.default_language %} {{ trans(key="all_tags" | safe, lang=lang) }}{% else %} All tags {%- endif -%}</a>
</li>
</ul>