Erweitertes Menü (Advanced Menu): Untermenüebene mit ID versehen?

Hallo,

ist es möglich, das DIV advanced-menu mit einer individuellen bzw. fortlaufenden ID je Menüeintrag zu versehen?

Der Gedanke dahinter ist folgender: Wir würden die Anzeige der Untermenüebenen gern - je Hauptmenüpunkt - unterschiedlich (per CSS) anpassen wollen. Das klappt aber nicht wenn man den jeweiligen Menüpunkt nicht referenzieren kann, bspw. durch eine ID.

Ich stelle mir das so vor, dass in jedem Menüpunkt-DIV dann etwas in dieser Art steht:

...
...
...
usw.

Damit könnte man via ID-Referenz einfach jedes Popup-Menü unterschiedlich gestalten. Das Plugin „Erweitertes Menü“ bringt ein solches Feature leider nicht mit. Hat vielleicht jemand einen Tipp für mich? Gibt es dafür ggf. schon eine Erweiterung oder ließe sich das relativ einfach selbst machen? Falls ja… bitte helft mir. :wink:

Als Idee von mir:

Attribute in der entsprechenden Kategorie anlegen z.B. “nav1” “nav2” “nav3” für die unterschiedlichen Kategorien.

Dann könntest doch per “if Abfrage” die entsprechenden CSS-Klassen in dem Advanced-Menü anlegen und auch nutzen.

Grob überlegt. :slight_smile:

 

Attribute gehen im Standard nicht, die stehen dort nicht zur Verfügung. Kann man über ein Plugin aber leicht hinzufügen. 

Wenn es nur eine fortlaufende Nummer sein soll, kann dies am einfachsten durch eine Variable gelöst werden, die man beim Iterieren über die Kategorien hoch zählt. Es gibt aber nur eine Klasse advanced-menu. Entweder man versieht die li-Tags der Hauptkategorien mit einer zusätzlichen Klasse/ID oder aber den Inhalt des Dropdowns. Je nachdem, was man machen will, muss man beide mit identischem Klassennamen versehen, um beide per CSS ansteuern zu können. Man kann aber nicht alle Layoutmodifikationen des Dropdowns so per CSS erzielen. In den Fällen kann man das Javascript Plugin erweitern und eine individuelle Klasse in Abhängigkiet der Hauptkategorie setzen.

@hth schrieb:

Wenn es nur eine fortlaufende Nummer sein soll, kann dies am einfachsten durch eine Variable gelöst werden, die man beim Iterieren über die Kategorien hoch zählt. Es gibt aber nur eine Klasse advanced-menu. Entweder man versieht die li-Tags der Hauptkategorien mit einer zusätzlichen Klasse/ID oder aber den Inhalt des Dropdowns. Je nachdem, was man machen will, muss man beide mit identischem Klassennamen versehen, um beide per CSS ansteuern zu können. Man kann aber nicht alle Layoutmodifikationen des Dropdowns so per CSS erzielen. In den Fällen kann man das Javascript Plugin erweitern und eine individuelle Klasse in Abhängigkiet der Hauptkategorie setzen.

Nur eine Nummer - Zahl - geht nicht, glaube ich (bin nicht 100% sicher). Soviel ich weiß muss man noch mind. einen Buchstaben voranstellen - in meinem Beispiel das „nav“. Aber das sollte letztlich unerheblich sein.

Dass es „advanced-menu“ als CSS-Klasse nur einmal gibt stimmt. Mein Fehler. Hab ich nicht genau hingesehen. Stattdessen müsste meine ID in dieses DIV:

Eins verstehe ich aber nicht. Warum glaubst du, dass man damit nicht alle Aspekte des Popups per CSS steuern kann? Welche Elemente sind denn in der Regel von Bedeutung? Ich denke da an Hintergrund, Schriften, Abstände, ggf. Bilder/Grafiken. All das ist per CSS änderbar - und zwar exakt für ein Popup (bzw. menu--container). Übersehe ich vielleicht etwas?

Da die Menüeinträge ja Kategorien (Listing, Link oder Blog) sind, könnte man auch die System-ID der jeweiligen Kategorie nehmen. Dann einfach im eigenem Theme das Advanced-Menü im passenden Block ergänzen. Ich mache das zwar nicht für die Untermenüs, aber genau so passe ich mir die “Tabs” an.

@TomBOX schrieb:

Hallo,

ist es möglich, das DIV advanced-menu mit einer individuellen bzw. fortlaufenden ID je Menüeintrag zu versehen?

