Logo im Header ändern

[bobber]

Hallo, ich würde gerne den Header ändern, habe da auch schon das ein oder andere versucht nur komme ich nicht so richtig mit zurecht.
Ich würde es gerne so gestalten das links ein Logo angezeigt wird, in der Mitte dann eine weitere Grafik das Suche Feld aber verschwindet.
Die Suche habe ich in der Navbar unter bekommen.

Der Rahmen soll bestehen bleiben, links und mittig sollen aber Grafiken entstehen.
Da die Grafiken auch minimal größer sind brächte ich auch einen Tipp wo/wie ich die Größe einstellen kann.
Danke für jeden Tipp
LG bobber

[Max_0105]

Hallo,

in der layout.css > header div.logoPosition (Zeile 72 bei mir, hier die Höhe und Breite) und unter header (Zeile 60 bei mir, hier die Höhe).

Und dann den Firebug benutzen.

Gruß Max

[bobber]

Erst ein mal ein danke für deine Antwort, nur leider haut irgend etwas bei mir nicht hin.
Ich ändere dort aber es wird mit im Browser keine Änderung angezeigt.
Ich nutze den Opera Browser der hat eine ähnliche Funktion wie Firebug, wenn ich dort Änderungen vornehme klappt das auch aber nicht wenn ich sie im lyout.css tätige.
Irgend wie alles sehr verwirrend.

[bobber]

Ach ja ich vergaß, ändern tut sich bei mir immer nur der Rahmen nicht aber das Logo an sich.
Der Rahmen soll ja so bleiben nur die Grafiken welcher größer sind sollen eingefügt werden und das Suchen soll weg.

[Randshoprookie]

Hallöchen,

also verstehe ich das richtig, dass Du den Rahmen ändern kannst?

Die Höhe der Logobox kannst Du hier ändern: layout.css ab Zeile 26

