5. Individualisierung

5.1. Templates

5.1.1. Was ist ein Template?

Ein Template (zu dt. "Schablone") dient zur kompletten Trennung von HTML und Programmcode. Somit ist es für einen Administrator möglich den HTML Code und damit das Layout anzupassen ohne Programmierkenntnisse zu haben und in irgendwelchen Programmiercodedateien suchen zu müssen. Templates enthalten Platzhalter, diese werden während der Generierung einer Seite des Forums mit Inhalten gefüllt. Das können andere Templates aber auch Inhalt aus der Datenbank sein.

5.1.2. Was ist ein Templatepack?

Ein Templatepack ist eine Sammlung von Templates. Templatepacks werden üblicherweise angelegt um sie dann einem Style zuzuordnen. Eigene Templatepacks sollten immer nur Templates enthalten, die sich vom Gegenstück in den Standardtemplates unterscheiden.

Um die Exportfunktion für Templates zu nutzen, muß ein Exportordner im Dateisystem für das Templatepack angegeben werden.

5.1.3. Welche Templates für welche Seite?

Zur besseren Übersicht tragen die Template oftmals den Namen der Datei, in der sie benutzt werden. Das Template, das für die Startseite (Dateiname: index.php) zuständig ist, trägt den namen "index". Für eine Seite sind zumeist mehrere verschiedene Templates zuständig, dann tragen sie im Namen noch einen Zusatz getrennt durch einen Unterstrich (z.b. "index_stats").

Ist man nicht in der Lage ein Template zu finden, kann man noch mit der Option "Templates suchen & ersetzen" nach Templates suchen. Dort sollte man nach einem möglichst eindeutigen Begriff aus dem Templateinhalt suchen.

5.1.4. Bearbeitung und Änderung

Das Forum wird mit den sog. Standardtemplates ausgeliefert. Diese enthalten den Original HTML Code und auch nur diese werden bei einem Updatevorgang auf eine neuere Version aktualisiert. Dementsprechend ist es zu empfehlen diese Templates nicht zu verändern, da sonst ein reibungsloser Betrieb des Forums nicht mehr gewährleitet werden kann.

Vielmehr empfiehlt es sich ein eigenes Templatepack anzulegen und dort nur die Template abzulegen, die wirklich im Vergleich zu den Standardtemplates verändert wurden. Ein eigenes Templatepack muß nicht komplett sein, fehlende Template werden automatisch mit den Standardtemplates aufgefüllt. Möchte man also das Template "index" bearbeiten, kopiert man es aus den Standardtemplates in ein eigenes Templatepack, was natürlich vorher angelegt werden muß. Dort kann man das Template dann nach belieben verändern. Stellt man zu einem späteren Zeitpunkt fest, dass man die Templateänderungen nicht mehr möchte, kann man das Template ohne weiteres aus dem eigenen Templatepack löschen oder aus den Standardtemplates wieder mit dem Original überschreiben.

5.1.5. Exportieren von Templates

Ein Exportieren von Templates macht bei folgendem Fall Sinn:

1. Wenn man die Templates herunterladen möchte, um sie lokal zu bearbeiten. Wenn man die Template nicht im Templateeditor des Adminbereichs bearbeiten möchte, kann man die Templates in einzelnen Dateien, wie normale HTML Dateien, herunterladen. Damit Änderungen wirksam werden, müssen die Templates zu einem späteren Zeitpunkt dann wieder importiert werden.

Die Exportfunktion kann alle Templates, ganze Templatepacks oder als auch nur einzelne Templates exportieren.

5.1.6. Importieren von Templates

Liegen die Templates im Dateiformat vor, ist es möglich sie in die Datenbank zu importieren. Dazu wird zunächst das Templatepack , in das die Templates importiert werden sollen, und der Ordner, in dem die Templates im Dateiformat vorliegen, festgelegt. Die Templates werden daraufhin gemäß ihres Namens angelegt - bereits vorhandende mit gleichem Namen werden dabei ohne zusätzliche Abfrage überschrieben.

5.1.7. Templatescripting

In allen Templates ist Templatescripting möglich: Damit sind einfache IF-ELSE sowie SWITCH Verzweigungen möglich. Zusätzlich gibt es das <expression> Tag, das es erlaubt, php Funktionen auszuführen und den Rückgabewert in der Template darzustellen.

Die Syntax für Templatescripting ist:
# if Tag:
<if($wbbuserdata['userid']!=0)>
<then>Hallo $wbbuserdata[username]</then>
<else>Hallo Gast</else>
</if>

# switch Tag:
<switch($x)>
<case("value1")>a</case>
<case("value2")>b</case>
<default>c</default>
</switch>

# expression Tag:
# Damit können php Funktionen im Template aufgerufen werden.
<expression>meineFunktion()</expression>

5.1.8. Templatecaching

Templates (sowohl "normale" als auch die ACP Templates) müssen nach jeder Änderung gecachet werden. Wenn man seine Templates über das ACP bearbeitet, geschieht das automatisch. Falls man seine Templates exportiert hat, muss man sie nach der Bearbeitung wieder importieren. Die Templates können per Script oder im ACP relativ komfortabel gecachet werden. Während normale Templates bei Änderungen automatisch gecachet werden, muss man, um die ACP Templates ein spezielles Script aufrufen, dass sich im Extra-Ordner des Downloadarchivs befindet.

5.1.9. Informationen zur Anpassung der Templates

Jedes Designelement ist innerhalb der Templates wie folgt aufzurufen:

$style[designelement] bzw. {$style['designelement']}

Beispiel einer inneren Tabelle ab Version 2.1:

<table cellpadding="{$style['tableincellpadding']}" cellspacing="{$style['tableincellspacing']}" border="{$style['tableinborder']}" style="width:{$style['tableinwidth']}" class="tableinborder">

	<tr class="tabletitle">
		<td colspan="4"><span class="normalfont">Inhalt von Zeile 1</span></td>
	</tr>
	<tr>

		<td class="tablea" style="width: 25%"><span class="smallfont">kleine Schrift..</span></td>
		<td class="tableb" style="width: 25%"><span class="smallfont">kleine Schrift..</span></td>

		<td class="tablea" style="width: 25%"><span class="smallfont">kleine Schrift..</span></td>
		<td class="tableb" style="width: 25%"><span class="smallfont">kleine Schrift..</span></td>

	</tr>