Der Gedanke dahinter ist folgender: Wir würden die Anzeige der Untermenüebenen gern - je Hauptmenüpunkt - unterschiedlich (per CSS) anpassen wollen. Das klappt aber nicht wenn man den jeweiligen Menüpunkt nicht referenzieren kann, bspw. durch eine ID.

Ich stelle mir das so vor, dass in jedem Menüpunkt-DIV dann etwas in dieser Art steht:




usw.

Damit könnte man via ID-Referenz einfach jedes Popup-Menü unterschiedlich gestalten. Das Plugin „Erweitertes Menü“ bringt ein solches Feature leider nicht mit. Hat vielleicht jemand einen Tipp für mich? Gibt es dafür ggf. schon eine Erweiterung oder ließe sich das relativ einfach selbst machen? Falls ja… bitte helft mir. ;)

Hallo,

auf jeden Fall kannst du bei diesem Plugin: Erweitertes Menü - Einblenden der Inhalte von Unterkategorien beim Hover über Menüpunkte und mehr | Shopware Store jeden einzelnen Menü- und Untermenüpunkt des erweiterten Menüs per CSS ansteuern, da es jedem < a > - Tag eine individuelle CSS-Klasse hinzufügt. Es kommt also darauf an, was du genau vor hast - sicher könnte man auch den übergeordneten Elementen noch die entsprechenden individuellen Klassen geben.

Beste Grüße

Sebastian

@sschreier schrieb:

auf jeden Fall kannst du bei diesem Plugin: http://store.shopware.com/scha120488770119/erweitertes-menue-einblenden-der-inhalte-von-unterkategorien-beim-hover-ueber-menuepunkte-und-mehr.html jeden einzelnen Menü- und Untermenüpunkt des erweiterten Menüs per CSS ansteuern, da es jedem < a > - Tag eine individuelle CSS-Klasse hinzufügt. Es kommt also darauf an, was du genau vor hast - sicher könnte man auch den übergeordneten Elementen noch die entsprechenden individuellen Klassen geben.

Also ich habe mir dein Plugin mal angeschaut. Das kann ja eine ganze Menge - viel mehr als ich eigentlich brauche. :wink:

Jedoch nützt es mir - in der aktuellen Fassung - nur bedingt. Zwar könnte ich - mittels a-Tag-Referenz - die Unterkategorien individuell per CSS stylen. Allerdings muss ich auch die ULs, in denen sich die jeweiligen Unterkategorien (samt Unterunterkategorien) befinden, individuell (absolut) positionieren. Das geht, glaube ich, bisher nicht mit diesem Plugin. Die ULs sind nicht (je Popup/Hauptkategorie) einzeln erreichbar per CSS.

Wenn du eine von zwei Möglichkeiten umsetzen könntest, würde mir das Plugin nützen:

Idee 1: Der Popup-umschließende Container (ich glaube der heißt menu–container) erhält noch eine individuelle Klasse bzw. ID - je Hauptkategorie. Dann könnte ich mittels ul:nth-child(x) jede UL individuell per CSS ansprechen und stylen.

Idee 2: Jede Unterkategorie-UL erhält eine individuelle Klasse oder ID. Dann könnte man die jeweiligen Listen direkt ansprechen und stylen. Das wäre zweifelsfrei komfortabler.

Ist eine der beiden Ideen zeitnah möglich?

@TomBOX schrieb:

@sschreier schrieb:

auf jeden Fall kannst du bei diesem Plugin: http://store.shopware.com/scha120488770119/erweitertes-menue-einblenden-der-inhalte-von-unterkategorien-beim-hover-ueber-menuepunkte-und-mehr.html jeden einzelnen Menü- und Untermenüpunkt des erweiterten Menüs per CSS ansteuern, da es jedem < a > - Tag eine individuelle CSS-Klasse hinzufügt. Es kommt also darauf an, was du genau vor hast - sicher könnte man auch den übergeordneten Elementen noch die entsprechenden individuellen Klassen geben.

Also ich habe mir dein Plugin mal angeschaut. Das kann ja eine ganze Menge - viel mehr als ich eigentlich brauche. ;)

Jedoch nützt es mir - in der aktuellen Fassung - nur bedingt. Zwar könnte ich - mittels a-Tag-Referenz - die Unterkategorien individuell per CSS stylen. Allerdings muss ich auch die ULs, in denen sich die jeweiligen Unterkategorien (samt Unterunterkategorien) befinden, individuell (absolut) positionieren. Das geht, glaube ich, bisher nicht mit diesem Plugin. Die ULs sind nicht (je Popup/Hauptkategorie) einzeln erreichbar per CSS.

