Aber mit ob1_title wird die Geschichte kinderleicht. Sektionen, Artikel und Listen lassen sich frei und nach Stellenwert sortieren.

Infos & Download: Textpattern Resources

Titel der Unterseite >> Titel der Website – Slogan

Dies lässt sich auch mit Textpattern umsetzen, ohne Plugin und Schnick-Schnack. Aber ein paar Handgriffe sind vonnöten. Der Textpattern Tag <txp:page_title /> verhält sich suboptimal und hilft da nicht wirklich weiter, denn er produziert das hier:

Titel der Website >> Unterseite

Unangenehmer wird es für den User, wenn er nun mehrere Fenster oder Tabs einer Website geöffnet hält. Der Browser übernimmt den Titel-tag normalerweise als Fenster- bzw. Tabüberschrift, und dann trägt es nicht zu Übersichtlichkeit bei, wenn alles mit dem gleichem Titel beschriftet ist. Als Abhilfe binde ich <txp:section title="1" /> in Verbindung mit <txp:site_name /> und <txp:site_slogan> in den Titeltag ein. Dann muss ich die Sections mit meinen Keywords betiteln, ansonsten macht der Einsatz des Section-tags kein Sinn :). Für die Startseite schließe ich allerdings den Sectiontag mittels dem Conditional Tag <txp:if_section> aus:

<title>
<txp:if_section name="default">
<txp:site_name /> - <txp:site_slogan />
<txp:else />
<txp:section title="1" /> &raquo; <txp:site_name />
</txp:if_section>
</title>

Das erzeugt die optimale Ausgabe. Es gibt aber noch einen Haken, denn das funktioniert nur dann, wenn ich Textpattern als Antrieb für eine statische Seite benutze. Möchte ich aber einen Blog mit Textpattern und optimalen Titeln, dann muss der Umweg über einen Baustein gegangen werden. Sonst kann ich so eine Ausgabe nicht erreichen:

Artikeltitel >> Titel der Unterseite >> Titel der Website

Denn <txp:title /> ist ein arcticle-Tag und muss deswegen einen Baustein der Artikel-Klasse erstellen, und dort den <txp:title /> reinschreiben. Den Baustein speichere ich mit den Namen optimaler-titel ab. Aufgerufen wird er mit <txp:article form=“optimale title“>. Dass, vermengt mit unseren Codeschnipsel, macht den optimalen Titel auch für einen Textpatternblog perfekt.

<title>
<txp:if_section name="default">
<txp:site_name /> - <txp:site_slogan />
<txp:else />
<txp:article form="optimal-title" /> &raquo; <txp:section title="1" /> &raquo; <txp:site_name />
</txp:if_section>
</title>

Hilfreich ist eine zweite Seitenvorlage für die statischen Seiten, aus denen ihr den article-Tag wieder entfernt. Sonst habt ihr einen Artikeltitel vor dem Titel der Unterseite.

So das wärs dann gewesen. Ich hoffe es hilft was.

In diesem Tutorial soll erreicht werden:

• Eine Blogseite, die ein Photo anzeigt.
• Ein Archiv, das dynamisch aus den gebloggten Bildern eine Thumbnailgalerie erzeugt.

Ich setzte Erfahrungen in Webprogrammierung (XHTML/ CSS) und Umgang mit Content-Management-System voraus. Das Ganze soll nur ein kleiner Gedankenanstoß sein, wie unkompliziert sich mit Textpattern ein attraktives Photoblog umsetzen lässt. Vorerst ohne Einsatz von Plugins oder tiefer greifenden PHP-Kenntnissen oder anderen komplexen Programmiersprachen kommt man schnell ans Ziel.

Templates von Textpattern sind in drei Ebenen aufgeteilt. Übergeordnet sind die Sections, denen man Seitenvorlagen (Pages) zuweisen kann. Elemente die auf den Pages immer wiederkehren und angepasste oder sectionabhängige Artikelansichten werden in den Bausteinen (Forms) hinterlegt.

Seitenvorlage & Bausteine

Zu Beginn wird eine Seitenvorlage hinterlegt. Dazu wird im Backend der folgende Menüpunkt aufgerufen: Präsentation > Seitenvorlage. Der Übersicht wegen kopiere ich die default-Vorlage unter dem Titel photoblog. Natürlich kann auch ein anderer prägnanter Titel benutzt werden.

