[Tutorial] Chatbox-Farben ändern

[Alex]

Hallo

Durch die Umstellung auf das neue Chatbox-System gibt es nun die Möglichkeit, die Farben, die in der Chatbox für die Hintergründe und die Schrift verwendet werden, individuell selbst einzustellen.

Bei einigen Foren ist das unbedingt notwendig, da ansonsten die Einträge nicht oder kaum gelesen werden können oder die Farben nicht zum Rest des Forums passen.

Anleitung zum Ändern der Farben:

Zunächst folgenden Code kopieren und einsetzen unter

Adminbereich/Anzeige/Logos und Bilder/Farben

und dort auf der Karte "CSS Stylesheet" in das große Feld.

Sollte da schon etwas eingetragen sein dann bitte den Code unter das bereits geschriebene setzen. Beim Kopieren darauf achten, dass der Code auch wirklich komplett übertragen wird.

Danach "Annehmen" klicken.

phpBB3-Foren und PUN-Foren:

Code:

/*--- Ab hier können die Farben in der Chatbox verändert werden. Dazu das Wort "Farbcode" durch den gewünschten Wert ersetzen (Format #XXXXXX) */

/*Hintergrundfarbe der Chatbox*/
body.chatbox {
background-color: Farbcode;
}

/*Textfarbe im Titel der Chatbox*/
body.chatbox #chatbox_header .chatbox-title,
body.chatbox #chatbox_header .chatbox-title a.chat-title {
 color: Farbcode !important;
}

/*Hintergrundfarbe des Titels der Chatbox*/
body.chatbox #chatbox_header .chatbox-title,
body.chatbox #chatbox_header .chatbox-title a.chat-title {
background-color: Farbcode !important;
}

/*Textfarbe der Links im oberen Teil der Chatbox*/
.chatbox-options li,
.chatbox-options li a,
.chatbox-options li label {
color: Farbcode;
}

/*Textfarbe in der Onlineliste (die Userliste auf der linken Seite)*/
#chatbox_members ul li,
#chatbox_members ul li a {
color: Farbcode;
}

/*Textfarbe im Chat-Stream (Hauptfeld, in dem die Nachrichten angezeigt werden)*/
.chatbox_row_1,
.chatbox_row_2,
.chatbox_row_3,
.chatbox_row_1 a,
.chatbox_row_2 a,
.chatbox_row_3 a {
color: Farbcode;
}
/*---Hier endet der Bereich zum Einstellen der Farben in der Chatbox---*/

phpBB2-Foren:

Code:

/*--- Ab hier können die Farben in der Chatbox verändert werden. Dazu das Wort "Farbcode" durch den gewünschten Wert ersetzen (Format #XXXXXX)---*/
/*Hintergrundfarbe der Chatbox*/
body.chatbox {
background-color: Frabcode;
}
/*Textfarbe im Titel der Chatbox*/

#chatbox_header .catBottom .cattitle {
    color: Farbcode;
}

/*Textfarbe der Links im oberen Teil der Chatbox*/

#chatbox_header .chatbox-options .genmed,
#chatbox_header .chatbox-options,
#chatbox_header .chatbox-options a {
    color: Farbcode;
}

/*Textfarbe in der Onlineliste (Userliste auf der linken Seite)*/

#chatbox_members ul li,
#chatbox_members ul li a {
    color: Farbcode;
 }

/*Hintergrundfarbe im Chat-Stream (Hauptfeld, in dem die Nachrichten angezeigt werden)*/

.chatbox_row_1,
.chatbox_row_2,
.chatbox_row_3,
.chatbox_row_1 a,
.chatbox_row_2 a,
.chatbox_row_3 a  {
    background-color: Farbcode;
}

/*Textfarbe im Chat-Stream (Hauptfeld, in dem die Nachrichten angezeigt werden)*/

.chatbox_row_1,
.chatbox_row_2,
.chatbox_row_3,
.chatbox_row_1 a,
.chatbox_row_2 a,
.chatbox_row_3 a  {
    color: Farbcode;
}
/*---Hier endet der Bereich zum Einstellen der Farben in der Chatbox---*/

Alle Forum-Versionen (phpBB2, phpBB3 und PUN):

Falls im Chat ein Hintergrundbild angezeigt wird, das entfernt werden soll, zusätzlich diesen Code kopieren und unter das andere einfügen:

Code:

body.chatbox {
    background-image: none;
}