</table>

Die wichtigsten Änderungen im Vergleich zu Version 2.0

• Anders als noch in Version 2.0 werden seit Version 2.1 CSS Klassen benutzt.
  
• Es gibt keine Subvariables mehr, die bei der Ausgabe der Templates erst ersetzt werden müssen. Stattdessen können Designelemente als ganz normale PHP Variablen in den Templates benutzt werden. Wo in Version 2.0 mit Subvariables Farbwerte ersetzt wurden, werden seit Version 2.1 vorwiegend CSS Klassen verwendet.
  
• {imagefolder} geändert in {$style['imagefolder']}
  
• <normalfont>normale Schrift</font> geändert in <span class="normalfont">normale Schrift</span>
  
• <smallfont>kleine Schrift</font> geändert in <span class="smallfont">kleine Schrift</span>
  

5.1.10. Alte Subvariables und Ihre Pendants ab dem wBB 2.1

Subvariable	Designelement
<body	Fällt weg. (CSS)
{tableoutbordercolor}	Bleibt gleich, wird in den Templates aber nicht mehr verwendet. Stattdessen CSS Klasse tableoutborder.
{tableinbordercolor}	Bleibt gleich, wird in den Templates aber nicht mehr verwendet. Stattdessen CSS Klasse tableinborder.
{tabletitlecolor}	Bleibt gleich, wird in den Templates aber nicht mehr verwendet. Stattdessen CSS Klasse tabletitle.
{tablecolora}	Heisst jetzt tableabgcolor, wird in den Templates aber nicht mehr verwendet. Stattdessen CSS Klasse tablea.
{tablecolorb}	Heisst jetzt tablebbgcolor, wird in den Templates aber nicht mehr verwendet. Stattdessen CSS Klasse tableb.
{fontcolorsecond}	Heisst jetzt tabletitlefontcolor. Wird in den Templates aber nicht verwendet. Stattdessen: <td class="tabletitle"><span class="normalfont">Text</span></td>
{fontcolorthird}	Heisst jetzt tablecatfontcolor. Wird in den Templates aber nicht verwendet. Stattdessen: <td class="tablecat"><span class="normalfont">Text</span></td>
{tablecatcolor}	Heisst jetzt tablecatbgcolor, wird in den Templates aber nicht mehr verwendet. Stattdessen CSS Klasse tablecat.
{tableinwidth}	Bleibt gleich. *
{timecolor}	Heisst jetzt timefontcolor. Wird in den Templates aber nicht verwendet. Stattdessen: <span class="time">Zeit</span>
{imagefolder}	Bleibt gleich. *
<hilight>	<span class="highlight">
</hilight>	</span>
{inposttablecolor}	Heisst jetzt inposttablebgcolor, wird in den Templates aber nicht mehr verwendet. Stattdessen CSS Klasse inposttable.
{prefixcolor}	Heisst jetzt prefixfontcolor. Wird in den Templates aber nicht verwendet. Stattdessen: <span class="prefix">Präfix</span>
{mainbgcolor}	Bleibt gleich, wird in den Templates aber nicht mehr verwendet. Stattdessen CSS Klasse mainpage.
<smallfont>	Statt <smallfont>klein</font> nun <span class="smallfont">klein</span>
<normalfont>	Statt <normalfont>klein</font> nun <span class="normalfont">normal</span>
{tableoutwidth}	Bleibt gleich. *
{!DOCTYPE}	Wird ersetzt durch XHTML 1.0 Transitional Dokumententyp.
* = Veränderten Aufruf von Designelementen beachten: {$style['designelement']}

5.2. Designpacks

5.2.1. Was ist ein Designpack?

Der Designpack legt fest, welche Farben, Schriften, Bilder und Buttons im Forum verwendet werden. Hat man z.B. verschiedene Buttons, kann man im Designpack festlegen, welche buttons verwendet werden sollen. Auch werden dort die Cascading Stylesheets für das Forum definiert.

5.2.2. Erstellung/Bearbeitung eines Designpacks

Will man einen neuen Designpack erstellen, sollte man sich zunächst den CSS Code aus einem anderen Designpack kopieren. Nun trägt man die gewünschten Farben, Größen etc. ein, passt eventuell noch den CSS Code an und speichert das neue Designpack ab. Damit das Designpack dann auch im Forum erreichbar ist, muß es noch einem Style zugeordnet werden.

Bei der Bearbeitung passt man die bereits vorhandenen Angabe nach Wunsch an.

5.2.3. Designelemente

So gut wie alle Aussehensmerkmale des WoltLab Burning Boards ab Version 2.1 werden durch ein CSS Stylesheet festgelegt.
Dieses Stylesheet kann man im Admin Control Panel unter dem Link "Designpack bearbeiten" komfortabel bearbeiten.

Info:
Die Schritte können Sie auch in unserer Admindemo (unter Designpack bearbeiten) nachvollziehen.

Die einzelnen Designelemente sind in Gruppen eingeteilt, die so gut wie alle eine oder mehrere CSS Klassen bilden. Es gibt folgende Gruppen:

Hintergründe, Farben und Tabellen:

• Hintergrund
  
• Äußere Tabelle
  
• Innere Tabelle
  
• Tabellenkopf
  
• Tabellenkategorienzeile
  
• Tabellenzeile A
  
• Tabellenzeile B
  
• Tabelle in innerer Tabelle
  

Schriftarten, -farben und -größen:

• Eigenschaften von normaler Schrift
  
• Eigenschaften von kleiner Schrift
  
• Highlighting
  
• Formatierung von Präfixen
  
• Zeitformatierung
  
• Formatierung für öffentlichen Terminen
  
• Formatierung für private Termine
  

Formatierung von Eingabefeldern:

• Formatierung für Drop-Down Boxen
  
• Formatierung für Textareas
  