header div.logoPosition, div.suchBox, div.warenkorbBox {
border-left-style: none;
border-width: 1px 1px 1px 0;
height: 155px;
left: -30px;
overflow: hidden;
padding-top: 10px;
position: absolute;
text-align: center;
top: 15px;
width: 600px;
z-index: 1;

Wenn Du das Logo größer haben möchtest, musst Du ein größeres hochladen in den Shopeinstellungen.
Das ändert sich nicht automatisch, wenn Du die Größe im Layout änderst. Also wenn Du ein 200px hohes und 500px breites Bild
als Logo haben möchtest, dann musst Du die Bildgröße auch so haben, und das passende Bild laden.

die mittlere Box ist die Suchbox, die Breite kannst Du hier ändern: layout.css Zeile 233

div.suchBox {
left: 300px;
overflow: visible;
width: 415px;
}

die Höhe wird durch header div.logoPosition, div.suchBox, div.warenkorbBox { mit fest gelegt.

Das Bild, was Du in der Suchbox mit hinterlegen möchtest, das müsstest Du dann vielleicht als Hintergrundbild dort mit hinterlegen, oder
Du machst das Logo so lang, dass es über beide Boxen geht. Aber Vorsicht, das Logo wird auch in Mail verwendet, das sollte dann auch noch
"gut aussehen"

LG Piet

[Randshoprookie]

Ach, und die Änderungen auch in der CSS ändern, dessen Design Du verwendest
Ist mir schon oft passiert, dass ich mich wunderte, dass sich nix ändert, und dann hatte ich
das falsche Template bearbeitet
LG Piet

[bobber]

Klasse vielen Dank für deine ausgiebige Hilfe.
Änderungen habe ich ja schon vorgenommen nur übernimmt er die irgend wie nicht oder ich sitze so lange schon am PC das ich Blind bin.
Ich habe folgendes gemacht ...
header div.logoPosition, div.suchBox, div.warenkorbBox {
position: absolute;
left: 0px;
top: 30px;
z-index: 1;
width: 370px;
height: 194px;
overflow: hidden;
padding-top: 10px;
border: 1px solid #e5e5e5;
border-left: 0px;
text-align: center;

Das Logo welches ich versuche mit den Einstellungen einzubinden ist wird aber so angezeigt ...


Das Logo welches ich aber habe hat die maße 510 X 194
und schaut so aus
http://img5.fotos-hochladen.net/uploads ... v3iu2s.gif

Wobei mir die Qualität der Grafik überhaupt nicht gefällt!!!
Wenn man die Grafik nur etwas größer einbinden könnte würden die Grafiken auch viel besser rüber kommen.
Deswegen meine Idee die Grafik in zwei teilen, das Logo links platzieren und das Bike in der Mitte.
Der Shopname ... na ja da lasse ich mir dann was einfallen um den zu platzieren.

[bobber]

Arrrgh hier kann man seine Beiträge ja nicht bearbeiten ...

Ok so löse ich hin und wieder ein problem wenn die Grafiken zu ungenau sind.
<img src="img/banner_163.png" width="702" height="126" vspace="12" alt="#" />

habe das so auch schon versucht
if(file_exists(DATEIPFAD . "images/dbimages/shop_logo.gif")) {
$logoImageSize = getimagesize(DATEIPFAD . "images/dbimages/shop_logo.gif");
$logoImage = "<img src=\"".IMAGEPFAD . "dbimages/shop_logo.gif\" alt=\"Logo\" />";
} else {
$logoImageSize = getimagesize(DATEIPFAD . "templates/" . $rowTemp->name . "/design/" . $rowTemp->design . "/images/shop_logo.gif");
$logoImage = "<img src=\"".URLPFAD . "templates/" . $rowTemp->name . "/design/" . $rowTemp->design . "/images/shop_logo.gif\" width="395" height="125" vspace="12"alt=\"Logo\" />";
}

if($_GET["kategorieid"]) {
$CanonicalFB = "<link rel=\"canonical\" href=\"" . URLPFAD . "themes/kategorie/index.php?kategorieid=" . $_GET["kategorieid"] . "\" />";
}
Erfolg auch hier ... keiner
Ich komme einfach nicht weiter alles andere passt nur da stelle ich mich wohl wie ein Förster in der Wüste an.

[bonsai]

Du kannst aber auch das Suchfeld etwas nach unten setzen, dass das Logo über beide Felder geht. Hab ich auch schon gemacht. Wenn Du bis Samstag warten kannst, schau ich mal und poste Dir das was Du ändern musst (es sei denn ein anderer hier wäre schneller).

[Randshoprookie]

Hallöchen,

also es sieht ja schon so aus, dass sich die Höhe der Box zumindest geändert hat,
die Breite hast Du ja so wie es ausschaut noch nicht geändert.

Versuche mal das Bild zu ändern, also Höhe etwas kleiner 10 px oder sowas, und dann
dem Bild einen ganz neuen Datei Namen verpassen und neu im Shop unter Shopeinstellungen
hoch laden. Vielleicht wird die vorhandene Datei nicht überschrieben
Dann musst du nur noch die Box vebreitern und wie Bonsai sagte das Suchfeld verschieben.

LG Piet

[bobber]

Ok soweit so gut, das neue Logo wird nun besser angezeigt aber immer noch nicht ganz, womit ich übrigens auch Leben kann, nur müsste dafür das Logo (Grafik) am unteren Bildrand bündig sein nicht am oberen.
Noch kleiner kann bzw. will ich die Grafik nicht machen, dann sieht sie einfach zu unsauber aus.
Die breite passt auch und wird in Mails auch Super dargestellt. Gefällt mir so!
Jetzt soll, muss nur noch das blöde Suchfeld da oben verschwinden, das gehört nicht in den Header, jedenfalls nicht für meinen Geschmack.
Also Suchfeld weg und Logo am unterem Bildrand bündig dann wäre es fast Perfekt, die Frage ist nur wie .... ?

[bobber]

So nach vielem hin und her und etlichen fehl versuchen habe ich es aber endlich geschafft.
Der Header ist angepasst und gefällt mir soweit auch sehr gut ... Geschmackssache halt, stehe auf Bleistiftzeichnungen.

Nur wie bekomme ich die olle Suchbox weg?
Die soll Komplett Verschwinden, nicht verschieben oder verkleinern sondern komplett weg, nur halt wie?

[Max_0105]

Hallo,

ich habe die Suchbox so weg bekommen.
In der ajaxsearch.css bei mir Zeile 13
.ajaxsearch_container {
left: 1px;
top: 800px;
position: absolute;
z-index: -101; < das ist wichtig den z-index hoch setzen, dann verschwindet die Suchbox
white-space: nowrap;
}

Gruß Max

[Randshoprookie]

Hallöchen,

entweder so wie Max, oder Du gibst der Box einfach "display: none"

LG Piet

[Max_0105]

Hallo,

die Lösung von Piet ist sogar die bessere Lösung, habe ich gleich so gemacht.

So sieht es dann aus:
.ajaxsearch_container {
display: none;
}

Gruß Max