Ist das Erforderlich kopiert und in das genannte Feld eingesetzt können nun die gewünschten Farben ganz einfach eingestellt werden, in dem das Wort "Farbcode" durch den Code der gewünschten Farbe ersetzt wird.

Nach jeder erfolgten Änderung muss durch Klick auf "Annehmen" das Ganze bestätigt werden.

Verwendet werden müssen hier die für HTML und CSS üblichen Hexadezimalcodes für Farben.

Die in eurem Forum verwendeten Farben und deren Codes findet ihm im Bereich

Adminbereich/Anzeige/Logos und Bilder/Farben

und dort auf der Karte "Farben".

Bitte darauf achten, dass der Code inklusive dem # eingetragen wird, da es ansonsten nicht funktioniert.

Sollten bei der Einstellung der Farben Probleme auftreten, dann steht dieser Thread zur Verfügung, um diesbezügliche Fragen zu stellen

---

LG, Alex

[Daniela1407]

Ich werde das jetzt noch 2x lesen und morgen mal in Angriff nehmen .. und ggf mal um Hilfe schreien

[Carolyn]

Hab es einmal gelesen /copiert und verstanden

Aaaaaber, meine frage : "da steht was von hintergrundbild" kann man da was einfügen?"

[Alley-Rose]

Soweit, so gut...danke!
Ich hab aber leider noch eine Frage....was für einen Code muss man eintippen, wenn man die Hintergrundfarbe im Chat ändern möchte?

[Gast]

Steht ganz oben im Code drin:

Code:

/*--- Ab hier können die Farben in der Chatbox verändert werden. Dazu das Wort "Farbcode" durch den gewünschten Wert ersetzen (Format #XXXXXX) */

[Alley-Rose]

Ne, ich mein nich die Schriftfarbe.....die hab ich....das Oben hab ich alles gemacht....ich möchte die Farbe des Hintergrundes ändern....

[Alex]

Hallo

Ich habe die Codes oben ergänzt.

@ Alley-Rose: Was du noch zusätzlich eintragen musst:

Code:

/*Hintergrundfarbe der Chatbox*/
body.chatbox {
background-color: Farbcode;
}

/*Hintergrundfarbe des Chat-Stream*/
.chatbox_row_1,
.chatbox_row_2,
.chatbox_row_3,
.chatbox_row_1 a,
.chatbox_row_2 a,
.chatbox_row_3 a  {
    background-color: Farbcode;
}

Das kannst du einfach unter das andere setzen

Diesen Teil, der bei dir noch drin steht:

Code:

body.chatbox

    {color: #5e5d5d;

}

kannst du löschen, denn der hat keinen Effekt.

---

LG, Alex

[Alley-Rose]

Vielen Lieben Dank!!! Ja, dass war mein versuch es selbst rauszufinden *g* Also bitte nich lachen ;-)

[Belle]

Mhhh ich habe eiegentlich das gemacht was man machen muss um die farben zu ändern

siehe

/*--- Ab hier können die Farben in der Chatbox verändert werden. Dazu das Wort "Farbcode" durch den gewünschten Wert ersetzen (Format #XXXXXX)---*/
/*Hintergrundfarbe der Chatbox*/
body.chatbox {
background-color: #fea012;
}
/*Textfarbe im Titel der Chatbox*/

#chatbox_header .catBottom .cattitle {
color: #080000;
}

/*Textfarbe der Links im oberen Teil der Chatbox*/

#chatbox_header .chatbox-options .genmed,
#chatbox_header .chatbox-options,
#chatbox_header .chatbox-options a {
color: #ffa34f;
}



aber bei mir sieht es noch genauso aus wie vorher, was mach ich falsch?

[Zuckerpuppe]

hast du, nachdem du das im CSS eingegeben hast, auch auf Annehmen geklickt?

Falls du das gemacht hast, dann hilft es vielleicht auch, den Cache zu leeren...
>Strg + F5 drücken<

die Einstellungen sind nämlich richtig und funktionieren auch...

[Belle]

muss ich einfach strg+F5 drücken oder wo leert man die cache
ich hab vorher eigentlich alle weg gemacht

[Alex]

Hallo

In deinem CSS ist nichts davon eingetragen.... ?!

Stimmt die URL hier in deinem Profil?

Hast du auch auf "Annehmen" geklickt? (Nicht "Absenden")

---

LG, Alex

[Feenlicht]