• Formatierung für sonstige Eingabeelemente
  

Bilder & Logo:

• Bilder
  

Formatierung von Links

• Allgemeine Links
  
• Allgemeine Links (mouseover)
  
• Links im Tabellenkopf
  
• Links im Tabellenkopf (mouseover)
  
• Links in Tabellenkategorienzeile
  
• Links in Tabellenkategorienzeile (mouseover)
  
• Links in Tabellenzeile A
  
• Links in Tabellenzeile A (mouseover)
  
• Links in Tabellenzeile B
  
• Links in Tabellenzeile B (mouseover)
  

Sonstiges

• Farben für "Thema bewerten" Farbverlauf
  
• Weitere Cascading Stylesheets (CSS)
  

5.2.4. Die einzelnen Gruppen im Detail

• Hintergrund
  Beschreibung: Die Eigenschaften dieser Gruppe wirken sich auf den Hintergrund des Forums aus.
  Zugehörige CSS Klasse(n): <body> Tag
  Elemente:
  
  1. Hintergrundfarbe (pagebgcolor)
     bestimmt die Hintergrundfarbe des Forums
     
  2. Schriftfarbe (fontcolor)
     bestimmt die Schriftfarbe des Forums
     
  3. Schriftart (fontface)
     bestimmt die Schriftart des Forums
     
  4. Weitere Attribute (bodymore)
     
  
  
  
  
  
• Äußere Tabelle
  Beschreibung: Die Eigenschaften dieser Gruppe wirken sich auf die äußere Tabelle des Forums aus.
  Zugehörige CSS Klasse(n): tableoutborder, mainpage
  Elemente:
  
  1. Randfarbe (tableoutbordercolor)
     bestimmt die Randfarbe der äußeren Tabelle.
     CSS Klasse: tableoutborder
     
  2. Hintergrundfarbe (mainbgcolor)
     bestimmt den Hintergrund der äußeren Tabelle
     CSS Klasse: mainpage
     
  3. Tabellenweite (tableoutwidth)
     bestimmt die Breite der äußeren Tabelle.
     CSS Klasse: --keine--
     
  4. Tabellenrahmen (tableoutborder)
     Bestimmt die Breite des Rahmens der Äußeren Tabelle
     CSS Klasse: --keine--
     
  5. Spaltenzwischenraum (tableoutcellspacing)
     Bestimmt den Zwischenraum zwischen Zellen der äußeren Tabelle.
     Bestimmt indirekt die Breite der Rahmen um die Zellen der äußeren Tabelle.
     CSS Klasse: --keine--
     
  6. Spaltenabstand (tableoutcellpadding)
     Bestimmt den Abstand der Inhalte vom Innenrand der Zelle der äußeren Tabelle.
     CSS Klasse: --keine--
     
  
  
  
  
  
• Innere Tabelle
  Beschreibung: Die Eigenschaften dieser Gruppe wirken sich auf alle inneren Tabellen des Forums aus.
  Zugehörige CSS Klasse(n): tableinborder
  Elemente:
  
  1. Randfarbe (tableinbordercolor)
     Bestimmt die Randfarbe aller inneren Tabellen des Forums.
     CSS Klasse: tableinborder
     
  2. Tabellenweite (tableinwidth)
     Bestimmt die Breite aller inneren Tabellen des Forums.
     CSS Klasse: --keine--
     
  3. Tabellenrahmen (tableinborder)
     Bestimmt die Breite des Rahmens aller inneren Tabellen des Forums
     CSS Klasse: --keine-
     
  4. Spaltenzwischenraum (tableincellspacing)
     Bestimmt den Zwischenraum zwischen Zellen der inneren Tabellen des Forums.
     Besitmmt indirekt die Breite der Rahmen um die Zellen der inneren Tabellen.
     CSS Klasse: --keine--
     
  5. Spaltenabstand (tableincellpadding)
     Bestimmt den Abstand der Inhalte vom Innenrand der Zellen der inneren Tabellen
     CSS Klasse: --keine--
     
  
  
  
  
  
• Tabellenkopf
  Beschreibung: Die Eigenschaften dieser Gruppe wirken sich auf den Tabellenkopf einer Tabelle aus.
  Zugehörige CSS Klasse(n): tabletitle
  Elemente:
  
  1. Hintergrundfarbe (tabletitlebgcolor)
     Bestimmt die Hintergrundfarbe des Tabellenkopfes.
     CSS Klasse: tabletitle
     
  2. Schriftfarbe (tabletitlefontcolor)
     Bestimmt die Schriftfarbe im Tabellenkopf.
     CSS Klasse: tabletitle
     
  3. Weitere Attribute (CSS Code)
     Hier sind weitere CSS Codes zur Klasse tabletitle möglich.
     Wird im Standarddesignpack genutzt, um ein Hintergrundbild mit Verlauf in den Tabellenkopf einzubinden.
     CSS Klasse: tabletitle
     
  
  
  
  
  
• Tabellenkategorienzeile
  Beschreibung: Die Eigenschaften dieser Gruppe wirken sich auf die Tabellenkategorienzeile aus.
  Zugehörige CSS Klasse(n): tablecat
  Elemente:
  
  1. Hintergrundfarbe (tablecatbgcolor)
     Bestimmt die Hintergrundfarbe der Tabellenkategorienzeile.
     CSS Klasse: tablecat
     
  2. Schriftfarbe (tablecatfontcolor)
     Bestimmt die Schriftfarbe in der Tabellenkategorienzeile.
     CSS Klasse: tablecat
     
  3. Weitere Attribute (CSS Code)
     Hier sind weitere CSS Codes zur Klasse tablecat möglich.
     CSS Klasse: tabletitle
     
  
  
  
  
