Einrichten der Startseite

Wir werden eine statische Seite mit fest definierten Inhalten erstellen, die verschiedene Reiseangebote auflistet.

Dieser Abschitt der Einführung soll zeigen:

  • Die Nutzung von Spalten und Blöcken des Satzspiegels,
  • Einsatz von HTML Tabellen im Textkörper,
  • Die Verwendung von Inhalten als Schablonen.

Was werden wir an der Interseite verändern:

  • Wir werden einen bebilderten Inhalte erstellen,
  • Den erstellten Inhalt vervielfältigen,
  • Den Inhalt mit einem Verweis auf eine Hauptseite versehen,
  • Die Kopien des Inhalts mit verändertem Content füllen,
  • Das Kopfmenü erweitern,
  • Das erstellte Corporatemenü in den Fuß der Templates einbinden.

Die Inhalte bestehen alle aus gleichartigen Blöcken. Die einzelnen Blöcke werden mit Kenndaten der Reise, einem Bild, einem kurzen Text und einem weiterführenden Verweis ausgestattet. Außerdem werden wir, für ein realistisches Erscheinungsbild der Seite, das Kopfmenü erweitern.

Die grundlegenden Verfahrensweisen sind an anderer Stelle beschrieben.

Was ist die Startseite

Bei der Startseite handelt es sich grundsätzlich um gewöhnlichen Content, der mit dem Contentmanager verwaltet werden kann.

Der einzige Unterschied zu anderem Content besteht darin, das die Direktive systemrelevant ist und von dem System als permanent vorausgesetzt wird. Die Software erfordert die Existenz eines Themas 'home', die bei undefinierten oder unautorisierten Aktionen des Benutzers und beim ersten Aufruf der Internetseite aufgesucht werden kann.

Aus diesem Grund ist dieses Thema und sein erster Inhalt vor Löschaktionen geschützt. Alle anderen Aktionen an diesem Thema sind erlaubt. Die Startseite kann folglich wie sonstiger Content durch Inhalte erweitert werden.

Inhalt der Startseite nach der Installation

