Anzeige
Anzeige
Software
Artikel merken

Workshop: Nachrichten und Gästebuch

Im ersten Teil des Workshops in der letzten Ausgabe des T3N Magazin ging es um die Erstellung einer Website mit Hilfe von TYPO3. Dazu wurde das Layout der Seite www.typo3.com XHTML-konform mittels eines CSS-basierten Templates umgesetzt. Im zweiten Teil des Workshops geht es um zwei beliebte Funktionen: die Integration von Nachrichten und die Einrichtung eines Gästebuchs.

7 Min. Lesezeit
Anzeige
Anzeige

tt_news war eine der ersten Extensions für TYPO3. Bis zur Version 3.8.x von TYPO3 wurde eine alte Version von tt_news (1.0.4) als globale Extension mitgeliefert. Da die Möglichkeiten der
ursprünglichen Version sehr eingeschränkt waren, wurden diverse
Erweiterungen veröffentlicht. Schließlich
übernahm Rupert Germann die Weiterentwicklung von tt_news von Kasper Skårhøj.
Mit Version 2 wurde das Nachrichtenmodul generalüberholt und mit
einer großen Zahl zusätzlicher Funktionen versehen. Dieser Workshop
basiert auf der Version 2.2.24. Sofern Sie eine ältere Version installiert haben, sollten Sie zunächst ein Update durchführen. Die für den Workshop benötigten Dateien stehen unter http://jweiland.net/t3n zur Verfügung.

tt_news Version 2

Anzeige
Anzeige

Seit Version 2 wird tt_news mit zwei verschiedenen Templates
ausgeliefert: einer Tabellen- sowie einer CSS-basierten Version. Daher
ist es notwendig, eine der beiden Versionen im Bereich „Include Static
(from extension)“ des Haupttemplates einzubinden, ansonsten werden
keine Nachrichten angezeigt.

Es ist sinnvoll die modernere CSS-Variante des News-Templates zu verwenden. Das Template befindet sich in der Datei „tt_news/pi/tt_news_v2_template.html“. Sie sollten das Template in das Verzeichnis „fileadmin/templates/main“ und eine
Kopie der dazu gehörenden CSS-Datei „tt_news/res/tt_news_v2_styles.css“ in das Verzeichnis „fileadmin/templates/main/css“ kopieren. Durch das
Anlegen dieser Kopien wird verhindert, dass Änderungen in diesen Dateien
beim nächsten Update der Extension überschrieben werden.

Anzeige
Anzeige

Die News-Extension bietet zahlreiche Funktionen, daher sind neben dem
Erstellen der Nachrichten einige Vorbereitungen notwendig.
Für die einzelnen Meldungen wird ein Systemordner „News Beiträge“
angelegt, auf den die einzelnen Anzeigeseiten zugreifen. Systemordner
dienen als Speicherplatz für alle Arten von Datensätzen. Im Gegensatz
zu normalen Seiten können Sie nicht direkt im Frontend angezeigt
werden. Vielmehr werden auf regulären Seiten Plugins eingefügt, die
dann auf die im Systemordner abgelegten Datensätze zugreifen. Wählt man
im Seitenkopf zusätzlich die Option „Enthält Erweiterung: News“, ändert sich
das Icon des Systemordners im Seitenbaum.

Anzeige
Anzeige

Für
die Anzeige der Nachrichtenliste sowie des Archivs werden zwei weitere
Seiten vom Typ „Standard“ erstellt. Für die Darstellung eines einzelnen
Beitrags wird die Seite „News
Detailanzeige“ erstellt. Auf diese Seite greift ein Besucher nicht
direkt zu, daher wird der Seitentyp auf „Nicht im Menü“ gesetzt. Der
Seitenbaum sollte dann wie im folgenden Bild aussehen:

Nachrichten können verschiedenen Kategorien zugeordnet werden. Um diese zu definieren wählt man die Listendarstellung
und fügt auf der Seite „News Beiträge“ neue Datensätze vom Typ „News
Kategorie“ ein. Im Beispiel werden die Kategorien „TYPO3, Sport und
Lifestyle“ angelegt. Alle Seiten die später auf die Kategorien
zugreifen, benötigen noch einen Verweis auf den Speicherort. Dazu wird
im Seitentitel der Seiten „Schritt 7“, „News", „Archiv“ und „News
Beiträge“ im Feld „Allgemeine Datensatzsammlung“ ein Verweis auf den
Systemordner „News Beiträge“ erstellt.