• Tabellenzeile A
  Beschreibung: Die Eigenschaften dieser Gruppe wirken sich auf die Tabellenzeile A aus.
  Zugehörige CSS Klasse(n): tablea
  Elemente:
  
  1. Hintergrundfarbe (tableabgcolor)
     Bestimmt die Hintergrundfarbe der Tabellenzeile A
     CSS Klasse: tablea
     
  2. Schriftfarbe (tableafontcolor)
     Bestimmt die Schriftfarbe in der Tabellenzeile A.
     CSS Klasse: tablea
     
  3. Weitere Attribute (CSS Code)
     Hier sind weitere CSS Codes zur Klasse tablea möglich.
     CSS Klasse: tablea
     
  
  
  
  
  
• Tabellenzeile B
  Beschreibung: Die Eigenschaften dieser Gruppe wirken sich auf die Tabellenzeile B aus.
  Zugehörige CSS Klasse(n): tableb
  Elemente:
  
  1. Hintergrundfarbe (tablebbgcolor)
     Bestimmt die Hintergrundfarbe der Tabellenzeile B
     CSS Klasse: tableb
     
  2. Schriftfarbe (tablebfontcolor)
     Bestimmt die Schriftfarbe in der Tabellenzeile B.
     CSS Klasse tableb
     
  3. Weitere Attribute (CSS Code)
     Hier sind weitere CSS Codes zur Klasse tableb möglich.
     CSS Klasse: tableb
     
  
  
  
  
  
• Tabelle in innerer Tabelle
  Beschreibung: Die Eigenschaften dieser Gruppe wirken sich auf Tabellen innerhalb der inneren Tabellen aus.
  Zugehörige CSS Klasse(n): inposttable
  Elemente:
  
  1. Hintergrundfarbe (inposttablebgcolor)
     Bestimmt die Hintergrundfarbe der Tabellen innerhalb der inneren Tabellen.
     CSS Klasse: inposttable
     
  2. Weitere Attribute (CSS Code)
     Hier sind weitere CSS Codes zur Klasse inposttable möglich.
     CSS Klasse: inposttable
     
  
  
  
  
  
• Eigenschaften von normaler Schrift
  Beschreibung: Die Eigenschaften dieser Gruppe wirken sich auf die normale Schrift im Forum aus.
  Zugehörige CSS Klasse(n): normalfont
  Elemente:
  
  1. Schriftart (normalfontface)
     Bestimmt die Schriftart der normalen Schrift im Forum
     CSS Klasse: normalfont
     
  2. Schriftgröße (normalfontsize)
     Bestimmt die Schriftgröße der normalen Schrift im Forum
     Einheit: Pixel (px)
     CSS Klasse: normalfont
     
  3. Schriftfarbe (normalfontcolor)
     Bestimmt die Schriftfarbe der normalen Schrift im Forum
     CSS Klasse: normalfont
     
  4. Weitere Attribute (CSS Code)
     Hier sind weitere CSS Codes zur Klasse normalfont möglich.
     CSS Klasse: normalfont
     
  
  
  
  
  
• Eigenschaften von kleiner Schrift
  Beschreibung: Die Eigenschaften dieser Gruppe wirken sich auf die kleine Schrift im Forum aus.
  Zugehörige CSS Klasse(n): smallfont
  Elemente:
  
  1. Schriftart (smallfontface)
     Bestimmmt die Schriftart der kleinen Schrift im Forum.
     CSS Klasse: smallfont
     
  2. Schriftgröße (smallfontsize)
     Bestimmt die Schriftgröße der kleinen Schrift im Forum.
     Einheit: Pixel (px)
     CSS Klasse: smallfont
     
  3. Schriftfarbe (smallfontcolor)
     Bestimmt die Schriftfarbe der kleinen Schrift im Forum.
     CSS Klasse: smallfont
     
  4. Weitere Attribute (CSS Code)
     Hier sind weitere CSS Codes zur Klasse smallfont möglich.
     CSS Klasse: smallfont
     
  
  
  
  
  
• Highlighting
  Beschreibung: Die Eigenschaften dieser Gruppe wirken sich auf die Markierung von Suchbegriffen aus.
  Zugehörige CSS Klasse(n): highlight
  Elemente:
  
  1. Schriftfarbe (highlightfontcolor)
     Bestimmt die Schriftfarbe der Markierung von Suchbegriffen.
     CSS Klasse: highlight
     
  2. Schriftformatierung (highlightfontweight)
     Bestimmt das "Schriftgewicht" von markierten Suchbegriffen (z.B. fett).
     CSS Klasse: highlight
     
  3. Textdekoration (highlightdeco)
     Bestimmt die Textverzierung von markierten Suchbegriffen (z.B. unterstrichen).
     CSS Klasse: highlight
     
  4. Weitere Attribute (CSS Code)
     Hier sind weitere CSS Codes zur Klasse highlight möglich.
     CSS Klasse: highlight
     
  
  
  
  
  
• Formatierung von Präfixen
  Beschreibung: Die Eigenschaften dieser Gruppe wirken sich auf die Formatierung von Präfixen aus.
  Zugehörige CSS Klasse(n): prefix
  Elemente:
  
  1. Schriftfarbe (prefixfontcolor)
     Bestimmt die Schriftfarbe von Präfixen.
     CSS Klasse: prefix
     
  2. Schriftformatierung (prefixfontweight)
     Bestimmt das "Schriftgewicht" von Präfixen (z.B. fett).
     CSS Klasse: prefix
     
  3. Textdekoration (prefixdeco)
     Bestimmt die Textverzierung von Präfixen (z.B. unterstrichen).
     CSS Klasse: prefix
     
  4. Weitere Attribute (CSS Code)
     Hier sind weitere CSS Codes zur Klasse prefix möglich.
     CSS Klasse: prefix
     
  
  
  
  
  
• Zeitformatierung
  Beschreibung: Die Eigenschaften dieser Gruppe wirken sich auf die Formatierung von Uhrzeiten und Daten aus.
  Zugehörige CSS Klasse(n): time
  Elemente:
  
  1. Schriftfarbe (timefontcolor)
     Bestimmt die Schriftfarbe von Uhrzeiten.
     CSS Klasse: time
     
  2. Schriftformatierung (timefontweight)
     Bestimmt das "Schriftgewicht" von Uhrzeiten (z.B. fett).
     CSS Klasse: time
     
  3. Textdekoration (timedeco)
     Bestimmt die Textverzierung von Uhrzeiten (z.B. unterstrichen).
     CSS Klasse: time
     
  4. Weitere Attribute (CSS Code)
     Hier sind weitere CSS Codes zur Klasse time möglich.
     CSS Klasse: time
     
  
  
  
  
  
