Benutzer-Werkzeuge

Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen angezeigt.

Link zu dieser Vergleichsansicht

Nächste Überarbeitung
Vorhergehende Überarbeitung
breedmaster:home-template [17.01.2018 20:13] – angelegt Manfred Linkbreedmaster:home-template [03.07.2018 12:27] (aktuell) – [Standard-Template (alt)] Manfred Link
Zeile 1: Zeile 1:
 ====== Home-Template ====== ====== Home-Template ======
  
-Die Startseite, bzw. Home-Seite der Datenbank kann über ein HTML-Template fast vollständig umgestaltet werden. Dabei kann auf eine Reihe von vordefinierten Variablen zugegriffen werden. Diese sind durch geschweiften Klammern ''{}'' umschlossen. +Die Startseite, bzw. Home-Seite der Datenbank kann über ein HTML-Template fast vollständig umgestaltet werden. Dabei kann auf eine Reihe von vordefinierten Variablen zugegriffen werden. Diese sind durch geschweifte Klammern ''{}'' umschlossen. 
  
-Nachfolgend ein Beispiel für eine Standardansicht:+==== Standard-Template ==== 
 +Nachfolgend ein Beispiel für eine Standardansicht, basierend auf [[Bootstrap]]: 
 +<code html> 
 +<div class="container"> 
 + <div class="row"> 
 + <div id="links" class="col-md-3"> 
 + {cms:mainmenu} 
 + </div> 
 + <div id="mitte" class="col-md-6"> 
 + <p>{box:bemerkungen}</p> 
 + <p>{box:news}</p> 
 + </div> 
 + <div id="rechts" class="col-md-3"> 
 + {box:schnellsuche} 
 + {box:zufallsbild}  
 + {box:deckmeldungen}  
 + {box:deckrueden}  
 + {box:wuerfe}  
 + {box:statistiken} 
 + </div> 
 + </div> 
 +</div> 
 +</code> 
 +Zur Einteilung in Spalten wird das Grid-System von Bootstrap verwendet. Erkennbar an den CSS-Klassen mit den bezeichnungen ''col-md-x'', wobei x die Breite der Spalte angibt. In Summe können in einer Zeile (row) maximal 12 Spalten genutzt werden. 
 + 
 +==== 2-Spaltiges Layout ==== 
 +Mit folgendem HTML-Code wird ein 2-spaltiges Layout genutzt, mit einer breiten linken Spalte. 
 +<code html> 
 +<div class="container"> 
 + <div class="row"> 
 + <div id="links" class="col-md-8"> 
 + 
 + {box:bemerkungen} 
 + {box:news} 
 + </div> 
 + <div id="rechts" class="col-md-4"> 
 + {box:schnellsuche} 
 + {box:zufallsbild}  
 + {cms:mainmenu} 
 + {box:deckmeldungen}  
 + {box:deckrueden}  
 + {box:wuerfe}  
 + {box:statistiken} 
 + </div> 
 + </div> 
 +</div> 
 +</code> 
 + 
 +==== Standard-Template (alt) ==== 
 +Folgendes Beispiel ist veraltet, aber nach wie vor funktionsfähig. Das Erscheinungsbild ist fast identisch mit obigen Beispiel:
  
 <code html> <code html>
-<div> 
  <div id="wrapper">  <div id="wrapper">
  <div class="custommenu" id="menubereich">  <div class="custommenu" id="menubereich">
Zeile 26: Zeile 74:
  </div>  </div>
  </div>  </div>
-</div>+
 </code> </code>
  
Zeile 44: Zeile 92:
   * news   * news
  
 +==== Benutzer-Daten ====
 +Ab Version 12.7.3 von Breedmaster können die Daten des aktuellen Nutzers in der Ausgabe integriert werden. Dadurch sind persönliche Anreden oder auch vorausgefüllte Formularfelder realisierbar. Allen Feldern muss als Prefix ''USR_'' vorangestellt werden. Um also Vorname und Nachname eines Nutzers anzuzeigen, wäre folgender Eintrag notwendig:
 +<code html>
 +<h3>Guten Tag {USR_vorname} {USR_nachname}</h3>
 +</code>
 +
 +===== Weitere Beispiele =====
 +Zur einfacheren grafischen Gestaltung kann auf Standard Bootstrap-Klassen zurückgegriffen werden, wie z. B.
 +
 +Zeigt einen Artikel in einer grünen Hinweisbox:
 +<code html>
 +<div class="alert alert-success">{cms:xxx}</div>
 +</code>
 +
 +Zeigt einen Artikel in einer roten Hinweisbox:
 +<code html>
 +<div class="alert alert-danger">{cms:xxx}</div>
 +</code>
 +
 +Zeigt einen Artikel in einer blauen Hinweisbox:
 +<code html>
 +<div class="alert alert-info">{cms:xxx}</div>
 +</code>
  
 +Neben dem Template für die Home-Seite kann auch das Template für [[showpage-template|Showpage]] angepasst werden.

This website uses cookies. By using the website, you agree with storing cookies on your computer. Also, you acknowledge that you have read and understand our Privacy Policy. If you do not agree, please leave the website.

Weitere Information