Stylesheet für Backend-Theme ergänzen: Unterschied zwischen den Versionen

Aus Contao Community Documentation

K (Formatierung)
Zeile 1: Zeile 1:
 +
{{stub}}
 +
[[Kategorie:Admin_HOWTOS]]
 +
[[Kategorie:CSS_HOWTOS]]
 
Wenn man die Darstellung des Contao-Backends nur leicht anpassen möchte, kann man das normale Backend-Theme mit einem zusätzlichen Stylesheet ergänzen. Der Vorteil dieser Lösung ist, dass es updatesicher ist und man nichts an Templates geändert hat.
 
Wenn man die Darstellung des Contao-Backends nur leicht anpassen möchte, kann man das normale Backend-Theme mit einem zusätzlichen Stylesheet ergänzen. Der Vorteil dieser Lösung ist, dass es updatesicher ist und man nichts an Templates geändert hat.
  
Wichtig: Diese Lösung funktioniert erst ab Contao 2.10!
+
{{Hinweis|Diese Lösung funktioniert erst ab Contao 2.10}}
  
 
'''Das Stylesheet einbinden'''
 
'''Das Stylesheet einbinden'''
  
* Unter system/config/ die dcaconfig.php (Datei anlegen, falls sie noch nicht existiert) bearbeiten und folgende Zeile einfügen:
+
Unter system/config/ die dcaconfig.php (Datei anlegen, falls sie noch nicht existiert) bearbeiten und folgende Zeile einfügen:
if(TL_MODE == 'BE') $GLOBALS['TL_CSS'][] = 'tl_files/backend/be.css|screen';
+
<source lang="php">
* In der Dateiverwaltung einen Ordner namens "backend" anlegen und eine Datei namens "be.css" reinpacken.
+
  if(TL_MODE == 'BE')
 +
    $GLOBALS['TL_CSS'][] = 'tl_files/backend/be.css|screen';
 +
</source>
 +
 
 +
In der Dateiverwaltung einen Ordner namens "backend" anlegen und eine Datei namens "be.css" reinpacken.
  
 
Das war es auch schon. Nun kann man die be.css bei Bedarf bearbeiten und dort Anweisungen reinschreiben um per CSS bestimmte Teile des Backends anders darzustellen.
 
Das war es auch schon. Nun kann man die be.css bei Bedarf bearbeiten und dort Anweisungen reinschreiben um per CSS bestimmte Teile des Backends anders darzustellen.
Zeile 13: Zeile 20:
 
So könnte man beispielsweise folgendes in das Stylesheet schreiben:
 
So könnte man beispielsweise folgendes in das Stylesheet schreiben:
  
 +
<source lang="css">
 
/* Verstaerkte Hover/Fokus-Markierung für Listinganzeige in modernen Browsern */
 
/* Verstaerkte Hover/Fokus-Markierung für Listinganzeige in modernen Browsern */
.tl_listing tr:hover, .tl_listing tr:focus { outline: 1px solid #000; }
+
.tl_listing tr:hover, .tl_listing tr:focus {
 +
  outline: 1px solid #000;
 +
}
 +
</source>

Version vom 6. März 2012, 15:01 Uhr

MsgError.png Unvollständiger Artikel: dieser Artikel ist noch nicht sauber bearbeitet.

Bitte erweitere ihn und entferne erst anschliessend diesen Hinweis.

Wenn man die Darstellung des Contao-Backends nur leicht anpassen möchte, kann man das normale Backend-Theme mit einem zusätzlichen Stylesheet ergänzen. Der Vorteil dieser Lösung ist, dass es updatesicher ist und man nichts an Templates geändert hat.


Hinweis.png Hinweis: Diese Lösung funktioniert erst ab Contao 2.10


Das Stylesheet einbinden

Unter system/config/ die dcaconfig.php (Datei anlegen, falls sie noch nicht existiert) bearbeiten und folgende Zeile einfügen:

  if(TL_MODE == 'BE')
    $GLOBALS['TL_CSS'][] = 'tl_files/backend/be.css|screen';

In der Dateiverwaltung einen Ordner namens "backend" anlegen und eine Datei namens "be.css" reinpacken.

Das war es auch schon. Nun kann man die be.css bei Bedarf bearbeiten und dort Anweisungen reinschreiben um per CSS bestimmte Teile des Backends anders darzustellen.

So könnte man beispielsweise folgendes in das Stylesheet schreiben:

/* Verstaerkte Hover/Fokus-Markierung für Listinganzeige in modernen Browsern */
.tl_listing tr:hover, .tl_listing tr:focus {
  outline: 1px solid #000;
}
Ansichten
Meine Werkzeuge

Contao Community Documentation

die Liste ist länger als ich und lindes zusammen...

Yanick Witschi
Navigation
Verstehen
Verwenden
Entwickeln
Verschiedenes
Werkzeuge