Nach der Installation zeigt der Content Editor in dem Eingabefeld 'Lade Datei' eine Datei namens 'content_home_de.php' oder 'content_home_en.php' aus dem Verzeichnis 'application'. Dort liegen zwei Dateien, die abhängig von der geladenen Sprache und der Erweiterung des Dateinamens entweder für Englisch ('_en) oder für Deutsch ('_de') deklariert werden.

Das Installationsprogramm hat mit dem Aufbau der Datenbank für beide Sprachen jeweils einen entsprechenden Datensatz angelegt.

Für die erforderlichen Anpassungen der Startseite, kann neuer Content erstellt werden oder, können die eingebundenen Dateien überarbeitet werden.

Letzteres ist dann nützlich, wenn derselbe Inhalt auf verschiedenen Landeseiten eingesetzt werden soll.

Für unser Anwendungsbeispiel wird diese Dateien nicht benötigt: Wir löschen die Deklaration der Datei aus dem Inhalt und erstellen einen neuen Inhalt der mit den gewünschten Gegenständen und Texten gefüllt wird.

Dieser Inhalt wird unsere neue Startseite, die in den Menüs auch als 'Reiseziele' adressiert wird.

Einstellung des Satzspiegels

Die Startseite soll einen responsiv mittig stehenden Content anzeigen.

An erster Stelle soll ein Block stehen, der über das gesamte Display reicht und als Fläche für Meta- und Corporate-Kommunikation bereitstehen soll.

Diesem 'Dachgeschoss' sollen drei horizontal aufeinander folgende Blöcke folgen, die als Spalten für Reiseangebote dienen sollen.

Folglich sollen vier Blöcke auftreten, weshalb wir für den Satzspiegel des Template vier Blöcke deklarieren (Abb.01-0065).

Einstellungen SatzspiegelAbb.01-0065

Die Software bietet zwei verschiedene Wege zum Ziel an:

Einmal kann für den Satzspiegel des Template genau dieses Layout eingestellt werden. Das wäre die vierte Option für die Einstellung von 'Layout' der Template Einstellungen.

Das zweite Mal kann für den Satzspiegel ein Layout mit strikt untereinander angeordneten Blöcken eingestellt werden. Dafür ist die dritte Option für die Einstellung von 'Layout' einzuschalten.

Beide Methoden erfordern, dass das Css entsprechend bearbeitet wird. Das kann durch die manuelle Programmierung von Css Dateien, oder aber mit generischem Css erfolgen. In unserem Fall werden wir den Css Editor verwenden um die erforderlichen Einstellungen mit generischem Css vorzunehmen.

Der Unterschied zwischen den Einstellungen besteht darin, das der Umlauf der Blöcke im ersten Fall mit 'float' Regeln und 'clearfix' ('CLR') Elementen gesteuert wird und im zweiten Fall ungeregelte HTML Blöcke verwendet werden.

Im ersten Fall legen wir bereits mit der Einstellung des Satzspiegels ein hart definiertes Block Layout fest. Die Css Klassenerweiterungen und CLR Elemente werden in den Code geschrieben. Spätere Umwandlungen der Blöcke in Inline Elemente sind nur noch schwer zu kontrollieren.

Die erste Methode

Die Steuerung per 'float:left' hat zur Folge, dass die Blöcke der Spalten alle nach Links hin und am linken Rand des elterlichen Contentrahmens angeordnet werden. Erst ein weiteres Clearfix löst diese Gravitation für nachfolgende Elemente auf.

Da der Contentrahmen standardmäßig die gesamte Breite des Displays einnimmt, liegen die Spalten am linken Rand des Displays und stehen nicht automatisch mittig auf dem Display (Abb.01-0063).

Ausrichtung InhaltAbb.01-0063

Erst wenn der Rahmen der Inhalte auf eine feste Größe gesetzt wird und die horizontalen Außenabstände des Rahmens mit Css Eigenschaft 'margin' auf 'auto' eingestellt werden, stellt sich Contentrahmen mittig auf dem Display ein.

Die Abbildung 01-0063 zeigt die Situation. Der rote Pfeil zeigt die Gravitation und Grün bedeutet die erforderliche Reduktion des Contentrahmens.

In Abb.01-0063 auch der Leitinhalt des Themas zu sehen. Der Leitinhalt zeigt das LOGO der Seite und ist mit der Css Sonderklasse 'Leitinhalt' ausgezeichnet worden. Er kann folglich anders gestaltet werden als dier darunter befindlichen 'regulären' Inhalte.

Dazu nachfolgend mehr.

Ausrichtung InhaltAbb.01-0064

Abbildung 01-0064 zeigt das Display nach Einstellung der Außenabstände und des Contentrahmens.

Der Contentrahmen (in Rot) wurde auf eine Breite von 960px eingestellt, der umliegende Contentbereich behält eine Größe von 100%. Die automatisch kalkulierten Außenabstände lassen den Contentrahmen nunmehr mittig auftreten.

Was aufmerksamen Lesern auffallen mag ist, dass der Content des Leitinhalts nicht mittig steht. Auch dort muss noch die Breite des Inhalts eingestellt werden. Standardmäßig ist für die Startseite ist eine feste Breite eingestellt.

Da das LOGO ein Bild ist, reicht es aus wenn, die Textausrichtung für den Inhalt des Containers auf mittig eingestellt und, die Breite des Containers gelöscht, wird.

Die zweite Methode

Für die Aussteuerung der Startseite mit der zweiten Methode wird der Satzspiegel für das 'Layout' des Template auf die dritte Option eingestellt.

Wie vorab bereits angemerkt verwendet der Contentparser nun standardmäßige HTML Block Elemente für die Positionscontainer der Inhalte, die grundsätzlich immer die Breite des elterlichen Containers einnehmen und deshalb grundsätzlich untereinander gestapelt auftreten, wobei der zuletzt definierte immer der Unterste ist.

In diesem Zustand können die Positionscontainer mit Css ausgesteuert werden.

Dafür wird der erste Container in Position 0 als Blockelement und alle nachfolgenden Container werden als nicht vererbte Inline Elemente ('inline-block') geregelt, die mit 'text-align:center' mittig ausgesteuert werden können.

Wie oben erwähnt ist der erste Inhalt als 'Leitinhalt' ausgezeichnet und kann von dem Css gesondert geregelt werden.

Als Block Element kann der Positionsrahmen der Inhalte die volle Breite des Elternelements einnehmen. Als Inline Elemente werden die Blöcke wie Text verarbeitet und folgen solange in einer Zeile aufeinander, bis die Breite aller Inhalte die Breite der verfügbaren Fläche überschreitet.

Diese Einstellung ist nicht unbedingt einfacher, aber für spätere Änderungen flexibler, da alle weiteren Regelungen mit externem generischem Css erfolgen können und die erzeugten HTML Elemente keine fest codierten Css Attribute enthalten.

Css EinstellungenAbb.01-0066

Abbildung 01-0066 zeigt den Css Editor und die erforderlichen Einstellungen.

Achten Sie darauf, dass die Vertikale Ausrichtung definiert ist. Ansonsten richtet sich der Positionscontainer entsprechend anderer, für Elternelemente, getroffener Einstellungen, oder an der Grundlinie, aus.

Zusätzlich zu den Positionscontainern ist auch noch die Breite der Inhalte einzustellen (Abb.01-0067).

Css EinstellungenAbb.01-0067

Wir stellen die Breite der Inhalte auf 310px ein. Die Spalten passen sich der Breite der Inhalte an. Da alle Inhalte gleich eingestellt sein werden, sind damit sind auch die Spaltenbreiten definiert.

Fußmenü erstellen und einrichten

Für Firmen- und Kontaktdaten sowie rechtliche Themen wird ein separates Menü erstellt, dass auf allen weiteren Templates gleichbleibend auftreten kann und so dem Internetauftritt einen festen Hintergrund verleiht.

Als Ergebnis ist ein Menüblock erwünscht, in dem das Hauptmenü horizontal über den Blöcken der Untermenüs steht und mit den Untermenüs den Eindruck einer mehrspaltigen Linkliste vermittelt.

Wie für das Kopfmenü bereits beschrieben wurde, richten wir zuerst verschiedene Menüschalter ein, die der Menümanager automatisch mit einem Verweis auf die Startseite ausstattet.

Alle Menüschalter des Hauptmenüs definieren wir vom Typ 'Verweis'. Die Untermenüs werden wir mit dem Css Editor als bleibend sichtbar auszeichnen. Die Farben der Texte und das Farbverhalten bei Mausberührung stellen wir so wie für das Kopfmenü ein.

Für das Hauptmenü stellen wir die Schrift der Schalter gleichbleibend ein.

Zu der Auszeichnung der Menüschalter als aktueller Schalter ist anzumerken, dass die Software den aktuellen Menüschalter anhand der zuletzt aufgerufenen Contentdirektive erkennt. Als Folge davon, und der Tatsache, dass neu erstellte Menüschalter immer auf die Startseite verweisen, werden jetzt auf der Startseite alle angezeigten Menüschalter, als aktive Menüschalter betrachtet und ausgezeichnet. Das kann verwirren wenn nun versucht wird die Optik des Menüs zu gestalten, ohne vorher die Verweise der Schalter, mit der entsprechenden Contentdirektive, auf das gewünschte Zielthema einzustellen (Abb.01-0060).

FußmenüAbb.01-0060

Abb.01-0060 zeigt die Situation auf der Ansicht der Startseite: Alle neu erstellten Menüschalter verweisen auf die Startseite und die Startseite ist aktiv. Als Folge davon werden alle Schalter als aktive Schalter ausgezeichnet.

FußmenüAbb.01-0061

Abb.01-0061 zeigt die Situation von dem Dokument des Impressums aus, die wir zwischenzeitlich angelegt haben: Nur der Schalter, der auf dieses Dokument verweist, ist als aktiv ausgezeichnet.

In dem Abschnitt 'Vertikale und horizontale Ausrichtung von HTML Elementen' wurde bereits auf die vertikale Ausrichtung von HTML Elementen eingegangen. Für hiesiges Beispiel kommt das beschriebene Verhalten zur Geltung: Da wir die Boxen der Untermenüs mit 'inline-block' regeln damit sie nebeneinander stehen, werden alle Menüs standardmäßig am Fuß des höchsten Menüs ausgerichtet fallen deshalb nach unten (Abb.01-0062). Hier ist die vertikale Ausrichtung auf 'Oben' einzustellen.

FußmenüAbb.01-0062

Tabellen im Textkörper erstellen

Die Definition von Inhalten ist bereits in dem Abschnitt 'Objekte erstellen' beschrieben worden.

Deshalb beschreibt dieser Abschnitt lediglich die Einstellung und Nutzbarkeit von HTML Tabellen im Textkörper.

Suchmaschine für Inhalte und Tabellen

Die Software besitzt eine Suchmaschine zur Filterung von Inhalten.

Die Suchmaschine wird in einem anderen Abschnitt beschrieben. Hier sei soviel dazu angemerkt, dass der Suchalgorithmus unscharfe Ergebnisse liefert.

Die Suche findet beispielsweise auch Bildunterschriften.

Deshalb sollten in Content keine spezifischen Merkmale aufgeführt werden nach denen anschließend gesucht werden soll. Um scharfe Suchergebnisse nach spezifischen Merkmalen von Inhalten zu erzeugen verwaltet der Contentmanager 'Erweiterungsspalten', von denen beliebig viele Attribute definiert werden können.

Die Verwendung von solchen 'Erweiterungsspalten' wird an anderer Stelle des Handbuchs beschrieben. Lesen Sie dazu unter 'Suche nach Inhalt' nach.

Texteditor der Inhalte

Mit dem Texteditor der Inhalte versendete Texte werden vor dem Speichervorgang gefiltert. Es gelangen nicht die Texte in den Festspeicher die der Autor dem Server zusendet.

Um das Filter des Speichervorgangs verstehen zu können ist anzumerken:

  • Textzeilen, die sich außerhalb von Markups befinden und lediglich aus einem Zeilenvorschubzeichen werden gelöscht;
  • Tabulatorzeichen werden gelöscht;
  • HTML Markups werden identifiziert und durch Formatmarken der Software ersetzt, nicht erkannte Markups werden ignoriert;
  • Globale Verweise ins Internet sind unerwünscht und werden mit einer Fehlermeldung beantwortet;
  • Die Css Auszeichnung der HTML Elemente des Textkörpers können beliebig durch Css Klassen des abstrakten Css erweitert werden;
  • Für Listen erkennt der Editor das Zeilenvorschubzeichen als Trennzeichen unterschiedlicher Absätze.

Tabellen im Textkörper

Für die Inhalte der Reisehinweise wurde der Textkörper um eine HTML Tabelle erweitert mit der die Merkmale des Angebots angezeigt werden.

Die Tabellen im Textkörper dienen zur Formatierung von Text und nicht zur Definition von Attributen nach denen Inhalte ausgefiltert werden sollen.

Auch dienen sie nicht dazu wirklich umfangreiche Tabellenansichten zu erzeugen. Dafür wird das Listengenerator Modul AutoTable verwendet, das sich auf Datenbanktabellen bezieht und, für das eine Vielzahl von Parametern programmiert werden kann. Sie sind dem Modul vermutlich und unwissentlich bereits in Ansichten des Backend begegnet. Für Anzeigen im Frontend kann das Modul mit dem Contenteditor in Inhalte eingebunden werden (Abb.01-0068).

Tabellen im TextkörperAbb.01-0068

Tabelle definieren

Die Definition von Tabellen im Textkörper der Inhalte erfolgt durch Eintrag von HTML Markups in den Text der Inhalte.

Verwendet werden die Elemente 'DIV', 'P' und 'SPAN'. Die Elemente werden mittels Css Auszeichnungen als Tabellen geregelt.

Der Eintrag der Elemente kann per Tastatur erfolgen, sollte aber unter Verwendung der dafür vorgesehenen Textschaltflächen erfolgen. Das Format der Einträge wird von der Software kontrolliert. Nicht identifizierbare Einträge werden von der Software bei Eingang zurückgewiesen oder geändert.

Für den Eintrag von Tabellenelementen sind folgende Schalter vorhanden (Abb.01-0069):

  • TBL – 'DIV' ist als Tabellenkörper geregelt,
  • TTR – 'P' ist als Tabellenzeile geregelt,
  • TTH – 'SPAN' ist als Tabellenkopfzelle geregelt,
  • TTD - 'SPAN' ist als Tabellenzelle geregelt.
Tabelle definieren - MarkupsAbb.01-0069

Der Aufbau der Tabelle kann von innen oder von außen her erfolgen.

Aufbau der Tabelle von außen her

Von außen her bedeutet, dass zuerst das Markup für den Körper der Tabelle eingefügt wird und in den Körper anschließend die Zeilen und Zellen eingefügt werden. Die Struktur der Tabelle ist dabei leer und wird anschließend mit Text gefüllt (Abb.01-0070).

Aufbau der TabelleAbb.01-0070

Aufbau der Tabelle von innen her

Beim Aufbau von innen heraus wird zuerst der Text der Tabellenzellen eingegeben (Abb.01-0071):

Aufbau der TabelleAbb.01-0071

Anschließend werden die einzelnen Zeilen mit der Maus selektiert und mit dem Schalter 'TTD' als HTML Tabellenzellen ausgezeichnet (Abb.01-0072).

Tabellenzellen ausgezeichnenAbb.01-0072

Abschließend werden die markierten Tabellenzeilen in den Tabellenkörper gepackt. Für die Markierung der Elemente wird der Block der verpackt werden mit der Maus selektiert und anschließend wird der Schalter 'TBL' betätigt (Abb.01-0073).

Tabellenzeilen in Tabellenkörper packenAbb.01-0073

Der Contentparser zeigt das Produkt im Frontend wie nachfolgend an (Abb.01-0074). In dem Inhalt 'Block Center' wird die Tabelle unter dem Titel angezeigt.

Produkt im FrontendAbb.01-0074

Wie in Abbildung Abbildung 01-0071 zu sehen war haben wir Text für drei Tabellenzeilen mit jeweils zwei Zellen eingegeben. Logisch wäre jetzt, dass wir mit allen Zellen so verfahren, wie vorab beschrieben worden ist.

In diesem Fall belassen wir es jedoch bei den ersten beiden Zellen und vervielfältigen Diese mit der Schalter 'DUP' in den Tabellenkörper hinein. Nach der Vervielfältigung ändern wird den Text der Zellen entsprechend der Anwendung und erhalten anschließend nachfolgend gezeigtes Ergenbis (Abb.01-0075):

Tabellenansicht im FrontendAbb.01-0075

Vervielfältigung und Anpassung von Inhalten

Wir erstellen eine Anzahl von neun Reisehinweisen die auf die Spalten oder Blöcke der Startseite verteilt angezeigt werden sollen.

Am Ende möchten wir auf der Startseite in drei Absätzen, die jeweils durch einen Zwischenbalken voneinander getrennt sind, drei thematisch unterschiedliche Reisekategorien anzeigen. Für jede dieser Kategorien sollen drei Reiseziele angeboten werden.

Anstatt die zusätzlich noch benötigten Inhalte einzeln zu erzeugen, werden wir den von uns erstellten ersten Inhalt mit dem Reiseziel 'London' vervielfältigen und anschließend die Texte entsprechend anpassen.

Damit diese Demonstration übersichtlich bleibt erzeugen wir erst einmal drei Kopien und erläutern die anschließend notwendigen Einstellungen.

Im Content Editor zeigen wir den Content 'London' an und betätigen in der Befehlsleiste des Template zweimal den Schalter 'Kopieren'. Der Contentmanager zeigt die neuen Inhalte in seinem Auswahlbaum an (Abb.01-0076):

Inhalt kopierenAbb.01-0076

Beachten Sie, dass die Kopien vollständig dem Original gleichen. Das betrifft den Positionsblock des Satzspiegels, wie auch die Veröffentlichung und mögliche Querverweise. Möchten Sie, dass diese Arbeiten im Frontend unsichtbar bleiben, dann ist das Original vor den Kopierarbeiten unveröffentlicht zu schalten.

Jetzt sind folgende Anpassungen vorzunehmen:

  • Positionen einstellen (auf Spalten verteilen),
  • Reihenfolge korrigieren,
  • Bilder zuweisen,
  • Texte ändern.

Wir erhalten anschließend das Ergebnis (Abb.01-0077):

Amsicht Startseite FrontendAbb.01-0077

In Abbildung 01-0077 sehen Sie in den Inhalten unten jeweils einen Querverweis zu weiterführenden Themen.

Lesen Sie dazu den Abschnitt 'Querverweise'.
Nachfolgend werden ausschließlich die wesentlichen Voraussetzungen und Zusammenhänge erläutert:

Positionen

Die Kopien des Inhalts liegen wie das Original alle in der Spalte 'Position1'. Damit liegen sie alle in einer Spalte, was zuerst geändert wird. In Positionsblock Null liegt der erste Inhalt, der als Leitinhalt auftreten soll. Die Positionen 1, 2 und 3 sind die darunter liegenden Spalten, in denen die Inhalte auftreten.

Reihenfolge

Standardmäßig werden die Kopien in der Reihenfolge immer vor dem Original eingefügt. Sollte sie dadurch falsch implementiert worden sein, dann kann jetzt auch die Reihenfolge korrigiert werden.

Texte

Die Inhalte besitzen keinen autonomen Namen. In der Anzeige des Auswahlbaums des Contentmanagers werden entweder die gekürzten Titel oder der gekürzte Inhalt verwendet.

Um die Kopien kenntlich zu machen ist der Titel der Kopien entsprechend geändert worden. Dort steht jetzt 'Kopie von Original'.

Satzspiegel endgültige Fassung

Wie mehrfach zuvor, aber auch in dem Abschnitt 'Vervielfältigung und Anpassung von Inhalten', angekündigt möchten wir drei Blöcke zeigen, die jeweils unterschiedliche Kategorien von Reisen anbieten.

Der, in den vorhergehenden Abschnitten zu Demonstrationszwecken eingerichtete, und mit nebeneinander liegenden Positionsblöcken formatierte, Satzspiegel ist für die Meldung von Nachrichten hinreichend geeignet, jedoch für das von uns angestrebte Ziel sind untereinander liegende Blöcke vorteilhafter.

Die Optionsschalter, mit denen der Satzspiegel eingestellt werden kann, wurden in dem Abschnitt 'Einstellung des Satzspiegels' (Abb.01-0065) bereits vorgestellt. Dort wird jetzt die dritte Option eingeschaltet.

Das die Positionsblöcke 1 bis 3 aktuell nebeneinander stehen, haben wir mit dem Css Editor, und über das generische Css, mit der Eigenschaft 'inline-block' geregelt. Die in Absatz 'Einstellung des Satzspiegels' beschriebenen Einstellungen annullieren wir jetzt.

Um die bislang bestehenden Inhalte, nicht nur durch Blöcke sondern, auch optisch voneinander zu trennen benötigen wir drei weitere Inhalte, die wir mit dem Content Editor als Zwischenabsatz auszeichnen.

Css Sonderklasse einstellenAbb.01-0078

Diese drei Inhalte werden wir auf die Positionscontainer 1 bis 3 verteilen und Ihnen eine Reihenfolge zuweisen mit der sie an erster Stelle jedes Positionsblock auftreten. Die neuen Inhalte werden wir mit dem Content Editor als Sonderklasse 'Zwischenabsatz' auszeichnen. Die Sonderklasse wird anschließend mit den Css Editor und dem generischen Css optisch entsprechend ausgesteuert.

Über Sonder- und Spezialklassen lesen Sie bitte in dem Abschnitt 'Spezialklassen für Inhalte ' nach.
Das bisherige Ergebnis der Arbeiten an der Startseite zeigt Abbildung 01-0085. Die Abbildung zeigt den oberen Teil der Startseite mit den in den vertikal angeordneten Blöcken.

Anzeige im FrontendAbb.01-0080

Reihenfolge der Inhalte

Die Reihe der Ordinalzahlen beginnt bei Eins und nicht bei Null. Sechs bedeutet somit das der Inhalt an Position Sechs erscheint. Die Reihenfolge der Inhalte ist auf das jeweilige Thema bezogen.

Beinhaltet ein Thema sechs Inhalte, die zu gleichen Teilen auf zwei Positionen verteilt sind, dann ist einfach die kleinere Ordinalzahl entscheidend dafür welcher Inhalt zuerst auftritt.

Fertigstellung der Startseite

Nachdem wir anhand der Startseite verschiedene Arbeitsweisen und Werkzeuge vorgestellt haben, werden wir ihre Inhalte nun so anpassen, dass, sie den weiteren Beispielen dienlich sein kann und, die Startseite optisch einer wirklichen Startseite etwas näher kommt.

Auf eine Dynamik des Content wird allerdings verzichtet. Dynamisch zusammengestellter Content ist ein Ergebnis von Abfragen der Inhalte nach bestimmten Kriterien und wird von einem speziellen Erweiterungsmodul erzeugt.

Für die Fertigstellung der Startseite sind noch folgende Schritte zu erledigen:

  • Zuerst werden wir für die erstellten Inhalte, in einem neu angelegten Kapitel, Themen erstellen und die Inhalte entsprechend der Themen dorthin kopieren.
  • Die kopierten Inhalte werden mit Querverweisen auf spezifische redaktionelle Themen mit weiteren Reiseberichten versehen.

Sicherungskopie

Als Erstes erstellen wir ein Kapitel 'destinations' in dem die eigentlichen detaillierten Reiseangebote geführt werden sollen.

In dem neu erstellten Kapitel legen wir mit einem unbenutzten Thema ein Sicherungsverzeichnis an, das wir mit 'destinations_pool' benennen. Bevor wir die erstellten Inhalte der Startseite ändern werden wir diese dorthin kopieren.

Die Steuerung des Kopierers ist über die Schaltfläche 'Inhalt verschieben' das Aktionsmenü des Contentmanagers zu erreichen. Im linken Bereich werden die Zieldaten eingegeben und im rechten Bereich werden die Inhalte ausgewählt, die kopiert werden sollen. Die links angezeigten Themen variieren entsprechend des ausgewählten Kapitels. In Abbildung 01-0081 können Sie erkennen, dass mehrere Inhalt ausgewählt und kopiert werden können.

Von dem Befehl 'Kopieren' oder 'Verschieben' hängt ab ob die kopierten Originaldateien gelöscht werden. Ansonsten laufen dieselben Prozesse ab.

Sicherungskopie erstellenAbb.01-0081

Themen erstellen

Mit den Kopien haben für die Startseite nun neun Inhalte mit Reiseangeboten angelegt. Diese sollen dort in einer gekürzten Fassung angezeigt werden und jeweils mit einem Querverweis auf detaillierten Reiseangebote führen.

Wie bereits an verschiedenen Stellen beschrieben wurde, erfordert der Contentmanager für die Einbindung von Inhalten immer ein bestimmtes Thema. Das bedeutet, dass wir in dem Verzeichnis 'destinations' für jedes Reiseangebot ein separates Thema erzeugen, von dem der jeweilige Inhalt angezeigt werden soll.

Die benötigten neuen Themen für die Inhalte erstellen wir nicht einzeln, sondern lassen die benötigten neun Themen von der Maschine erstellen und erhalten neun, mit numerischen Schlüsseln bezeichnete Themen. Damit die Themen danach auch für Menschen erkennbar sind, werden die Themen nachfolgend einzeln mit entsprechenden Übersetzungstexten versehen (Abb.01-0084).

Themen erstellenAbb.01-0084

Anschließend kopieren wir die Themen der Startseite einzeln in die Themen, in denen sie erscheinen sollen. Den Themen können nachfolgend auch mehrere Inhalte mit verschiedenen Destinationen zugewiesen werden. Es ergibt sich eine Organisation wie in Abbildung 01-0082 in der sichtbar ist, dass dem Thema 'London' ein Inhalt 'London' zugewiesen wurde.

Thema erstellenAbb.01-0082

Zusätzliches Template

Die endgültigen Reiseangebote werden ihre Details nicht als Tabelle innerhalb ihres Textkörpers, sondern separat in der Erweiterungstabelle des Contents speichern. Damit geht automatisch auch eine andersartig strukturierte Präsentation der Daten einher. Die Daten der Erweiterungsspalten verarbeitet der Content Parser in einem separaten Container, der mit dem generischen Css ausgesteuert werden kann.

Wir werden die Anzeigen der detaillierten Reiseangebote mit einem anderen Template versehen, das wir anschließend, ohne Rücksicht auf die Grafik anderer Kapitel nehmen zu müssen, komplett neu gestalten können.

Wir benennen das neue Template mit 'destinations' entsprechend der Inhalte. Der Satzspiegel wird auf die Option 3 eingestellt, womit die Einstellung des Satzspiegels dieselbe ist, wie für das Template der Startseite.

Das wird für den nächsten Schritt bedeutend: Die Css Daten sollen nicht komplett neu eingestellt, sondern von dem Template der Startseite übernehmen werden. Wir werden die Css Daten anschließend lediglich den Anforderungen entsprechend anpassen.

Die Abbildung 01-0083 zeigt die Einstellungen.

Zusätzliches Template erstellenAbb.01-0083

Meta Tags des Dokuments

In Abb.01-0083 sehen wir auch das mittlere Register der Template Einstellungen.

Das Register ist in dem aktuellen Zusammenhang nicht weiter interessant, zeigt allerdings, welche Header eingestellt werden können.

Die Meta Tags des Headers leer sind für jedes neu erzeugte Template neu einzustellen.

Mit Ausnahme des Headers für 'robots', werden Diese erst dann Header in das Dokument eingetragen, wenn sie einen Wert besitzen.

Der Eintrag für 'robots' wird jedoch immer geschrieben und wenn dafür kein Wert gespeichert wurde, dann wir er mit dem Ausfallwert "noindex,nofollow" geschrieben.

Abschluss der Startseite

Die Abbildung 01-0085 zeigt die Ansicht der fertigen Startseite bei einem Bildschirm mit 1600px Breite und Abbildung 01-0086 zeigt die Seite bei einer Breite von 640px.

Startseite AnsichtAbb.01-0085

Startseite AnsichtAbb.01-0086

Die Seite ist mit eingeschränkt responsivem Css ausgezeichnet worden. Die einzelnen Positionsblöcke enthalten derzeit jeweils drei Inhalte, können aber beliebig viele Inhalte anzeigen.

Das Design soll uns für das Beispiel ausreichen.