Jump to content

Header ändern

steve2342
 Share

Recommended Posts

steve2342 Newbie

steve2342

Posted
Posted

Hallo!

Hätte da noch eine Frage.

Kann man dass komplette Header ändern?

Dass heißt ich möchte mein Head Logo über die Komplette Seite haben und Warenkorb,Suchleiste etc. im Hintergrund haben,Auch möchte ich dass Suchfeld im Head Menü haben,wo finde ich die Position dafür in der DB?

 

Es sollte dann ungefähr wie auf dieser Seite auschauen: http://www.def-shop.com/

Gibt es auch ein modul dass wenn ich auf ein Foto/Button mit der Maus fahre dass sich die farbe ändert,auch wie auf dieser seite z.B Markenauswahl?

 

 

Benutze dass Theme: Theme Butterfly - Jewelry, Fashion, Clothes

 

http://addons.prestashop.com/de/fashion/6668-butterfly-jewelry-fashion-clothes.html

 

 

Vielen Dank!

 

Hoffe ihr könnt mir helfen!

 

MfG

Link to comment
Share on other sites
guest* Newbie

guest*

Posted
Posted

Navigationsmodul mit Farben: http://addons.presta...nu-manager.html - nutze ich selbst in einigen meiner Projekte.

 

Header mit Logo Hintergrund:

 

1) ergänze deine css mit (/themes/css/global.css)

 

#header_logo {
position: absolute !important;
}

 

2 ) ändere deine header.tpl (/themes/deintheme/header.tpl) wie folgt im BLOCK Header, wobei "namelogo.xxx" ergänzt wird durch dein Logo. Hier kannst du auch ein gif oder png angeben, also mit transparentem Hintergrund.

Wenn du den Fix Preisanzeige inkl. Steuer, exkl. Versand mit fancybox verwendest, dann solltest du darauf achten, dass du die bereits für den Fix geänderte Datei anpasst, weil sonst die fancybox verloren geht.

Wie bei jeder Anpassung an tpl-Dateien zunächst unter "Erweiterte Einstellungen" -> Leistung -> Template Cache -> Force compile auf JA stellen und darunter, Cache auf NEIN. Nach der Anpassung Einstellung wieder rückgängig machen.

 

 

<!-- Header -->
  <div id="header" class="grid_9 alpha omega">
<a id="header_logo" href="{$base_dir}" title="{$shop_name|escape:'htmlall':'UTF-8'}">
	 <img class="logo" src="{$img_dir}/namelogo.xxx" alt="{$shop_name|escape:'htmlall':'UTF-8'}"/>
</a>
<div id="header_right" class="grid_6 omega">
	 {$HOOK_TOP}

 

Anpassungen gelten für PS 1.5.3.1. und PS 1.5.4., angenommen ist die Datei von Theme default. Wenn dein Theme hier andere Zeilen hat, dann bitte entsprechend die Zeile mit "class=logo" anpassen.

 

Edit: der o.g. Pfad ist für ein Bild in deinem Theme-Ordner, also das "namelogo.xxx" gehört unter /themes/deintheme/img/ hinein !

  • Like 1
Link to comment
Share on other sites
guest* Newbie

guest*

Posted
Posted

Du kennst dich mit CSS, HTML und PHP aus ? Wenn nicht, dann empfehle ich dir auf fertige Lösungen zurückzugreifen und nicht selbst Hand an den Dateien anzulegen.

 

Ergänzen = ans Ende stellen,

Wie = mit einem Editor wie Notepad oder anderer. Vom FTP die Datei lokal holen, abändern und wieder auf dem FTP an der gleichen Stelle laden. (ABER immer vorher eine Sicherungskopie am FTP hinterlegen, oder die Datei umbenennen, und dann die geänderte Datei mit dem richtigen Namen wieder raufladen).

  • Like 1
Link to comment
Share on other sites
guest* Newbie

guest*

Posted
Posted

Post wurde editiert:

 

Ergänzen = ans Ende stellen,

Wie = mit einem Editor wie Notepad oder anderer. Vom FTP die Datei lokal holen, abändern und wieder auf dem FTP an der gleichen Stelle laden. (ABER immer vorher eine Sicherungskopie am FTP hinterlegen, oder die Datei umbenennen, und dann die geänderte Datei mit dem richtigen Namen wieder raufladen).

  • Like 1
