Step Back Template Navigation für Pico

home pico twig

Ohne Vorwissen zur eigenen Website mit WordPress 6   -  WordPress gibt es in zwei Versionen. Sie können entweder direkt auf wordpress.com einen Blog erstellen. Oder Sie laden sich Ihre WordPress-Version von wordpress.org herunter und erstellen Ihre Website auf dem eigenen Webspace. Und wie das geht, erfahren Sie in diesem WordPress-Einsteigerbuch. Zur Seite steht Ihnen der beliebte und erfahrene Trainer Peter Müller. Seit vielen Jahren hilft er mit seinen Büchern Einsteigern beim Erstellen eigener Webseiten, ob mit HTML und CSS oder mit WordPress.

Wir sind Mitglied im Amazon.Partnernet und können mit Affiliate-Links den Betrieb der Webseite etwas unterstützen, für Sie als Leser ist das natürlich vollkommen kostenlos.

Möchten Sie einen Zurück-Button in jedem Beitragsverzeichnis im PICO CMS implementieren, dann lesen Sie diesen Beitrag und nutzen das folgende Coding.

Inhalt

Step Back Navigation

Im CMS Pico gibt es leider keine vorgefertigte Methode, um aus einer tiefen Schachtelungsebene immer eine Ebene nach oben zur root aufzusteigen. Sie können daher das folgende kleine Codeschnipsel nutzen.

007  {% set path_back = "" %}
008  {% set path_url  = current_page.id %}
009  {% set path_url  = path_url|replace({'/index': ''}) %}
010
011  {% for directory in path_url|split('/', -1) %}
012      {% set path_back = [path_back, '/', directory]|join %}
013  {% endfor %}
014        
015  {% if path_back is empty %}
016      <a class="navbar-brand text-white" href="{{base_url}}">&#187; home &#171;</a>
017  {% else %}
018      <a class="navbar-brand text-white" href="?{{path_back}}">&#187; zurück: &ensp; {{path_back}} &#171;</a>
019  {% endif %}

Code

Das Codebeispeil ermittelt ausgehend von der angezeigten Seite den aktuellen Pfad, baut daraus einen Link auf mit dessen Hilfe der Leser immer zum übergeordneten Ordner gelangen kann, bis er letztendlich auf der Startseite der Domain angelangt ist. Erläuterung

007 - Variable die die vollständige Link-URL aufnehmen wird.

008 - Diese Variable enthält den Pfad inklusive der aktuellen Seite.

009 - mach aus: pfad-0/pfad-1/index den neuen Pfad: pfad-0/pfad-1, der Substring "/index" wird durch "" (nichts) ersetzt.

011 - Iterator durch das ARRAY directory, abzüglich des Verzeichnis in dem sich der Leser aktuell befindet (daher split -1). (siehe: Twig split)

012 - Konkatiniert (siehe: Twig join) einen neuen Pfad aus allen übergeordneten Einzel-Directorys zusammen und speichert dies in der Variable path_back ab.

015 - Ist path_back leer, steht der Leser entweder im ersten Unterordner oder auch der Startseite. In beiden Fällen wird der Link zur Startseite angezeigt.

018 - Ist path_back gefüllt, so steigt der Leser mit diesem Link immer einen Ordner weiter nach oben auf.

Das Codesegment ist im Kopfbereich gut aufgehoben, damit der Leser schnell und bequem sich nach oben navigieren kann. Das Beispiel ist speziell für das CSS-Framework Bootstrap entwickelt. Wenn Sie ein anderes CSS nutzen, müssen Sie die class-Angaben entsprechend anpassen oder weg lassen.


 28.01.2024    Kontakt@Oliver-Lohse.de    Breadcrumb Navigation

COBOL - Altsysteme warten und erweitern. Das umfassende Praxis-Handbuch   -  Dieses Buch richtet sich an erfahrene Entwickler objektorientierter Sprachen wie C++ oder Java. Es vermittelt die Funktionsweise der Programmiersprache COBOL, um die in zahlreichen Implementierungen auf unterschiedlichen Plattformen immer noch produktiv laufenden COBOL-Programme zu verstehen, zu warten und bei Bedarf mit zusätzlichen Funktionalitäten zu erweitern. Dafür bietet es Ihnen sowohl eine grundlegende Einführung in die Programmierung mit COBOL als auch eine thematisch gegliederte Referenz der Befehle mit praktischen Beispielen.

Wir sind Mitglied im Amazon.Partnernet und können mit Affiliate-Links den Betrieb der Webseite etwas unterstützen, für Sie als Leser ist das natürlich vollkommen kostenlos.

Weitere passende Beiträge

PicoPagesList mit Twig ohne Plugin realisieren

 pico  Breadcrumb Navigation PicoPagesList


Pico CMS bietet das Plugin PicoPagesList, das weitere Beiträge des Ordners zeigt, alternativ kann diese Funktion mit Twig ohne Plugin realisiert werden

Breadcrumb Navigation mit split('/')

 pico  Breadcrumb Navigation


Eine Breadcrumb Navigation können Sie leicht mit Befehlen des Twig in PICO CMS leicht selbst erzeugen - so gehts.

Breadcrumb Navigation anpassen

 automad  Navigation Breadcrumb


Passen Sie die beliebte Breadcrumb Navigation in Ihrer Webseite an eigene Wünsche an. Versuchen Sie den Codeschnipsel des Beitrags und werten Ihren Blog auf.

Bessere Breadcrumb Navigation mit Twig

 pico  Breadcrumb Navigation


Mit wenigen Twig-Befehlen implementieren Sie eine Breadcrumb-Navigation in einem Twig-Template für das PICO CMS

Top- und Sub-Level Menüs

 pico  Menue Navigation


Top-Level vs Sub-Level Menüs in Pico CMS. Zeigen Sie immer die oberen Menüebene oder die aktuell untergeordneten Menüebene an. Mit diesem Code geht es

Subpages im WonderCMS Theme abfragen und anzeigen lassen

 wondercms  Navigation Menue


Mit diesem Code zeigen Sie die so genannten subpages in einem WonderCMS Theme an. Es sind nur zwei PHP Schleifen nötig, um Subpages in das Theme einzubinden.

Beiträge und Kategorien rekursiv anzeigen

 yellow  Navigation Menue Ordner Post Beitrag


Die Standard URL für den Admin Login in Datenstron Yellow und wie Sie ihn verstecken bzw. verbergen. So schützen Sie sich vor einem Hacker-Angriff auf das CMS

Beitragsmenü ohne Plugin in Pico

 pico  Menue Navigation Beitrag


Für die Einbindung eines Menüs gibt es kostenlose Plugins, Sie können dies auch mit Mitteln des Templates umsetzen und verzichten auf unsichere Plugins

Impressum


CMSWorkbench.de ist eine reine Entwickler-Webseite und dient vorwiegend als Wissensspeicher für die Entwicklung von CMS

Datenschutz


Die Webseite verwendet keinerlei Tracking- oder Speicher-Mechanismen, die Rückschlüsse auf Ihre IP oder das Leseverhalten zulassen

Affiliate


Wir sind Mitglied im Amazon Partnernet und können mit Affiliate-Links (* den Betrieb der Seite etwas unterstützen, für Sie ist das natürlich kostenlos

Kontakt


Sie können mit uns über eMail Kontakt aufnehmen, schreiben Sie an Kontakt@Oliver-Lohse.de