• Formatierung für öffentlichen Terminen
  Beschreibung: Die Eigenschaften dieser Gruppe wirken sich auf die Formatierung von öffentlichen Terminen im Kalender aus.
  Zugehörige CSS Klasse(n): publicevent
  Elemente:
  
  1. Schriftfarbe (publiceventfontcolor)
     Bestimmt die Schriftfarbe von öffentlichen Terminen im Kalender.
     CSS Klasse: publicevent
     
  2. Weitere Attribute (CSS Code)
     Hier sind weitere CSS Codes zur Klasse publicevent möglich.
     CSS Klasse: publicevent
     
  
  
  
  
  
• Formatierung für private Termine
  Beschreibung: Die Eigenschaften dieser Gruppe wirken sich auf die Formatierung von privaten Terminen im Kalender aus.
  Zugehörige CSS Klasse(n): privateevent
  Elemente:
  
  1. Schriftfarbe (privateeventfontcolor)
     Bestimmt die Schriftfarbe von öffentlichen Terminen im Kalender.
     CSS Klasse: privateevent
     
  2. Weitere Attribute (CSS Code)
     Hier sind weitere CSS Codes zur Klasse privateevent möglich.
     CSS Klasse: privateevent
     
  
  
  
  
  
• Formatierung für Drop-Down Boxen
  Beschreibung: Die Eigenschaften dieser Gruppe wirken sich Auswahllisten im Forum aus.
  Zugehörige CSS Klasse(n): <select> Tag
  Elemente:
  
  1. Hintergrundfarbe (selectbgcolor)
     Bestimmt die Hintergrundfarbe von Auswahllisten im Forum.
     CSS Klasse: <select> Tag
     
  2. Schriftfarbe (selectfontcolor)
     Bestimmt die Schriftfarbe von Einträgen in Auswahllisten.
     CSS Klasse: <select> Tag
     
  3. Schriftgröße (selectfontsize)
     Bestimmt die Schriftgröße von Eiträgen in Auswahllisten.
     Einheit: Pixel (px)
     CSS Klasse: <select> Tag
     
  4. Schriftart (selectfontface)
     Bestimmt die Schriftart von Einträgen in Auswahllisten.
     CSS Klasse: <select> Tag
     
  5. Weitere Attribute (CSS Code)
     Hier sind weitere CSS Codes für das <select> Tag möglich.
     
  
  
  
  
  
• Formatierung für Textareas
  Beschreibung: Die Eigenschaften dieser Gruppe wirken sich auf mehrzeilige Eingabefelder aus.
  Zugehörige CSS Klasse(n): <textarea> Tag
  Elemente:
  
  1. Hintergrundfarbe (textareabgcolor)
     Bestimmt die Hintergrundfarbe von mehrzeiligen Eingabefeldern.
     CSS Klasse: <textarea> Tag
     
  2. Schriftfarbe (textareafontcolor)
     Bestimmt die Schriftfarbe in mehrzeiligen Eingabefeldern.
     CSS Klasse: <textarea> Tag
     
  3. Schriftgröße (textareafontsize)
     Bestimmt die Schriftgröße in mehrzeiligen Eingabefeldern.
     Einheit: Pixel (px)
     CSS Klasse: <textarea> Tag
     
  4. Schriftart (textareafontface)
     Bestimmt die Schriftart in mehrzeiligen Eingabefeldern.
     CSS Klasse: <textarea> Tag
     
  5. Weitere Attribute (CSS Code)
     Hier sind weitere CSS Codes für das <textarea> Tag möglich.
     
  
  
  
  
  
• Formatierung für sonstige Eingabeelemente
  Beschreibung: Die Eigenschaften dieser Gruppe wirken sich auf sonstige Eingabeelemente (Textfelder, Checkboxen) aus.
  Zugehörige CSS Klasse(n): input
  Elemente:
  
  1. Hintergrundfarbe (inputbgcolor)
     Bestimmt die Hintergrundfarbe von Eingabeelementen.
     CSS Klasse: input
     
  2. Schriftfarbe (inputfontcolor)
     Bestimmt die Schriftfarbe von Eingabeelementen.
     CSS Klasse: input
     
  3. Schriftgröße (inputfontsize)
     Bestimmt die Schriftgröße von Eingabeelementen.
     Einheit: Pixel (px)
     CSS Klasse: input
     
  4. Schriftart (inputfontface)
     Bestimmt die Schriftart von Eingabeelementen.
     CSS Klasse: input
     
  5. Weitere Attribute (CSS Code)
     Hier sind weitere CSS Codes für die Klasse input möglich.
     CSS Klasse: input
     
  
  
  
  
  
• Bilder
  Beschreibungen: Einstellungen für den Bilderordner, das Logo und ein Hintergrundbild.
  Elemente:
  
  1. Ordner für Bilder (imagefolder)
     Bestimmt einen Ordner, relativ oder absolut, für die Bilder des Forums.
     CSS Klasse: keine
     
  2. URL zum Logo des Forums (logoimage)
     Bestimmt ein Logo, das im Kopfbereich des Forums angezeigt wird.
     CSS Klasse: keine
     
  3. Hintergrundbild für den Kopfbereich des Forums (logobackground)
     Bestimmt ein Hintergrundbild für den Kopfbereich des Forums (also ein Hintergrundbild für das Logo).
     CSS Klasse: keine
     
  
  
  
  
  
• Allgemeine Links
  Beschreibung: Bestimmt das Aussehen von allgemeinen Links im Forum
  Zugehörige CSS Klasse(n): <a> Tag
  Elemente:
  
  1. Linkfarbe (pagelinkcolor)
     Bestimmt die Farbe eines allgemeinen Links.
     CSS Klasse: <a> Tag
     
  2. Textdekorierung (pagelinkdeco)
     Bestimmt die Textverzierung eines allgemeinen Links (z. B. unterstrichen oder nicht).
     CSS Klasse: <a> Tag
     
  3. Weitere Attribute (CSS Code)
     Hier sind weitere CSS Codes für das <a> Tag möglich.
     
  
  
  
  
  
