Themes erstellen

Was jedes Template sehen kann

Ein Template holt nie etwas selbst. Es bekommt ein Bündel gebrauchsfertiger Werte — FolioPress nennt es den Kontext — und gibt aus, was es braucht. Ein Teil des Bündels ist auf jeder Seite gleich; der Rest hängt davon ab, welches Template gerendert wird.

Allen Templates gemeinsam

Variable Was sie ist

page Die angezeigte Seite oder der Beitrag, bereits in der aktuellen Sprache (siehe unten). None im Tag-Archiv und in der Suche.

site_title, site_description, footer Aus den Website-Einstellungen, in der aktuellen Sprache. footer ist bereits aus Markdown gerendert.

navigation_menu Das in der Verwaltung konfigurierte Menü: eine Liste von {title, url, slug, page_id}, jede url fertig für diese Sprache.

languages Die Sprachen der Website, nach Code. Jeder Eintrag: code, name, native_name, short_code, menu_label, flag.

current_language, current_language_code, default_language_code Die gerenderte Sprache (gleiche Form wie ein languages-Eintrag), ihr Code und die Hauptsprache der Website.

language_switch_urls Nach Sprachcode: die URL derselben Seite in dieser Sprache, übersetzter Slug inklusive.

home_url, url_language_code Die Startseite in der aktuellen Sprache (/ oder /pt-pt) und das kleingeschriebene Präfix für jede URL, die du selbst baust ('' für die Hauptsprache).

static_url, media_url Woher die Dateien dieses Themes ausgeliefert werden (/static/<theme>) und wo hochgeladene Bilder liegen.

page_title, meta_description, canonical_url, hreflang_urls, social_image_url, twitter_card_type, json_ld Alles, was der <head> braucht: ein sinnvoller Tab-Titel, absolute kanonische und sprachalternative URLs, ein Open-Graph-Bild und strukturierte Daten — alles vorberechnet.

theme_name, theme_info, theme_settings Der Name des aktiven Themes, seine komplette theme.yml und ihr settings-Block.

t Der Übersetzer des Themes: {{ t('Read more') }} schlägt den Satz in locales/<sprache>.json nach (siehe unten).

request Die FastAPI-Anfrage, für den seltenen Fall, dass du Pfad oder Query-Parameter brauchst.

Das page-Objekt

Dieselbe Form, ob Seite, Beitrag oder Eintrag in einer beliebigen Beitragsliste:

Feld Hinweise

title, slug, url In der aktuellen Sprache. url ist vollständig, inklusive Sprachpräfix oder eigener Domain der Sprache.

content Bereits von Markdown in HTML umgewandelt — ausgeben mit {{ page.content | safe }}.

excerpt, meta_description Kurzformen, in der aktuellen Sprache.

poster_image_url Vollständige URL des Titelbilds, oder None.

gallery, content_gallery Bildlisten: {id, url, title, width, height, original_filename}. image.url direkt verwenden.

tags {slug, title, url} für jeden öffentlichen Tag. Private Tags werden nie aufgenommen.

is_post, is_featured, published_at, created_at, updated_at Ob es ein Beitrag ist, ob hervorgehoben, und die Daten.

id Die Datenbank-ID — praktisch für Anker und Cache-Schlüssel.

Beitragslisten

Template Variable Inhalt

home.html posts (Alias recent_posts), pages, is_home Beiträge, die einen Tag mit der Startseite teilen, in Anzahl und Reihenfolge aus dem home-Abschnitt der theme.yml. Eine Startseite ohne Tags bekommt keine Beiträge — tagge sie, um sie zu füllen.

page.html posts (Alias page_posts) Beiträge, die einen Tag mit dieser Seite teilen, aus dem page-Abschnitt. So listet eine „Blog“-Seite ihre Beiträge.

post.html related_posts, is_post Andere Beiträge, die einen Tag mit diesem teilen, aus dem post-Abschnitt.

tag.html tag (title, slug), posts Jeder veröffentlichte Beitrag mit diesem Tag, aus dem tag-Abschnitt.

search.html search_query, search_results, results_count Der eingegebene Begriff und die passenden Seiten und Beiträge.

Jede Beitragsliste kommt mit einer Paginierung gleicher Form: has_pagination, current_page, total_pages, has_previous, has_next, previous_page, next_page und pagination_urls mit first, previous, next und last — None, wo es nicht weitergeht. Ist has_pagination in der theme.yml aus, wird die Liste einfach bei posts abgeschnitten und die Flags bleiben falsch.

Sprachen und der Umschalter

Zwei der Sprachfelder werden für dich berechnet. short_code ist nur der Sprachcode — EN —, es sei denn, die Website hat auch eine andere Variante derselben Sprache aktiviert; dann behält er seine Region: EN-US und EN-GB. menu_label folgt derselben Regel mit Namen: English, oder English (US) und English (UK). Das ist genau die Regel des Sprachumschalters der Verwaltung, sodass Website und Verwaltung sich nie über eine Beschriftung uneinig sind. Ein vollständiger Umschalter ist deshalb kurz:

{% if languages | length > 1 %} <button type="button" aria-label="{{ t('Change language') }}"> {{ current_language.short_code }} </button> <ul> {% for lang in languages.values() | sort(attribute='menu_label') %} <li> {% if lang.code == current_language.code %} <span aria-current="true">{{ lang.menu_label }}</span> {% else %} <a href="{{ language_switch_urls[lang.code] }}" hreflang="{{ lang.code }}">{{ lang.menu_label }}</a> {% endif %} </li> {% endfor %} </ul> {% endif %}

language_switch_urls zeigt bereits auf dieselbe Seite in jeder Sprache — auf den übersetzten Slug oder, falls diese Übersetzung noch fehlt, auf die Startseite —, sodass ein Umschalter nie selbst eine URL baut.

Brauchst du noch Hilfe? Schreib uns im Admin deiner Website (Support) oder an support@foliopress.io.