Hallo Ihr Lieben, ich weiss nun wieder nicht ob ich hier richtig bin, aber da es mit der Farbwahl im Chat zu tun hat denke ich mal doch.
Folgendes: Ich habe also ohne grosse Schwierigkeiten ( ja man lernt ) die Farben und den Farbhintergrund im Chat geändert. Und weil es mir so einen Spass gemacht hat, habe ich auch gleich noch mal das Forum farblich umgestaltet. Nun habe ich folgendes Problem. Manche User sehen nun im Chat Raum, und auch im Forum z. B. einen weissen Hintergrund und Farben die ich weder instaliert habe noch in irgendeiner weise da hingehoeren.. Ist nur bei einigen. andere sehen das Forum genau so wie ich es eingestellt habe. Nun fragen mich die User was sie machen koennen oder woran das Problem liegt?. Wisst ihr das? Eigentlich duerfte die Farbe weiss in meinem Forum in keiner Art und Weise zu sehen sein. Danke wenn ihr mir helfen koenntet. Eure CurlySue alias Feenlicht

[Elelalem Ashraf]

Habe auch einmal eine Frage zum Thema:

Kann man auch ein Hintergrundbild als Hintergrund, wo man das Geschriebene sieht, nehmen?

[Elelalem Ashraf]

kann man da überhaupt ein Bild einfügen als Hintergrund?
oder die Chatbox einfach Transparent zu machen, so dass man den Hintergrund des kompletten Forums sieht?

[Alex]

Hallo

Ich gucks mir mal bei dir an.....

Edit: Bitte mal meinen Account freischalten.

---

LG, Alex

[Elelalem Ashraf]

bist freigeschaltet brauchst du auch noch admin rechte?

[Alex]

Nö, brauch ich net, komm an alles ran, was ich brauch (CSS, HTML, ...)

---

LG, Alex

[Alex]

Also,

wenn du der ganzen Chatbox ein Hintergrundbild verpassen willst, dann kannst du in deinem CSS diesen Teil: (hast fast ganz unten stehen)

/*Hintergrundfarbe der Chatbox*/
body.chatbox {
background-color: #3d3d3d;
}

durch das hier ersetzen, wobei ich da mal das Hintergrundbild von deinem Forum genommen hab. Da kannst du natürlich auch jedes andere Bild einsetzen:

/*Hintergrundbild der Chatbox*/
body.chatbox {
background-image: url("https://i.servimg.com/u/f42/11/82/86/35/hinter12.jpg");
}

Bitte mal schaun, ob das so o.k. wäre oder ob man die Online-Liste links noch ändern soll.

---

LG, Alex

[Elelalem Ashraf]

also wenn es geht die online liste auch noch so zu machen, dass der hintergrund durchgehend ist sprich von links nach rechts weiterläuft wäre cool^^

ps.: vlt nur durch einen weißen streifen getrennt

edit.: hat sich erledigt nur anstatt einen schwarzen streifen möchte ich wohl einen weißen und wenn ich etwas schreibe, möchte ich auch wohl gerne den hintergrund weiterhin sehen und nicht diese etwas komisch farbe.

edit 2: Geht das, welches ich in dem edit vor diesem Post geschrieben habe überhaupt?

[Alex]

Wat?

Könntest du das bitte nochmal zusammenhängend und verständlich erklären, wie das aussehen soll?

---

LG, Alex

[Elelalem Ashraf]

In meiner Chatbox ist die online liste und das schreibfeld (/wo man die geschrieben Texte sehen kann) mit einem Schwarzen Balken bzw. Strich getrennt. Geht dieser auch weiß zu machen? das ist frage nummer 1!

Frage 2:
Wenn ich jetzt in der Chatbox etwas schreibe und dann Enter drücke erscheint das auf der rechten Seite. Dort ist der Hintergrund aber grün, was ich blöde finde, da ich diesen Hintergrund gerne Transparent hätte.

Jetzt meine Frage:

Geht das alles zu ändern und wenn ja wie?

[Elelalem Ashraf]

So jetzt darf ich hoffentlich Pushen...
Entschuldigung nochmals wegen dem Push zuvor...
Also jetzt nicht in Vergessenheit geraten.
Bitte um Beantwortung der Fragen!

[Alex]

Jo,

jetzt passt das.

Ich schaus mir jetzt an.

---

LG, Alex

[Alex]

Edit: Inhalte gelöscht

---

LG, Alex