• Allgemeine Links (mouseover)
  Beschreibung: Bestimmt das Aussehen von allgemeinen Links beim Darüberfahren mit der Maus.
  Zugehörige CSS Klasse(n): <a> Tag
  Elemente:
  
  1. Linkfarbe (pagelinkhovercolor)
     Bestimmt die Farbe eines allgemeinen Links beim Darüberfahren mit der Maus.
     CSS Klasse: <a> Tag
     
  2. Textdekorierung (pagelinkhoverdeco)
     Bestimmt die Textverzierung eines allgemeinen Links beim Darüberfahren mit der Maus (z. B. unterstrichen oder nicht).
     CSS Klasse: <a> Tag
     
  3. Weitere Attribute (CSS Code)
     Hier sind weitere CSS Codes für das <a> Tag möglich.
     
  
  
  
  
  
• Links im Tabellenkopf
  Beschreibung: Bestimmt das Aussehen von Links im Tabellenkopf.
  Zugehörige CSS Klasse(n): tabletitle
  Elemente:
  
  1. Linkfarbe (tabletitlelinkcolor)
     Bestimmt die Farbe eines Links im Tabellenkopf.
     CSS Klasse: tabletitle
     
  2. Textdekorierung (tabletitlelinkdeco)
     Bestimmt die Textverzierung eines Links im Tabellenkopf (z. B. unterstrichen oder nicht).
     CSS Klasse: tabletitle
     
  3. Weitere Attribute (CSS Code)
     Hier sind weitere CSS Codes für die Klasse tabletitle möglich.
     CSS Klasse: tabletitle
     
  
  
  
  
  
• Links im Tabellenkopf (mouseover)
  Beschreibung: Bestimmt das Aussehen von Links im Tabellenkopf beim Darüberfahren mit der Maus.
  Zugehörige CSS Klasse(n): tabletitle
  Elemente:
  
  1. Linkfarbe (tabletitlelinkhovercolor)
     Bestimmt die Farbe eines Links im Tabellenkopf beim Darüberfahren mit der Maus.
     CSS Klasse: tabletitle
     
  2. Textdekorierung (tabletitlelinkhoverdeco)
     Bestimmt die Textverzierung eines Links im Tabellenkopf beim Darüberfahren mit der Maus (z. B. unterstrichen oder nicht).
     CSS Klasse: tabletitle
     
  3. Weitere Attribute (CSS Code)
     Hier sind weitere CSS Codes für die Klasse tabletitle möglich.
     CSS Klasse: tabletitle
     
  
  
  
  
  
• Links in Tabellenkategorienzeile
  Beschreibung: Bestimmt das Aussehen von Links in der Tabellenkategorienzeile.
  Zugehörige CSS Klasse(n): tablecat
  Elemente:
  
  1. Linkfarbe (tablecatlinkcolor)
     Bestimmt die Farbe eines Links in der Tabellenkategorienzeile.
     CSS Klasse: tablecat
     
  2. Textdekorierung (tablecatlinkdeco)
     Bestimmt die Textverzierung eines Links in der Tabellenkategorienzeile (z. B. unterstrichen oder nicht).
     CSS Klasse: tablecat
     
  3. Weitere Attribute (CSS Code)
     Hier sind weitere CSS Codes für die Klasse tablecat möglich.
     CSS Klasse: tablecat
     
  
  
  
  
  
• Links in Tabellenkategorienzeile (mouseover)
  Beschreibung: Bestimmt das Aussehen von Links in der Tabellenkategorienzeile beim Darüberfahren mit der Maus.
  Zugehörige CSS Klasse(n): tablecat
  Elemente:
  
  1. Linkfarbe (tablecatlinkhovercolor)
     Bestimmt die Farbe eines Links in der Tabellenkategorienzeile beim Darüberfahren mit der Maus.
     CSS Klasse: tablecat
     
  2. Textdekorierung (tablecatlinkhoverdeco)
     Bestimmt die Textverzierung eines Links in der Tabellenkategorienzeile beim Darüberfahren mit der Maus (z. B. unterstrichen oder nicht).
     CSS Klasse: tablecat
     
  3. Weitere Attribute (CSS Code)
     Hier sind weitere CSS Codes für die Klasse tablecat möglich.
     CSS Klasse: tablecat
     
  
  
  
  
  
• Links in Tabellenzeile A
  Beschreibung: Bestimmt das Aussehen von Links in der Tabellenzeile A.
  Zugehörige CSS Klasse(n): tablea
  Elemente:
  
  1. Linkfarbe (tablealinkcolor)
     Bestimmt die Farbe eines Links in der Tabellenzeile A.
     CSS Klasse: tablea
     
  2. Textdekorierung (tablealinkdeco)
     Bestimmt die Textverzierung eines Links in der Tabellenzeile A (z. B. unterstrichen oder nicht).
     CSS Klasse: tablea
     
  3. Weitere Attribute (CSS Code)
     Hier sind weitere CSS Codes für die Klasse tablea möglich.
     CSS Klasse: tablea
     
  
  
  
  
  
• Links in Tabellenzeile A (mouseover)
  Beschreibung: Bestimmt das Aussehen von Links in der Tabellenzeile A beim Darüberfahren mit der Maus.
  Zugehörige CSS Klasse(n): tablea
  Elemente:
  
  1. Linkfarbe (tablealinkhovercolor)
     Bestimmt die Farbe eines Links in der Tabellenzeile A beim Darüberfahren mit der Maus.
     CSS Klasse: tablea
     
  2. Textdekorierung (tablealinkhoverdeco)
     Bestimmt die Textverzierung eines Links in der Tabellenzeile A beim Darüberfahren mit der Maus (z. B. unterstrichen oder nicht).
     CSS Klasse: tablea
     
  3. Weitere Attribute (CSS Code)
     Hier sind weitere CSS Codes für die Klasse tablea möglich.
     CSS Klasse: tablea
     
  
  
  
  
  
