Support Bereich Hier finden Sie Antworten auf alle Fragen zu Ihrem Xobor Forum.
Wählen Sie zunächst einen Hilfe-Bereich.

Mit einer sogenannten DIV-Box können wichtige Informationen in den Vordergrund rücken.

Dazu müsst Ihr nur ein Foren-Code erstellen, im Adminbereich unter „Layout“ > „Iconbar“ > „Neue Icons hinzufügen“ > „Foren-Code“.
Unter „Ersetze“ kannst du eine beliebige Variable angeben z.B. [Box1] … [/Box1], die angegebene Variable sollte dann mit einem HTML Div-Tag ersetzt werden. Im folgendem ein paar Beispielcodes, achte darauf das du „…“ berücksichtigst und das „</div>“ am Ende in das 2. Textfeld einfügt - sieht dann so aus:




Hier die Beispielcodes:

1. Basic

<div style='background: #d6d6d6; border: 1px solid #333333; padding: 20px;'>
...
</div>
 
 

Demo:

<div style='background: -moz-linear-gradient(top, #d6d6d6, #FFF); background: -webkit-linear-gradient(top, #d6d6d6, #fff); background: -ms-linear-gradient(top, #d6d6d6, #fff); background: -o-linear-gradient(top, #d6d6d6, #fff); box-shadow: 1px 2px 4px #222222; padding: 20px;'>
...
</div>
 
 

Demo:

<div style='background-color: #ffffdf; border: 1px solid #d8d48e; border-radius: 5px ; padding: 20px;'>
...
</div>
 

Demo:

<div style='background-color: #44ff44; border: 5px solid #00c800; border-radius: 10px ; box-shadow: 0px 0px 20px #44ff44; padding: 20px;'>
...
</div>
 
 

Demo:



Wie Ihr seht könnt Ihr mit ein bisschen CSS eure Info-Boxen beliebig anpassen.

Allerdings haben die CSS Angaben im Div-Tag einen großen Nachteil: Änderungen im Boxen-Layout werden bei bereits geposteten Boxen nicht automatisch übernommen. Ärgerlich wenn man das Layout der Boxen an das Forum-Design angepasst hat und man beschließt das Forum-Design zu ändern. Um das zu vermeiden könnt Ihr mit „class“ arbeiten, anhand eines Beispiels zeigen wir euch wie das funktioniert.

Statt CSS Angaben solltet Ihr im Forum-Code ein Class-Tag angeben, das könnte z.B. so aussehen:

<div class='box1'>
...
</div>
 

Im Adminbereich unter „Layout“ > „Farben & Einstellungen“ > „CSS“ könnt Ihr eure class gestalten, das Design für die Basic-Box würde z.B. so aussehen:

.box1 {
background: #d6d6d6;
border: 1px solid #333333;
padding: 20px;
}