Wenn du eine von zwei Möglichkeiten umsetzen könntest, würde mir das Plugin nützen:

Idee 1: Der Popup-umschließende Container (ich glaube der heißt menu–container) erhält noch eine individuelle Klasse bzw. ID - je Hauptkategorie. Dann könnte ich mittels ul:nth-child(x) jede UL individuell per CSS ansprechen und stylen.

Idee 2: Jede Unterkategorie-UL erhält eine individuelle Klasse oder ID. Dann könnte man die jeweiligen Listen direkt ansprechen und stylen. Das wäre zweifelsfrei komfortabler.

Ist eine der beiden Ideen zeitnah möglich?

Hallo,

ich guck mir das bei Gelegenheit noch einmal an und melde mich dann dazu (aus meiner Sicht dürfte das integrierbar sein) - zurzeit steht aber (verständlicherweise) das Herstellen der Kompatibilität der Plugins zur Shopware Version 5.2.0 im Vordergrund (betrifft dieses auch).

Beste Grüße

Sebastian

@TomBOX schrieb:

@sschreier schrieb:

auf jeden Fall kannst du bei diesem Plugin: http://store.shopware.com/scha120488770119/erweitertes-menue-einblenden-der-inhalte-von-unterkategorien-beim-hover-ueber-menuepunkte-und-mehr.html jeden einzelnen Menü- und Untermenüpunkt des erweiterten Menüs per CSS ansteuern, da es jedem < a > - Tag eine individuelle CSS-Klasse hinzufügt. Es kommt also darauf an, was du genau vor hast - sicher könnte man auch den übergeordneten Elementen noch die entsprechenden individuellen Klassen geben.

Also ich habe mir dein Plugin mal angeschaut. Das kann ja eine ganze Menge - viel mehr als ich eigentlich brauche. ;)

Jedoch nützt es mir - in der aktuellen Fassung - nur bedingt. Zwar könnte ich - mittels a-Tag-Referenz - die Unterkategorien individuell per CSS stylen. Allerdings muss ich auch die ULs, in denen sich die jeweiligen Unterkategorien (samt Unterunterkategorien) befinden, individuell (absolut) positionieren. Das geht, glaube ich, bisher nicht mit diesem Plugin. Die ULs sind nicht (je Popup/Hauptkategorie) einzeln erreichbar per CSS.

Wenn du eine von zwei Möglichkeiten umsetzen könntest, würde mir das Plugin nützen:

Idee 1: Der Popup-umschließende Container (ich glaube der heißt menu–container) erhält noch eine individuelle Klasse bzw. ID - je Hauptkategorie. Dann könnte ich mittels ul:nth-child(x) jede UL individuell per CSS ansprechen und stylen.

Idee 2: Jede Unterkategorie-UL erhält eine individuelle Klasse oder ID. Dann könnte man die jeweiligen Listen direkt ansprechen und stylen. Das wäre zweifelsfrei komfortabler.

Ist eine der beiden Ideen zeitnah möglich?

Hallo,

in der Version 1.0.3 des oben erwähnten Plugins hast du nun sowohl Idee 1 als auch Idee 2 implementiert. Die Struktur für den Hauptmenüpunkt (Idee 1) wäre dabei: advanced-menu-main-category-id-{category-id}. Somit könntest du über:

.advanced-menu-main-category-id-{category-id} > .content--wrapper > ul

das direkt untergeordnete < ul >-Element einzeln und direkt ansprechen (Idee 2).

 

Ebenso könntest du nun auch über:

.advanced-menu-li-category-id-{category-id} > ul

ein < ul > einer tieferen Ebene einzeln und direkt ansprechen.

Die < li > - als auch die < a >-Elemente haben ja wie angesprochenen so und so eigene, individuelle Klassen. Somit dürftest du (im Rahmen des Plugins) nun ansich jeden Bereich individuell gestalten können.

Beste Grüße

Sebastian

Hallo Sebastian,

Hallo,

in der Version 1.0.3 des oben erwähnten Plugins hast du nun sowohl Idee 1 als auch Idee 2 implementiert. Die Struktur für den Hauptmenüpunkt (Idee 1) wäre dabei: advanced-menu-main-category-id-{category-id}. Somit könntest du über:

.advanced-menu-main-category-id-{category-id} > .content–wrapper > ul

das direkt untergeordnete < ul >-Element einzeln und direkt ansprechen (Idee 2).

 

