Benutzer-Werkzeuge

Webseiten-Werkzeuge


breedmaster:home-template

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.
breedmaster/home-template.1516220007.txt.gz · Zuletzt geändert: 17.01.2018 20:13 von Manfred Link

Donate Powered by PHP Valid HTML5 Valid CSS Driven by DokuWiki