Im nächsten Schritt rufe ich die Seitenvorlage photoblog auf. Die Seitenvorlage setzt sich aus HTML und Textpattern Tags. Textpattern-Tags sind kurze Befehle mit denen Funktionen in Textpattern aufgerufen werden können, eine ausführliche Dokumentation der Textpattern-Tags findet man hier. Unten seht Ihr einen kleinen Codeblock, der nur einen Textpattern-Tag besitzt: <txp:article form="photoblog" limit="1"/>. Dieser Tag beschreibt eine Art Schleife, und an dieser Stelle wird das Photo eingeblendet.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Photoblog</title>
<style type="text/css" media="all">
@import url(<txp:site_url />/css/base.css);
</style>
</head>
<body>
<div id="content">
<txp:article form="image" limit="1"/>
</div>
</body>
</html>

Natürlich kann die Seitenvorlage mit weiteren Textpattern-Tags dynamischer gestaltet werden, aber der Übersicht wegen beschränke ich mich auf das Grundsätzliche.

Danach muss noch eine Seitenvorlage für das Archiv her. Also die Vorlage photoblog als Archiv kopieren und nun den Artikeltag:

austauschen mit:

Betrachten wir das Textpattern-Tag <txp:article form="photoblog" limit="1"/> näher. Es beinhaltet das Attribut form, und spricht damit einen bestimmten Baustein an. Dieses Attribut bezieht sich auf einen Baustein namens photoblog, den wir unter Präsentation > Baustein anlegen müssen. Dort rechts neben den Textfeld ein Link Neuen Baustein erstellen anklicken. In das nun leere Textfeld müsst ihr eintragen. Gerade dieses Textpattern-Tag macht ein Photoblog mit Textpattern so wunderbar einfach. Falls noch weitere Formatierung notwendig sind, könnt ihr natürlich noch HTML-Tags mit Klassen oder Ids um das legen, um das Layout dementsprechend anzupassen. Es empfiehlt sich übrigens vorher schon eine HTML-Schablone für die einzelnen Seiten angefertigt zu haben, dann braucht man später den Code nur noch an die richtigen Stellen zu kopieren, und den dynamischen Teil mit Textpattern-Tags zu ersetzen.

Damit Textpattern überhaupt diesen Baustein aufrufen kann, müssen wir ihn unter den Namen abspeichern, den wir in der Seitenvorlage als Form-Attribut hinterlegt hatten. In unserem Fall also image. Zusätzlich muss auch der Bausteintyp article angegeben werden.

Nicht vergessen dürfen wir die Seitenvorlage archiv, für die ebenfalls einen Baustein anlegen müssen. Wir wiederholen die gleichen Schritte, wie für den Baustein image und kopieren diesmal <txp:article_image thumbnail="1" /> in das Textfeld. Dieser Tag bewirkt, dass das Vorschaubild angezeigt wird, allerdings nur, wenn eins vorhanden ist, das Originalbild in der Section Photoblog veröffentlicht wurde.

Falls ihr eure Fotos zusätzlich kommentieren wollt, könnt ihr <txp:body /> noch dem Baustein hinzufügen. Dieses Textpattern-Tag ummantelt den Text später selber mit dem <p>-Tag, das mach Das Ganze könnte dann ungefähr so aussehen:

<p><txp:article_image /></p>
<txp:body />

Aber jetzt kümmern wir uns vorerst um etwas anderes.

Sektionen

Sektionen dienen in Textpattern zur Strukturierung der Website. Jeder Sektion kann eine Seitenvorlage zugewiesen werden, somit können wir verschiedene Layouts für die einzelnen Sektionen realisieren. Genaueres dazu findet ihr in den Artikel Eine Website mit Textpattern organisieren.

Unter Präsentation > Sektionen wird eine Sektion angelegt. Man kann einfach die die schon vorhandene Default-Sektion in photoblog umbenennen. Bei den Checkboxen kann nein angekreuzt werden, bis auf auf der Startseite anzeigen und in Seitensuche einbeziehen, dort wäre ja sinnvoll :). Als Seitenvorlage wählen wir photoblog aus.

Zusätzlich legen noch eine Sektion namens archiv an. Bis auf die Seitensuche können alle Checkboxen mit nein abgehakt werden.

Ein Bild posten

Um ein Bild zu publizieren, muss es über Inhalt > Bilder hochgeladen werden. Wenn das Bild dann auf dem Server ist, kann auch gleich ein Thumbnail angelegt werden. Nachdem dass erledigt ist, unter Inhalt > Verfassen einen Blick auf die linke Seite werfen. Dort findet ihr die Erweiterte Einstellungen: Dort müsst Ihr nur die ID des Bildes eintragen unter Artikelbild eintragen. Falls noch Titel und Kommentare dem Bild beifügen wollt, müsst ihr den Baustein photoblog dementsprechend anpassen.

Das wäre es dann schon gewesen. Hoffe es war einigermaßen nachvollziehbar.