Header bearbeiten im Blue Business

[Barbar1902]

Hallo zusammen

Ich erstelle die neune Webseite unseres Vereins.
Nun möchte ich noch ein paar kleine Design änderungen vornehmen.
Das wichtigste was ich momentan machen möchte ist der Header verändern und zwar möchte ich den blauen Balcken löschen und der Wolkenhintergrund.
Anstelle von diesem Header möchte ich ein eigenes Bild das die selbe Höhe wie der jetzige Header aber nur so Breit ist wie meine Seite wirklich ist.

Kann mir da jemand helfen?

Webseite: www.barbara-club.ch

Gruss Lukas

[ciaobello]

Header und Footer sind in den meisten fällen mit Modulen erstellt und eigenem html ... schau mal bei den Modulen rein.

[stefan-at-work]

Erstelle Dir ein Bild in der Größe 800 x 202px und lade es in die Dateiverwaltung hoch. Wie ciaobello bereits gesagt hat, dürfte dies ein HTML-Modul sein, das im Seitenlayout eingebunden ist. Dann innerhalb des Moduls den Pfad zum Bild anpassen.

Die blauen Streiefen links und rechts der Seite bekommst Du weg, indem Du die CSS-Definitionen für den body änderst. Hier einfach den background rausnehmen.

Mach Dich am besten mal mit dem Firebug oder dem Webdeveleoper für Chrome bzw. Firefox vertraut.

[Barbar1902]

OK, das mit dem Bild ist mir klar aber die seitlichen blauen streifen finde ich niergens.
Bin mit CSS und HTML nicht so vertraut.

Habe einmal von dem CSS des Blue Business ein Screenshot gemacht und als bild beigefügt.

Kannst du mir evtl. sagen wo ich dies einstellen muss?

[wulf]

/* Style sheet layout */
body{background:url("../../files/blue_business/bg.jpg") left top repeat-x;font-size:100%;color:#4C4A4A}
}

Hier werden die "blauen Streifen" definiert.

[Barbar1902]

OK, das mit dem Bild ist mir klar aber die seitlichen blauen streifen finde ich niergens.
Bin mit CSS und HTML nicht so vertraut.

Habe einmal von dem CSS des Blue Business ein Screenshot gemacht und als bild beigefügt.

Kannst du mir evtl. sagen wo ich dies einstellen muss?

Ok ich habe herausgefunden das der Blaue Hintergrund ein Bild war ''bg.jpg''
Nun ist es eigendlich nur noch ein ersetzten des Himmelbildes, was kein Problem darstellen sollte, nur die Breite des Bildes int kleiner als die Breite der Webseite.
Wo finde ich heraus wie breit die Webseite tarzächlich ist? isch schätze Sie muss ca. 950 haben oder so?

Und wenn ich dann ein neues Bild einfüge anstelle des Himmels, ist dies dann schön zentriert auch wenne s grösser ist als das alte?

Die dann stellt sich bei mir noch die frag, ob ich das einstellen kann das das Logo auf der obersten ebene ist also nicht das das Hintergrundbild das Logo überdeckt sondern umgekehrt?

[wulf]

Drück bei deinem Browser deiner Wahl einfach mal "F12", damit kommst du normalerweise zu den Entwicklertools und kannst dir den Aufbau deiner Seite ansehen und temporär im CSS herumexperimentieren. Alles andere weiß die Suchmaschine deines Vertrauens.

[Barbar1902]

OK ich konnte es im CSS zentrieren, obwohl ich das neue Headerbild etwas grösser noch machen musss.
Das einzige Problem das nun noch ist, ist das das Logo des Vereins unter dem Header ist, wie kann ich es machen das, dass logo über dem Header liegt?

Eine weiter frage ist wenn ich im CSS auf z.B. auf #header gehe, dann sehe ich die normalen einstellungen wo ich überall habe aber die CSS config sehe ich niergens.
Wenn ich Firebug starte sehe ich die CSS config aber wenn ich dort etwas drin ändere wie übernimmt es dies?

Gruss Lukas

[wulf]

Wenn dein Logo dein Headerbereich überlagern soll, könnte ein z-index helfen.

Wenn ich Firebug starte sehe ich die CSS config aber wenn ich dort etwas drin ändere wie übernimmt es dies?

Garnicht, die Änderungen erfolgen nur im BrowserCache.

[Barbar1902]

Wenn dein Logo dein Headerbereich überlagern soll, könnte ein z-index helfen.

Und wie mach ich ein sogenannter z-index? resp. was ist das und gib ich diesen im CSS in dem Bereich Header ein?

[wulf]

Wenn du den internen CSS-Editor nutzt, muss man den z-index im Bereich "Eigener Code" eintragen, zB:
z-index:5000;
Passender Selektor wäre in deinem Fall img.logo

[Barbar1902]

OK hat sich geregelt, habe es herausgefunden es war der z-index:30;

Besten Dank für eure Nerven ;-)

Gruss Lukas