bluewolf
MemberComments: 391
Received thanks: 56
Member since: February 2012
edited January 2016
Hallo,
im Store ist mein Plug-In "Erweitertes Grafik Menü" zu bekommen. Fragen und Anregungen bitte hier posten.
Das Plug-In ersetzt das "Erweiterte Menü" von Shopware und bietet die Möglichkeit, Grafiken in das Menü einzubauen und evt. die Texte auszublenden, wenn z.B. im Topmenü nur Hersteller-Logos angezeigt werden sollen.
Mit entsprechenden CSS-Anpassungen ist folgendes möglich:
Vorschau in meinem DEMOSHOP
im Store ist mein Plug-In "Erweitertes Grafik Menü" zu bekommen. Fragen und Anregungen bitte hier posten.
Das Plug-In ersetzt das "Erweiterte Menü" von Shopware und bietet die Möglichkeit, Grafiken in das Menü einzubauen und evt. die Texte auszublenden, wenn z.B. im Topmenü nur Hersteller-Logos angezeigt werden sollen.
Mit entsprechenden CSS-Anpassungen ist folgendes möglich:
Vorschau in meinem DEMOSHOP
Comments
hab das Plugin gekauft aber leider finde ich nirgends eine Anleitung in welcher Css Datei oder eine Codebeispiel man es eibindet. Wäre cool wenn Sie dabei behilflich wären.
LG Mürsel
die Anpassungen werden natürlich in der eigenen Template-CSS vorgenommen. Niemals nur die _default oder _emotion ändern, da dort nach einem Update die Änderungen evt. wieder überspielt werden.
Dann ruhig mal mit "Firebug" im Firefox oder dem Chrome-Browser mit SHIFT+STRG+C die Konsole öffen und die einzelnen Elemente untersuchen:
Für die einzelne Box im Dropdown z.B.:
#mainNavigation ul li.dropactive:hover ul.dropdown li a { height: xxx px; width: xxx px; float: inherit; background: #fff; display: block; padding-bottom: 10px; padding-top: 10px; margin-top: 10px; margin-left: 10px; text-align: center; }Damit der gesamte Dropdown in einer größen Box erscheint, die sich nach unten automatisch vergrößert:#mainNavigation li:hover ul.droplevel { margin-bottom: 10px; padding-bottom: 10px; width: 580px; margin-top: -1px; background-color: #FFF; }Das als Starthilfe. Es ist ja immer die Frage, wie man sein Menü haben möchte. Nicht alle wollen das gekachelte Dropdown, es kommt ja auch auf die Anzahl der Unterkategorien an.Wenn Probleme auftauchen, kann ich auch gerne die Templateanpassung vornehmen. In dem Fall bitte eine PM oder Mail schicken.
Danke und viele Grüße
die Darstellung mit Kacheloptik gehört nicht zu den Plugin-Einstellungen. Ist so auch nicht beschrieben. Ich werde diese Option aber wohl in einer kommenden Version einfließen lassen.
Wem mein Menüumbau gefällt, kann sich ja die CSS dazu anschauen, bzw. hier ist der Teil aus meiner Template CSS (Menühöhe nur noch 30px, nicht 38):
/* Anpassung Mainmenü */ /* MAIN-NAVIGATION ------------------------ */ #mainNavigation { margin: 0 auto; height: 30px; padding: 0; width: 1020px; line-height: 30px; border:0px;} #mainNavigation a {padding:0px 0px 0px 0px; height: 30px; cursor: pointer; border:0px;} #mainNavigation a span {background:transparent; display: block;margin: 0;padding: 0 15px 0px;height: 30px;line-height: 30px;} #mainNavigation a:hover {background: #fff; text-decoration: none; font-weight:bold; color: #666;} #mainNavigation a:hover span { color: #666; margin: 0px 0; height: 30px; line-height: 30px; font-weight: normal; background-color: #CCC; } #mainNavigation a.active {background:transparent; color: #fff; height: 30px; border:0px;} #mainNavigation a.active span { background-color: #FFF; color: #666; height: 30px; font-weight: normal; } #mainNavigation a.active:hover span {height: 30px; margin: 0; line-height: 30px;} #mainNavigation ul li.dropactive:hover a { color: #666; border: 0px; height:30px; } #mainNavigation ul li.dropactive:hover a span {height: 30px; color: #666; background:#fff; } #mainNavigation ul li.dropactive:hover ul.dropdown li a {height:145px; border:#ccc 1px solid; width:145px; float:inherit; background:#fff; display:block; padding-bottom: 10px; padding-top:10px; margin-top:10px; margin-left:10px; text-align:center; -moz-box-shadow: 2px 2px 5px #ccc; -webkit-box-shadow: 2px 2px 5px #ccc; box-shadow: 2px 2px 5px #ccc; } #mainNavigation ul li.dropactive a:hover span { height: 30px; border: 2px; background-color: #CCC;} #mainNavigation ul li.dropactive:hover ul.dropdown li.sub ul {margin: 0px; padding:0px;color: #fff;border:0px;float:none} #mainNavigation ul li.active.dropactive:hover a {color: #fff;} #mainNavigation li:hover ul.dropdown, #mainNavigation li:hover ul.droplevel {margin-bottom:10px; padding-bottom:10px; width:960px; -moz-box-shadow: -5px 5px 5px #ddd; -webkit-box-shadow: -5px 5px 5px #ddd; box-shadow: -5px 5px 5px #ddd; margin-top:-1px; background-color:#FFF;left:10px;} #mainNavigation li.active:hover ul.dropdown {margin-left: 0px;} media="all" #mainNavigation ul li.dropactive:hover a {border: 1px solid; height: 28px; position: relative; z-index: 3000;}Die Bilder im Dropdown sollten dann auf 125x125 skaliert werden.Danke trotzdem für die Hinweise und den CSS Code. Schade, dass es auch mit diesem CSS Code nicht richtig funktioniert bzw. die Darstellung nicht so aussieht wie im Demo: Die Top Navi "springt" bei Mouse Over und das Bild der Subkategorie ragt über einen schmalen grau umrandeten Balken nach unten über den gesamten Container hinaus. Den CSS Code habe ich in die Datei emotion.css im Ordner _emotion_local kopiert und den alten "#mainNavigation" CSS Code auskommentiert, alle Einstellungen im PlugIn wie beschrieben vorgenommen.
es sollte schon die richtige Vorgehensweise eingehalten werden.
Bitte immer ein eigenes Templateverzeichniss erstellen (kann ja eine Kopie von emotion_xxx sein) und dieses dann richtig abändern und anpassen. Hierzu bitte den "Beitrag Schnelleinstieg Template Tutorial 4.0.0" von Shopware beachten.
Da der letzte Code direkt aus meinem Template emotion_bluewolf kommt, und dort am Ende der CSS-Datei war, muss er eigentlich auch in anderen Templates funktionieren, wenn er an der richtigen Stelle eingefügt wird.
Da euer Shop noch über einen Passwortschutz gesperrt ist, kann ich zu eurem Templateaufbau nicht viel sagen. Wenn weiterhin Probleme bestehen, schickt mir doch eine PM mit den Daten für die Authentisierung auf der Domain.
Wenn ihr mit CSS & Templatebearbeitung nicht klar kommt, kann ich das auch übernehmen.
Danke und Gruß
Vielen Dank für die freundliche Unterstützung!! Falls wir weitere Anpassungen oder Support benötigen, komme ich gerne auf Sie zurück.
Zu einem Plugin, das nicht selbsterklärend ist, gehört eine vollständige "Readme-Datei". Mein Kunde hat dieses Plugin auch in der Annahme käuflich erworben, dass es "Out-of-the-box" funktioniert.
Es kann nicht sein, dass man erst im Forum recherchieren und um Support bitten muss, um überhaupt irgendetwas auf die Reihe zu bekommen. Sie ersparen doch auch sich eine Menge Supportarbeit, wenn Sie ein Plugin von vornherein ordentlich dokumentieren und es auch nicht so missverständlich mit toller, aber irreführender Demo präsentieren.
Das viel günstigere Plugin "Individuelles Footer-Menü" ist z.B. wesentlich besser dokumentiert, erklärt sich gewissermaßen aus den Backend-Einstellungen heraus von selbst.
Nun zu meiner Frage:
Ich habe als Basis für das neue Template emotion_blue verwendet. CSS-Anpassungen für die ID #mainNavigation sind auch erfolgt.
Was nicht klappt, ist die Anzeige der Kategoriebilder. Es wird lediglich der Kategoriename der Unterkategorie ausgegeben oder eben nicht - je nachdem, ob ich den Flag im Backend gesetzt habe oder nicht.
Wie aber gelingt es mir, die Bilder der Variable $sCategory.media.path im Dropdown anzuzeigen?
Mit freundlichen Grüßen
Kerstin Thieler
es tut mir leid, dass sie / Ihre Kundin mit dem Plugin Probleme haben. Eine ausführliche Anleitung wird im Moment noch erstellt.
Damit das Plugin auf die Variable $sCategory.media.path zugreifen kann, muss zwingend die Shopware 4.0.5 oder höher installiert sein. Im Store kann ich die Anzeige für das Plugin nicht umstellen. In den älteren Versionen wird die Variable nicht übergeben.
Wenn weitere Fragen auftauchen, können Sie sich gerne wieder melden.
Wo genau müssen die Bilder denn eingepflegt werden? Nach meinem Verständnis müsste es sich um das jeweilige Kategoriebild handeln, einzupflegen unter:
Artikel > Kategorien > Reiter Einstellungen > Bild
Korrekt?
Der Quellcode sieht so aus:
<li class="active dropactive">
<a class="active" title="Endgeräte" href="http://shop.mcfone.de/cat/index/sCategory/1302">
<ul class="dropdown droplevel0">
<li class="active">
<a class=" active" href="http://shop.mcfone.de/endgeraete/snom-300"> snom 300 </a>
</li>
In Ihrem Demo-Theme sieht es so aus:
<li class="active dropactive">
<a class="active" title="Wohnwelten" href="http://demoshop4.bluewolf-produktion.de/wohnwelten/">
<ul class="dropdown droplevel0">
<li class="">
<li class="active">
<a class=" active" href="http://demoshop4.bluewolf-produktion.de/wohnwelten/moebel/">
<img width="125" height="125" style="vertical-align:middle ; margin-right:3px;" sub="" src="http://demoshop4.bluewolf-produktion.de/media/image/moebel.jpg">
Möbel
</a>
</li>
Das Plugin ist aber definitiv aktiv und im Template wurden bezgl. der Topnavigation keinerlei Code-Änderungen vorgenommen. Advanced Menü von Shopware wurde zunächst deaktiviert und inzwischen sogar deinstalliert.
Sie sehen ja die Baustellenadresse im Quellcode. Vielleicht schauen Sie sich das noch einmal an.
für mich sieht es nicht so aus, dass mein Plugin dort läuft. Wenn Sie mir über eine PM einen Backendzugang geben, schau ich da mel rein.
Ist die Option Grafiken anzeigen wirklich aktiviert?
So ein Fehler / Problem ist bisher garantiert noch nicht aufgetreten.
danke für die Info und Hilfe. Aber warum steht dann in der Plugin-Beschreibung unter:
Kompatibel mit: ab 4.0.0 - 4.0.6
nicht drin, dass bei älteren Versionen als 4.0.6 das Kategoriebild shopwareseitig nicht angezeigt wird? Wenn ich im Forum suche, finde ich jetzt auch die entsprechenden Threads. Aber warum muss ich erst Zeit aufwenden und suchen? Sie haben dieses Knowhow, teilen es aber dem Käufer nicht mit.
Wie schon in meinem Eingangsthread gesagt:
Es fehlt eine Dokumentation zu Ihrem Plugin. Das ist ein großes Manko und hat mich und Sie am Wochenende richtig Zeit gekostet.
Immerhin verkaufen Sie Ihr Mini-Plugin für 39 EUR. Das ist nicht wenig. Dafür erwarte ich nicht nur einen zugegebenerweise guten Support, sondern eine vollständige Dokumentation, so wie es sich eben bei sauberer Software-Entwicklung gehört.
- Lässt sich das Menü automatisch an die Breite der Kacheln anpassen? Wenn die Kacheln 125x125px haben, passen 5 nebeneinander. Wenn man nur 3 Untermenüs einsetzt, sieht der weiße Bereich rechts davon nicht so schön aus.
- Die Kacheln sind nicht ganz mittig (bei 125x125px Größe), sondern leicht nach links versetzt. Wie lässt sich das ändern?
Danke und viele Grüße
Gabriel
das Plugin skaliert nicht automatisch. In der menustyle.css können aber die Werte für die Box (Zeile 16) angepasst werden. Das greift dann aber für alle Kacheln.
#mainNavigation ul li.dropactive:hover ul.dropdown li a {height:145px; border:#ccc 1px solid; width:145px; }Für individuelle Anpassungen den Code in die eigene Template-CSS übernehmen, um Updatesicher zu sein.Um die Grafiken mittiger zu haben, kann im Plugin bei "CSS Inline für Grafiken" noch ein "margin-left:12px;" angefügt werden. Wirkt sich aber auch auf die Grafiken in den Top-Kategorien aus.
bin noch Anfang mit Shopware und stehe momentan vor dem Problem das erweiterte Grafikmenü umzugestalten.
Das Plugin wurde ohne Probleme installiert, aktiviert und funktioniert.
Ich habe es nicht als gekachelte Bilder eingestellt sondern als Dropdown mit Text.
Wie und wo verändere ich nun z. B. den Hintergrund des Dropdown, etc.?
Über eine Nachricht freue ich mich.
Gruß
jox
wenn der Hintergrund des Dropdown als Text geändert werden soll, am besten das Element mit Firefox + Firebug, oder mit dem Chrome-Browser untersuchen (F12).
Die Farbe des Dropdown-Hintergrundes im eigenen Template dann ändern:
#mainNavigation ul li ul.dropdown li {background-color: #a0a0a0;}Um die Eingabe im Moment los werden zu können, muss das Plugin einmal neu installiert werden.
Eine andere Möglichkeit gibt es derzeit noch nicht.
ich habe das Menü Plugin gekauft, da in Ihrer Referenz ist auch Zoolandi angegeben ist.
Ich wollte das Menü so wie da aufbauen, jedoch ohne Grafiken.
Dort werden die 2. Subkategorien gleichzeitig mit der ersten Sub in einer Kachel angezeigt.
Ich finde dazu aber keine Einstellmöglichkeit.
Können Sie da weiterhelfen?
Gruß
Mathias
wie in dem Bild angegeben, ist die TOP-Navigation aus dem Plugin. Das Dropdown-Menü ist durch eine Programmierung geändert.
Dazu müsste das Template um die Ordner: plugins/wolfadvancedgraficmenu erweitert werden, und dort die Datei "wolfgraadmenu.tpl" kopiert und angepasst werden. Die Funktion am Anfang unter neuem Namen duplizieren und so ändern, dass für weitere Unterketegorien kein <ul>-Listing entsteht, <li> raus und alles in einen <p>-Block... CSS anpassen.
Das müsste also individuell angepasst werden.
Mit freundlichen Grüßen
M.Wolf
Ich hätte nur eine kurze Frage.
Bei uns im Top Menu habe ich einige Seiten extra ins Menu hinzugefuegt, die als Landingpages neben den normalen Kategorien funktionieren sollen. Also einfach weitere <li> Tags in die categories_top.tpl eingefuegt, die auf Shopseiten verweisen.
Ist es nun richtig, das ich diese Landingpages nicht an das Grafische Menu anbinden kann, bzw, gibt es da eventuell eine Möglichkeit durch eine Template-Anpassung?
Unter Artikel -> Kategorien eine neue Kategorie anlegen und den Bereich "Auf externe Seite verlinken" ausfüllen. Also z.B. dort "http://www.meinshop.de/landingpage" einfügen.
Nun erscheint der Navigationspunkt auch in der Topnavigation, egal welches Menü aktiviert ist.
Oder aber das Template um die Ordner: plugins/wolfadvancedgraficmenu erweitern, und dort die Datei "wolfgraadmenu.tpl" kopieren und angepassen. So ist aber ein Update des Menuplugins schwieriger, da diese Datei dann mit der neuen Version verglichen und evt. angepasst werden muss.
Ueber die Kategorie kann ich das nicht machen, da ich die neue Seite nur oben im Top menu haben möchte, und wir die linke Navigation auf der Startseite haben, und dort sollte die Seite nicht auftauchen.
Gibt es eventuell eine Anleitung was im Plugin template genau geändert werden sollte, bzw. wie komplex das ist? In der pdf-Anleitung habe ich hierzu nichts gefunden.
wie oben beschrieben, das Template un die Ordner erweitern und in der wolfgraadmenu.tpl die <li> Einträge manuell einfügen.
Für die Darstellung in der ersten Menüzeile im Template ab Zeile 91 (die Zeilennummern hier stimmen jetzt nicht!):
</li> {/if} {/if} {/foreach} {* hier weitere <li> einfügen *} </ul>Wenn die zweite Zeile verwendet werden soll, ab Zeile 118 (die Zeilennummern hier stimmen jetzt nicht!):</li> {/if} {/if} {/foreach} {* hier weitere <li> einfügen *} </ul>