• Links in Tabellenzeile B
  Beschreibung: Bestimmt das Aussehen von Links in der Tabellenzeile B.
  Zugehörige CSS Klasse(n): tableb
  Elemente:
  
  1. Linkfarbe (tableblinkcolor)
     Bestimmt die Farbe eines Links in der Tabellenzeile B.
     CSS Klasse: tableb
     
  2. Textdekorierung (tableblinkdeco)
     Bestimmt die Textverzierung eines Links in der Tabellenzeile B (z. B. unterstrichen oder nicht).
     CSS Klasse: tableb
     
  3. Weitere Attribute (CSS Code)
     Hier sind weitere CSS Codes für die Klasse tableb möglich.
     CSS Klasse: tableb
     
  
  
  
  
  
• Links in Tabellenzeile B (mouseover)
  Beschreibung: Bestimmt das Aussehen von Links in der Tabellenzeile B beim Darüberfahren mit der Maus.
  Zugehörige CSS Klasse(n): tableb
  Elemente:
  
  1. Linkfarbe (tableblinkhovercolor)
     Bestimmt die Farbe eines Links in der Tabellenzeile B beim Darüberfahren mit der Maus.
     CSS Klasse: tableb
     
  2. Textdekorierung (tableblinkhoverdeco)
     Bestimmt die Textverzierung eines Links in der Tabellenzeile B beim Darüberfahren mit der Maus (z. B. unterstrichen oder nicht).
     CSS Klasse: tableb
     
  3. Weitere Attribute (CSS Code)
     Hier sind weitere CSS Codes für die Klasse tableb möglich.
     CSS Klasse: tableb
     
  
  
  
  
  
• Farben für "Thema bewerten" Farbverlauf
  Beschreibung: Bestimmt die Farben des Farbverlaufs für die Funktion "Thema bewerten".
  Elemente:
  
  1. Linke Farbe (gradientleft)
     Die linke Farbe des Farbverlaufs
     CSS Klasse: keine
     
  2. Zentrale Farbe (gradientmiddle)
     Die zentrale Farbe des Farbverlaufs
     CSS Klasse: keine
     
  3. Rechte Farbe (gradientright)
     Die rechte Farbe des Farbverlaufs
     CSS Klasse: keine
     
  
  
  
  
  
• Weitere Cascading Stylesheets (CSS)
  Beschreibung: Hier kann beliebiger CSS Code eingegeben werden.
  Elemente:
  
  1. Zusätzlicher CSS Code (cssmore)
     
  
  

5.2.5. Was ist was?

Legende:
A. Hintergrund
B. Äußere Tabelle
C. Innere Tabelle
D. Tabellenkopf
E. Tabellenkategorienzeile
F. Tabellenzeile A
G. Tabellenzeile B
H. Tabelle in innerer Tabelle
I. Eigenschaften von normaler Schrift
J. Eigenschaften von kleiner Schrift
K. Highlighting
L. Formatierung von Präfixen
M. Zeitformatierung
N. Formatierung für öffentlichen Terminen
O. Formatierung für private Termine
P. Formatierung für Drop-Down Boxen
Q. Formatierung für Textareas
R. Formatierung für sonstige Eingabeelemente
S. Allgemeine Links
T. Links im Tabellenkopf
U. Links in Tabellenkategorienzeile
V. Links in Tabellenzeile A
W. Links in Tabellenzeile B
X. Farben für "Thema bewerten" Farbverlauf

Startseite:
Um das Bild sehen zu können, klicken Sie bitte hier.

Themenauflistung:
Um das Bild sehen zu können, klicken Sie bitte hier.

Themenanzeige:
Um das Bild sehen zu können, klicken Sie bitte hier.

5.3. Styles

5.3.1. Was sind Styles?

Ein Style bestimmt das Layout und das Design des Forums. Ein Style stellt immer eine Kombination aus einem Templatepack und einem Designpack dar. Die eigentliche Bearbeitung von Layout und Design findet im Templatepack bzw. im Designpack statt.

Grundsätzlich muß immer ein Style als "Standart" definiert sein, dieses Style wird das Forum in der Standarteinstellung benutzen. Es können weitere Styles angelegt werden, um registrierten Benutzern zu ermöglichen aus mehreren Styles in ihrem Profil auszuwählen oder um sie einem bestimmten Unter-Forum zuzuordnen.

5.3.2. Import/Export von Styles

Für den schnellen Austausch von Styles gibt es eine Import/Export Funktion.

Beim Export wird eine Datei generiert, die alle Daten des Styles enthält. Darunter sowohl Farbwerte und Schriftarten, als auch alle Templates, die zum Styles gehören. Dabei wird das zugeordnete Designpack und das Templatepack benutzt. Optional lassen sich auch die verwendeten Grafiken im Style exportieren.

Die erstellte Datei kann zu einem späteren Zeitpunkt mit der Importfunktion wieder ins Forum importiert werden, oder auch an ein ganz anderes Forum weitergegeben werden.

5.4. BBcodes

5.4.1. Wie funktionieren BBCodes?

BBCodes werden wie HTML Codes verwendet. Sie stellen sicher, dass im Forum nur die Funktionen verwendet werden, die der Administrator durch die BBcodes auch erlaubt hat. Von der technischen Seite her gesehen sind die BBCodes eine reine Ersetzungsfunktion. Ein bestimmter Code im Beitragstext wird in einen vorgegebenen HTML Code umgewandelt. Da das Burning Board eigene BBCodes erlaubt, hat ein Administrator sehr viele Möglichkeiten, das Forum nach seinen Wünschen und den Bedürfnissen seiner Benutzer anzupassen.

5.4.2. Erstellen von eigenen BBCodes

Es gibt 3 verschiedene Typen von BBCodes, die sich nur in der Anzahl der Parameter unterscheiden. Der Aufbau ist immer identisch und nur vom Namen des BBCodes (dem sog. "BBCode tag") abhängig: [BBCode tag][/BBCode tag]

