Contao – Logo ins Seitenlayout einbinden

1 Kommentar

Für (fast) jede Seite wird ein Logo benötigt welches auf der Seite eingebunden wird. Hier möchte ich kurz beschreiben wie ich dieses in Contao einbinde. Natürlich gibt es zig Wege dies zu bewerkstelligen.

Eigener HTML Code

Für das Logo verwende ich immer das Modul Eigener HTML Code. Der Aufbau sieht folgendermaßen aus. Ich definiere als Überschrift (h1) den Namen des “Kunden”. Anschließend wird das Logo (das zuvor natürlich auf den Webspace geladen werden muss) eingebunden und verlinkt. Der HTML Code sieht dann folgendermaßen aus:


<h1>Michaela Schwarz</h1>
<a href="{{env::path}}" title="{{env::website_title}}">
<img src="tl_files/schwarz/resourcen/img/logo.png" alt="Michaela Schwarz Logo" />
</a>

Bisher nocht nicht wirklich etwas erwähnenswertes, oder doch? Der Code besteht nicht nur aus HTML sondern auch aus sogenannten Insertags. Der Grund dürfte klar sein. Somit gestalte ich den Code dynamisch und ich kann diesen fast ohne Anpassungen in mehreren Projekten einsetzen.

Inserttags

Inserttags sind Platzhalter, die bei der Ausgabe einer Seite durch bestimmte Inhalte ersetzt werden. So kann beispielsweise das aktuelle Datum angezeigt oder ein Benutzer mit seinem Namen angesprochen werden. Inserttags können fast überall in Contao verwendet werden.

Wie unschwer zu erkennen verwende ich folgende Inserttags
{{env::path}} – Dieses Tag wird mit der aktuellen Basis-URL samt Pfad zum Contao-Verzeichnis ersetzt.
{{env::website_title}} – Dieses Tag wird mit dem Titel der Webseite ersetzt.

Wenn wir diese Modul nun ins Seitenlayout integrieren (zb in den Header Bereich) haben wir das Logo auf allen Seiten, mit Link auf die Startseite.

Ähnliche Beiträge

CSS3 Buttons

Keine Kommentare

Das mit CSS3 vieles möglich ist dürfte sich ja bereits rumgesprochen haben. Heute habe ich im RSS Reader wieder eine nette Seite zum Thema Buttons via CSS3 gefunden. Es werden dort ca 35 Buttons (sprich normale Links) verschieden gestylt. Am Ende der Seite steht das CSS File zum Download bereit.
Eine Kleinigkeit ist jedoch zu beachten, diese Buttons funktionieren nur mit Webkit Browsern (wie zB Chrome, Safari). Firefox und vorallem im IE sind diese nicht zu gebrauchen.

Wie seht ihr das mit dem Einsatz von CSS3, setzt ihr die Technik bereits effektiv ein und verwendet diverse Javascript Lösungen um anderen Browsern den selben Effekt beizubringen? Oder lasst ihr sogar zB den IE außen vor und sagt, dann siehts eben nicht so schön aus?

Ähnliche Beiträge

CSS Reset

Keine Kommentare

Ich denke was ein CSS Reset ist dürfte mittlerweile jeder kennen, die jenigen denen das nichts sagt kurz mal die Erklärung. Jeder Browser hat ein internes Stylesheet, dieses wird herangezogen um generell eine Formatierung von HTML zu ermöglichen, bei einer eigenen Webseite wird das interne Browser CSS überschrieben, nun ist es allerdings so das zB die Abstände (margin und padding) in verschiedenen Browsern anders sind. Die Folge, die eigene Webseite sieht in jedem Browser anders aus. Soweit die grobe Erklärung.

Webdesigner verwenden nun meistens (wobei das eine subjektive Einschätzung ist) ein sogenanntes reset.css. Bei diesem Stylesheet werden alle Abstände und andere Formatierungen zurückgesetzt, nun kann der Designer fröhlich mit seinem CSS die Seite gestalten. Einer der bekanntesten Resets dürfte das von Eric Meyer sein. Auf der Seite cssresetr.com können nun einige Resets ausprobiert werden.

Ähnliche Beiträge

HTML für den Seitentitel freischalten (Contao)

16 Kommentare

Hier ein kleiner Tipp am Rande. Häufig sieht man auf Webseiten eine Navigation welche unter dem eigentlichen Link eine kurze Beschreibung beinhalten. Wie zB auch hier. Diese Frage wird auch häufiger im Contao Forum gestellt. Die Lösung dazu ist relativ einfach.

Hierzu muss das DCA überschrieben werden. Wir öffnen deshalb die system/config/dcaconf.php. Anschließend fügen wir folgende Zeile ans Ende ein:

  1. $GLOBALS[‘TL_DCA’][‘tl_page’][‘fields’][‘title’][‘eval’][‘preserveTags’] = true;

Nur noch abspeichern und dann kann als Seitentitel zB folgendes eingetragen werden

  1. Seitentitel<span>Beschreibung</span>

Den Rest kann dann mittels CSS angepasst werden.
Weiters gibt es noch die Möglichkeit HTML für Nachrichtentitel einzugeben, hierzu benötigt man folgenden Eintrag in der dcaconf.php

  1. $GLOBALS[‘TL_DCA’][‘tl_news’][‘fields’][‘headline’][‘eval’][‘preserveTags’] = true;

Danke an Thomas für den Hinweis

Clemens hat in den Kommentaren gerade noch die DCA Konfiguration hinterlassen, mit der es möglich ist Seitentitel in Modulen mit HTML zu versehen, danke dafür.

  1. $GLOBALS[‘TL_DCA’][‘tl_module’][‘fields’][‘headline’][‘eval’][‘preserveTags’] = true;

Ähnliche Beiträge

Optimierung von Ladezeiten bei TYPOlight

1 Kommentar

Im TYPOlight Forum wurde wieder ein nützlicher Thread eröffnet. Hierbei geht es um die Basics der Ladezeitoptimierung (gibt es dieses Wort?). Im Prinzip dürften diese Hinweise für jeglichen Seiten gelten egal ob mit TYPO3, TYPOlight, WordPress oder sonst was. Bei meiner nächsten Seite(n) werde ich diese sicher umsetzen (besser gesagt werde ich es versuchen).

Hier gehts zum angesprochenen Thread.

Ähnliche Beiträge

Ältere Einträge