Anzeige
Anzeige

Nachrichten erfassen

Anschließend sollten Sie ein paar Nachrichtenbeiträge
erstellen, um die verschiedenen Darstellungen testen
zu können. Dazu wählen Sie die Listendarstellung und fügen auf der Seite
„News Beiträge“ neue Datensätze ein. Das News-Formular ist in zwei
Teile gegliedert, der Inhalt der einzelnen Felder ist selbsterklärend. Im zweiten Teil des Formulars werden die
Beziehungen zu weiteren Informationen wie Kategorien, Bildern, Dateien
und Links angegeben.

Sollen zusätzlich zur eigentlichen Nachricht weiterführende Links
verwendet werden, so müssen diese über den speziellen Link-Tag definiert
werden:

TYPOSCRIPT
<link typo3.org/fileadmin/podcast/podcast-rss.xml>Text</link>

Listing 1

Falls kein beschreibender Text zwischen den Tags eingegeben wird,
erfolgt die Ausgabe des Links, ansonsten wird der verlinkte Text
ausgegeben.

Anzeige
Anzeige

Anzeigen der News

Für die Darstellung der Nachrichten wird das Content-Element „News“
verwendet. Dieses lässt sich für verschiedene Ansichten konfigurieren:
die Darstellung der allerneuesten Nachrichten – beispielsweise auf der Startseite,
eine Auflistung aller Nachrichten oder die Archivdarstellung.

Bei der Anzeige der aktuellsten Meldungen werden nur die Überschrift,
ein Bild und die ersten Zeichen der Meldung ausgegeben.

Der Link „[mehr]“
führt zur Detailansicht der gesamten Nachricht. In der Listenanzeige
werden alle Nachrichten aufgelistet. Gegenüber der „Aktuell-Ansicht“
werden die Bilder größer sowie mit etwas mehr Text angezeigt. Auch hier
führt ein Link zur Detailansicht. Es werden fünf Meldungen pro Seite
angezeigt, bei mehr News kann man sich durch weitere Seiten klicken.

Anzeige
Anzeige

Nach der Installation der Extension ist die Archivfunktion zunächst
ausgeschaltet. Daher werden alle Nachrichten unabhängig vom Alter
aufgelistet. Über den Constant-Editor oder den TypoScript-Parameter
„plugin.tt_news.datetimeDaysToArchive“ kann definiert werden, nach wie
vielen Tagen Meldungen in das Archiv wandern. Bei der Anzeige des Archivs werden dann nur die älteren Meldungen
aufgelistet. Zusätzlich gibt es mit der Darstellung „AMENU“ die
Möglichkeit, die Anzahl der Nachrichten pro Monat, Quartal oder Jahr
anzuzeigen.

Für alle Darstellungen wird immer das Content-Element „News“ verwendet, nur unterschiedlich konfiguriert:

Im Reiter „Allgemeine Einstellungen“ ist die Auswahl der Ansichtsart (z. B.
LATEST) sowie der Speicherort der News-Datensätze (Ausgangspunkt) wichtig. Bei
Auswahl von Rekursiv werden auch die Unterseiten mit einbezogen. Die
Kategorien werden nur aufgelistet, falls über den Eintrag „Allgemeine
Datensatzsammlung“ im Seitentitel der Speicherort definiert wurde. Bei allen Darstellungsarten kann die Auswahl der Nachrichten auf
bestimmte Kategorien beschränkt werden, alternativ lassen sich auch
einzelne Kategorien ausschließen.

Anzeige
Anzeige

Wichtig sind darüber hinaus die Angaben im Reiter „Sonstige Einstellungen“. Um die Nachricht
komplett anzeigen zu können, muss hier unbedingt die Seite angegeben werden, auf der sich ein
News-Plugin mit der Anzeigeart „SINGLE“ befindet. Zusätzlich kann eine Zielseite für den „Zurück“-Link angegeben werden. Erfolgt dort kein Eintrag, gelangt man
automatisch zu der Seite, von der man gekommen ist.

Im Reiter „Template“ kann eine Designvorlage für die Anzeige der
Nachrichten ausgewählt werden. Dies ist nur erforderlich, falls der
Redakteur aus verschiedenen Designs wählen kann. Ansonsten kann der
Pfad zum Template auch über TypoScript angegeben werden:

TYPOSCRIPT
plugin.tt_news.templateFile = fileadmin/templates/main/tt_news_v2_template.html

Listing 2

Die zu tt_news gehörende CSS-Datei kann auf verschiedene Arten
integriert werden: entweder über einen Eintrag in TypoScript
(page.10.includeCSS.file…) oder durch den Import in eine bereits
verwendete CSS-Datei (z. B. content.css):

Anzeige
Anzeige
CSS
@import url(./tt_news/res/tt_news_v2_styles.css)

Listing 3

Auf der Seite „Kategorie Einstellungen“ lässt sich festlegen, wie die
Darstellung und Verlinkung von Kategorien erfolgt. Bei einfachen
Anwendungen müssen hier keine Änderungen vorgenommen werden.

Unterhalb der Ausgabe der „neuesten Nachrichten“ wird ein Link zum
Archiv eingeblendet. Damit dieser funktioniert, muss im Constant-Editor
die Seiten-ID angegeben werden, auf der sich ein News-Plugin mit
Archivdarstellung befindet. Das News-Modul ist eine der mächtigsten Erweiterungen für TYPO3. Darüber hinaus
bildet tt_news die Basis für eine Reihe weiterer Extensions, beispielsweise für das
Blog-Modul timtab. Nahezu alle Einstellungen lassen sich per TypoScript vornehmen.
So kann die Funktionalität und das Erscheinungsbild perfekt an
die jeweilige Anforderung angepasst werden.

Alle Einstellungsmöglichkeiten sind in
der mehr als 70 Seiten umfassenden Dokumentation zu tt_news
aufgelistet. Möchte man die Ausgabe bestimmter Informationen
unterdrücken oder die Reihenfolge umstellen, so muss lediglich das verwendete
Template angepasst werden.

Anzeige
Anzeige

Das Gästebuch

Viele Betreiber einer Website möchten den Besuchern die Möglichkeit
geben, Kommentare zu hinterlassen. Dazu bot TYPO3 von Anfang an das
Modul tt_guest an, das inzwischen aber veraltet ist und heutigen
Anforderungen nicht mehr genügt. Dafür ist mit „Modern Guestbook“ (ve_guestbook) eine neue Erweiterung verfügbar, die zudem recht einfach zu bedienen ist. Nach der
Installation der Extension wird auf der Seite, auf der das Gästebuch
erscheinen soll, das Content-Element „Gästebuch“ eingebunden. Aber
Achtung: Ist zusätzlich noch die Extenion tt_guest installiert (die bis einschließlich TYPO3-Version 3.8 Bestandteil des Sourcecodes ist),
stehen zwei Content-Elemente mit diesem Namen zur Verfügung. Erscheint
nach Auswahl des Plugins nicht das hier gezeigte Eingabeformular, wurde
das falsche Gästebuch ausgewählt.

Zunächst soll ein Eingabeformular auf der Seite erzeugt werden. Dazu
wird im Reiter „Allgemein“ nur die Einstellung „FORM“ ausgewählt. Für die
Speicherung der Beiträge erstellen wir wieder einen Systemordner.
Alternativ können die Datensätze auch direkt auf der Gästebuchseite
abgelegt werden, allerdings könnten dann das Eingabeformular und
die Anzeige der Einträge nicht auf verschiedenen Seiten untergebracht
werden.

Im Reiter „Formular“ kann detailliert festgelegt werden,
welche Felder angezeigt werden. Eingegebene E-Mail- und
Homepage-Adressen können auf Gültigkeit geprüft werden. Außerdem kann sich der Adminstrator der Seite über jeden neuen Eintrag per E-Mail
benachrichtigen lassen. Um z.B. unerwünschte Einträge aus dem
Gästebuch auszuschließen, ist in vielen Fällen eine manuelle Freischaltung angebracht. Im Feld „Blacklist“ können, durch Komma
getrennt, E-Mail-Adressen angegeben werden, die generell keine Beiträge
verfassen dürfen. Über den TypoScript-Parameter „plugin.tx_veguestbook_pi1.allowedTags“
lässt sich festlegen, welche HTML-Tags bei den Einträgen verwendet
werden dürfen. Hier sollte man sich aus Sicherheitsgründen auf reine
Textformatierungen beschränken. Für die Anzeige der Beiträge wird ein weiteres Gästebuch als
Content-Element eingefügt, entweder auf der gleichen Seite direkt
unterhalb des Formulars oder auf einer separaten Seite. Statt
„FORM“ wird als Anzeigemodus LIST gewählt und wiederum der Speicherort
der Datensätze angegeben. In der Standardkonfiguration sieht das
Gästebuch dann wie folgt aus:

Ähnlich wie beim News-Modul können die letzten Einträge im Gästebuch
als Teaser, zum Beispiel auf der Startseite, angezeigt werden. Dazu wird
ein weiteres Content-Element mit dem Anzeigemodus „TEASER“ eingefügt. Über
den Reiter „Liste & Teaser“ können für die Anzeige noch eine Reihe
von Feineinstellungen vorgenommen werden. Auch das Gästebuch wird mit einem Beispiel-Template geliefert, das sich im Verzeichnis „typo3conf/ext/ve_guestbook/pi1“ befindet. Wie bei
den News sollte davon eine Kopie unterhalb von „fileadmin“ abgelegt und
der neue Platz über TypoScript definiert werden:

TYPOSCRIPT
plugin.tx_veguestbook_pi1.templateFile = fileadmin/templates/main/guestbook_template.tmpl

Listing 4

Die CSS-Einstellungen werden allerdings nicht in einer separaten Datei
vorgenommen, sondern direkt in den Quellcode der Seite eingefügt.
Sinnvoller ist es meist jedoch, den CSS-Code von dort zu kopieren und
in eine separate Datei auszulagern. Diese werden ähnlich wie Bilder im
Browsercache abgelegt. Deshalb muss der CSS-Code nicht mit jeder Seite neu
übertragen werden. Um das Einbinden des Standard-CSS in die Seite zu
verhindern, genügt folgender TypoScript-Befehl:

TYPOSCRIPT
plugin.tx_veguestbook_pi1._CSS_DEFAULT_STYLE >

Listing 5

Mehr zu diesem Thema
Fast fertig!

Bitte klicke auf den Link in der Bestätigungsmail, um deine Anmeldung abzuschließen.

Du willst noch weitere Infos zum Newsletter? Jetzt mehr erfahren

Anzeige
Anzeige
Schreib den ersten Kommentar!
Bitte beachte unsere Community-Richtlinien

Wir freuen uns über kontroverse Diskussionen, die gerne auch mal hitzig geführt werden dürfen. Beleidigende, grob anstößige, rassistische und strafrechtlich relevante Äußerungen und Beiträge tolerieren wir nicht. Bitte achte darauf, dass du keine Texte veröffentlichst, für die du keine ausdrückliche Erlaubnis des Urhebers hast. Ebenfalls nicht erlaubt ist der Missbrauch der Webangebote unter t3n.de als Werbeplattform. Die Nennung von Produktnamen, Herstellern, Dienstleistern und Websites ist nur dann zulässig, wenn damit nicht vorrangig der Zweck der Werbung verfolgt wird. Wir behalten uns vor, Beiträge, die diese Regeln verletzen, zu löschen und Accounts zeitweilig oder auf Dauer zu sperren.

Trotz all dieser notwendigen Regeln: Diskutiere kontrovers, sage anderen deine Meinung, trage mit weiterführenden Informationen zum Wissensaustausch bei, aber bleibe dabei fair und respektiere die Meinung anderer. Wir wünschen Dir viel Spaß mit den Webangeboten von t3n und freuen uns auf spannende Beiträge.

Dein t3n-Team

Melde dich mit deinem t3n Account an oder fülle die unteren Felder aus.

Bitte schalte deinen Adblocker für t3n.de aus!
Hallo und herzlich willkommen bei t3n!

Bitte schalte deinen Adblocker für t3n.de aus, um diesen Artikel zu lesen.

Wir sind ein unabhängiger Publisher mit einem Team von mehr als 75 fantastischen Menschen, aber ohne riesigen Konzern im Rücken. Banner und ähnliche Werbemittel sind für unsere Finanzierung sehr wichtig.

Schon jetzt und im Namen der gesamten t3n-Crew: vielen Dank für deine Unterstützung! 🙌

Deine t3n-Crew

Anleitung zur Deaktivierung
Artikel merken

Bitte melde dich an, um diesen Artikel in deiner persönlichen Merkliste auf t3n zu speichern.

Jetzt registrieren und merken

Du hast schon einen t3n-Account? Hier anmelden

oder
Auf Mastodon teilen

Gib die URL deiner Mastodon-Instanz ein, um den Artikel zu teilen.

Anzeige
Anzeige