Die Typen unterscheiden sich zudem wiefolgt.
1 Parameter: [BBCode tag]Parameter1[/BBCode tag]
2 Parameter: [BBCode tag=Parameter1]Parameter2[/BBCode tag]
3 Parameter: [BBCode tag=Parameter1,Parameter2]Parameter3[/BBCode tag]

Im Feld für den HTML Code, durch den der BBCode ersetzt werden soll, müssen die 1, 2 oder 3 Parameter angegeben werden.

5.5. Language Pack

5.5.1. What are Language Packs?

Language Packs hold all of the language specific data in templates. The template links to a specific Language Variable, which results in the text being inserted into the templates. This system allows the templates to be modified independant of their language, and further allows mulitple languages supported on the same forum with ease. Finally, language packs make translation easy. All you have to do is use the Translate feature, and you can create a new language pack in your language, which is not specific to your forum.

5.5.2. Editing/Translating Language Packs

Text in the language packs can be translated under "Language Pack" => "Translate"
New language variables can easily be added to acomidate modifications. Simple go to "Language Pack" => "Add Language Variable" and fill out the form as indicated. You can also search for specific language variables and edit/replace them by using the "Search & replace Language Variables" option.

When adding or editing language variables, remember to do so in all installed languages. Otherwise, the features you added via language variables will not be available in the other languages.

5.5.3. Eigene Bezeichnungen für jede Sprache

Es ist möglich, für alle Bezeichnungen und Beschreibungen (z.B. Forentitel oder Rangnamen) in der jeweiligen Sprache anzugeben. Benutzer des deutschen Sprachpaketes würden beispielsweise nur die deutschen Forenbeschreibungen lesen, während englischsprachige Besucher die englischen Forenbeschreibungen lesen könnten. Möglich ist dies, indem der Administrator anstatt der Bezeichnung den Namen einer Sprachvariable in der Sprachkategorie "OWN" angibt. Dabei ist das voranstehende "LANG_OWN_" wegzulassen.

Beispiel 1: Sie möchten den Titel des Forums mehrsprachig definieren. Legen Sie dazu bitte in der Sprachkategorie "own" eine Sprachvariable namens "LANG_OWN_BOARDNAME" an. Nun stellen Sie unter "Einstellungen - Globale Optionen" als Forentitel "BOARDNAME" (das "LANG_OWN_" wird weggelassen) ein. Im Forum erscheint als Forentitel nun der Wert der Sprachvariable "LANG_OWN_BOARDNAME".

Beispiel 2: Sie möchten gerne ein Profilfeld mehrsprachig machen. Dazu legen Sie in der Sprachkategorie "own" eine Sprachvariable namens "LANG_OWN_MEINPROFILFELD" und eine namens "LANG_OWN_MEINPROFILFELD_BESCHREIBUNG" an. In der ersten schreiben Sie den Titel des Profilfeldes rein, in der zweiten eine Beschreibung für das Profilfeld. Unter "Profilfeld erstellen" geben Sie nun unter "Profilfeldtitel" einfach "MEINPROFILFELD" und unter "Beschreibung" einfach "MEINPROFILFELD_BESCHREIBUNG" ein (das "LANG_OWN_" wird weggelassen). Das Profilfeld und die Beschreibung des Profilfeldes benutzt nun den Wert "MEINPROFILFELD" und "MEINPROFILFELD_BESCHREIBUNG".

Unterstützt werden sprachpaketabhängige Bezeichnungen und Beschreibungen in folgenden Bereichen:

• globaler Forentitel
• Forentitel und -beschreibungen
• Gruppennamen
• Stylenamen
• Sprachpaketnamen
• Benutzerränge
• Smilietitel
• Icontitel
• BBCodes (Beispiel für die Hilfe und Beschreibung)
• Profilfelder (Titel und Beschreibung)

5.5.4. Eigene Grafiken für jede Sprache

Damit man bei jeder Sprache andere Buttons anzeigen kann, hat der Administrator die Möglichkeit, einen Präfix für den Bilderordner zu definieren. Dieser Präfix wird dem Bilderordner vorrangestellt. Definiert man also den Präfix "de_" für das deutsche Sprachpaket, so wird aus dem Bilderordner (der normalerweise "images" lautet) der Bilderordner "de_images".

Man kann diesen Präfix einstellen, indem man die Sprachvariable "LANG_GLOBAL_IMAGEFOLDER_PREFIX" bearbeitet. Das kann man tun, indem man im ACP auf "Sprachpakete bearbeiten" und anschließend auf "übersetzen" klickt. Nun muss man die Sprachkategorie "global" wählen und im Eingabefeld für die Variable "LANG_GLOBAL_IMAGEFOLDER_PREFIX" den gewünschten Präfix für den Bilderordner eingeben.

5.5.5. Exportformat für Sprachvariablen

Neue Sprachvariablen können im ACP unter dem Menüpunkt "Sprachvariable erstellen" erstellt werden. Will man neue Sprachvariablen in einem Hack benutzen, kann man das Sprachpaket exportieren und alle Sprachvariablen bis auf die neue aus der exportierten Datei löschen. Will man die neue Sprachvariable installieren, braucht man nur noch die exportierte Datei in sein vorhandenes Sprachpaket importieren.

Eine Sprachdatei mit neuen Sprachvariablen lässt sich auch einfach selbst erstellen.

Eine gültige Sprachdatei muss folgendes Format haben:
# Languagepack-Export: Sprachenname
# Languagecode: Sprachcode
# Date: DD.MM.YYYY HH:MM
# wBB Version: wBB-Version

[Sprachkategorie]

<text:NAME_DER_SPRACHVARIABLE>Inhalt der Sprachvariable</NAME_DER_SPRACHVARIABLE:text>
<text:NAME_DER_SPRACHVARIABLE2>Inhalt der Sprachvariable2</NAME_DER_SPRACHVARIABLE2:text>

[Sprachkategorie2]

<text:NAME_DER_SPRACHVARIABLE3>Inhalt der Sprachvariable3</NAME_DER_SPRACHVARIABLE3:text>