Ebenso könntest du nun auch über:

.advanced-menu-li-category-id-{category-id} > ul

ein < ul > einer tieferen Ebene einzeln und direkt ansprechen.

Die < li > - als auch die < a >-Elemente haben ja wie angesprochenen so und so eigene, individuelle Klassen. Somit dürftest du (im Rahmen des Plugins) nun ansich jeden Bereich individuell gestalten können.

Beste Grüße

Sebastian

vielen Dank für deine prompte Anpassung!  Thumb-Up

Ich habe das Plugin bereits am Montag gekauft und sofort installiert. Im Großen und Ganzen komme ich gut klar damit. Jetzt gilt es, die Darstellung noch ein wenig zu optimieren. Falls ich noch Fragen haben sollte, melde ich mich. Vielen Dank nochmals!

Hallo,

ich bin mir nicht sicher ob ich mein Vorhaben über das Plugin realisieren kann:

Ich möchte gerne eine Hauptkategorie in einer anderen Hauptkategorie als Unterkategorie im Erweiterten Menü anzeigen lassen.

Beispiel:

Hauptkategorie 1 ist in der linken Sidebar als Hauptkategorie ersichtlich. Das soll auch so bleiben.

Die Hauptkategorie 1 lasse ich aber nicht in der oberen Leiste des Erweiterten Menüs anzeigen. Ich möchte stattdessen 

diese Hauptkategorie 1 als Unterkategorie z.B. bei der Hauptkategorie 2, die im Erweiterten Menü anzeigen lassen. Die Hauptkategorie 2 wird

dabei natürlich schon im Erweiterten Menü dargestellt.

Ist das möglich?

Es müsste ja vermutlich nur der Link der jeweiligen Hauptkategorie in die Unterkategorie Ebene des Erweiterten Menüs eingebaut werden oder?

Viele Grüße

Matthias

 

@malzfons schrieb:

Hallo,

ich bin mir nicht sicher ob ich mein Vorhaben über das Plugin realisieren kann:

Ich möchte gerne eine Hauptkategorie in einer anderen Hauptkategorie als Unterkategorie im Erweiterten Menü anzeigen lassen.

Beispiel:

Hauptkategorie 1 ist in der linken Sidebar als Hauptkategorie ersichtlich. Das soll auch so bleiben.

Die Hauptkategorie 1 lasse ich aber nicht in der oberen Leiste des Erweiterten Menüs anzeigen. Ich möchte stattdessen 

diese Hauptkategorie 1 als Unterkategorie z.B. bei der Hauptkategorie 2, die im Erweiterten Menü anzeigen lassen. Die Hauptkategorie 2 wird

dabei natürlich schon im Erweiterten Menü dargestellt.

Ist das möglich?

Es müsste ja vermutlich nur der Link der jeweiligen Hauptkategorie in die Unterkategorie Ebene des Erweiterten Menüs eingebaut werden oder?

Viele Grüße

Matthias

 

Hallo,

ich würde sagen, das hat nicht direkt etwas mit den beiden Plugins zu tun, sondern könntest du einfach über das Anlegen der entsprechenden Kategorien lösen.

Du könntest bei der Hauptkategorie 1 ja die Option „NICHT in Top-Navigation anzeigen“ aktivieren, sodass die Hauptkategorie nicht in der Menüleiste (meinst du doch sicher mit der „oberen Leiste des Erweiterten Menüs“?) angezeigt wird. Danach könntest du ja einfach eine weitere Kategorie mit dem Namen der Hauptkategorie 1 unterhalb der Hauptkategorie 2 ablegen und diese auf eine „externe Seite verlinken“ (also auf den Link der Hauptkategorie 1).

Mit dem angesprochenen Plugin könntest du dann durch die zahlreichen CSS-Klassen noch individuelle Anpassungen im erweiterten Menü vornehmen, beispielsweise Kategorien über CSS ausblenden oder gestalten.

Beste Grüße

Sebastian

Hallo Sebastian,

die Idee ist gut. Aber habe ich dann nicht 2 gleich lautende Seiten im System? Double Content). Intern unterscheiden sich diese zwar durch die Kategorie ID, aber SUMA technisch? Ich gebe dann in dieser gleich benannten Seite gar keine Daten ein bis auf den externen Link oder? Oder stehe ich auf dem Schlauch?

Steht die doppelt benannte Kategorie dann nicht als gleich lautende Unterkategorie in der Sidebar?

Viele Grüße

Matthias