Link to comment
Share on other sites
steve2342 Newbie

steve2342

Posted
  • Author
Posted

Ok,dass heißt ich muss in "#header_logo" : dass rote löschen und mit

position: absolute !important; ersetzten? oder nur im header die position von relative auf absolute?

 

#header_logo {

float:left;

display:block;

margin-top: -16px;

}

 

 

/* ************************************************************************************************

HEADER

************************************************************************************************ */

#header {position:relative}

#header_logo {

float:left;

display:block;

margin-top: -16px;

}

 

#header_right {

position:relative;

float: right

}

Link to comment
Share on other sites
steve2342 Newbie

steve2342

Posted
  • Author
Posted

okay vielen Dank!

und meinen Header einfach mit deinem ersetzten?

 

Mein Header:

 

<!-- Header -->

<div id="header" class="grid_9 alpha omega">

<a id="header_logo" href="{$base_dir}" title="{$shop_name|escape:'htmlall':'UTF-8'}">

<img class="logo" src="{$logo_url}" alt="{$shop_name|escape:'htmlall':'UTF-8'}" {if $logo_image_width}width="{$logo_image_width}"{/if} {if $logo_image_height}height="{$logo_image_height}" {/if} />

</a>

<div id="header_right" class="">

{$HOOK_TOP}

Link to comment
Share on other sites
guest* Newbie

guest*

Posted
Posted

Was mir noch eingefallen ist bezüglich der Navigationsleiste. Natürlich kannst du diese auch einfärben beim Original Prestashop (topmenu), allerdings bist du da nicht flexibel, also nicht eine Farbe pro Tab, weil das Modul ein nur sehr spartanisches ist. Mehr Komfort nur durch Kauf-Module, das sollte aber doch auch klar sein warum, oder ?

Link to comment
Share on other sites
guest* Newbie

guest*

Posted
Posted

Header.tpl. Ersetzen nein. Suche die Zeile wie schon oben beschrieben: class=logo und du änderst diese Zeile so ab wie die des angegeben Codes. Achte darauf, dass das Bild auch dort ist, wie ich weiter oben angegeben habe, sonst musst du den Pfad entsprechend anpassen.

  • Like 1
Link to comment
Share on other sites
steve2342 Newbie

steve2342

Posted
  • Author
Posted

Okay Vielen Dank super Service!

 

Ja dass ist mir klar;)

 

Verwende nur Gekaufte Module,alles andere ist unprofessionell;)

 

Habe mir dass "Advanced Top Menu - The best menu manager " modul auch schon öfter angeschaut habe dann aber ein anderes gekauft,aber ich denke ich werde dieses jetzt verwenden,habe nämlich gesehen dass man da dass Suchfeld in die menü leiste integrieren kann?

 

Ohne dich zu stören;)

 

Gibt es jetzt ein modul wo sich die farbe des button ändert wenn man mit der Maus darauf fährt?

 

 

 

MfG

Link to comment
Share on other sites
guest* Newbie

guest*

Posted
Posted

Natürlich muss dein Logo so groß sein wie der Header ;) .

 

Mouseover-Effect gibst du ebenso in der css weiter (der Befehl heißt hover)... Geht sowohl im Standard TopMenu als auch bei dem "Adavanced Top Menue". Damit es klappt sollte aber dazu auch eine Klasse existieren.

 

Deine CSS:

 

/*normal */
.meindiv{ background-color:black; }

/* mouseover */
.meindiv:hover { background-color:white;}

 

zugehöriges TPL:

 

<div class="meindiv">inhalt</div>

 

 

Oder per JavaScript:

 

<div onMouseOver="this.bgColor='white';" onMouseOut="this.bgColor='black';">inhalt </div>

Link to comment
Share on other sites
guest* Newbie

guest*

Posted
Posted

Können, kann man alles, aber du musst das Top Menu umbauen, denn es gibt zur Zeit so ein Feature garnicht her. Beim Top Menu Standard von PS kannst du für mousover nur generell eine einzige Farbe übergeben. Also nicht pro Kategorie eine Farbe und eine Mausdrüber Farbe.

 

Um das so zu übergeben wie das advanced menue (also jede Kategorie eine eigene Farbe mit variablen Mausdrüber-Effekten) da gehört viel mehr dazu, als nur ein Befehl in einer css.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share
Go to topic listing
×
×
  • Create New...