Optimized advanced menu (sticky effect, several representation modes, etc.)

Contact & Support

If you have any questions or suggestions just contact us via mail to shopware.support@digitalwert.de and we are happy to help you. A instructions for the plugin can be found at: https://shopwaredemo.digitalwert.de/media/pdf/f3/65/fa/Guide_OptimizeAdvancedMenu.pdf .

Description of the plugin

With the plugin "Optimized advanced menu (sticky effect, several representation modes, etc.)" you can optimize the advanced menu from shopware and add more features, for example the contents of the subcategories such as the image, the headline and the text will be displayed on the right teaser side when you hovering the subcategories in the menu.

Attention: to use our plugin it is necessary to install and activate the plugin "Erweitertes Menü" from the supplier shopware AG first. Please check if the plugin is installed and activated (in "configuration" -> "plugin manager" -> "installed" -> "installed"), because this plugin is installed in the standard by shopware, but is deactivated for the time being.

The width of the teaser on the right side/ can also be defined per category (0%, 25%, 50%, 75% and 100%). 

Furthermore, you can choose from a variety of different display modes for the advanced menu, which can also be set individually for each category:

• List 1 - headline of the teaser (side by side)
• List 2 - icon on the left, headline of the teaser on the right (side by side)
• List 3 - icon on the left, headline of the teaser on the right (among themselves)
• Tile 1 - full size icon, headline of the teaser below
• Tile 2 - full size icon, headline of the teaser at the bottom of the picture
• Tile 3 - full size icon, headline of the teaser in the middle of the picture
• Tile 4 - full size icon on the left, headline of the teaser on the right
• Tile 5 - full size icon on the left, headline and text of the teaser on the right.

The number of levels displayed can also be set per category as needed. If the number of levels is greater than 1, you can also select whether only the title of the teaser should be displayed in level 1. 

In addition, you can define a category icon, a teaser image, a teaser headline and a teaser text for each category, which are displayed in the menu in the various display modes and in the teaser area. Within the plugin configuration it can be selected whether the new input field "headline of the teaser" or the existing input field "CMS functions: Header" should be used, as well as the existing TinyMCE field "CMS functions: Category description" instead of the new TinyMCE field "text of the teaser" and the new medium field "teaser image of the right teaser" instead of the existing medium field "Default Settings - Category: image".

The width of the category icons and the teaser height for the tiling mode can also be defined individually in the plugin configuration globally or per category. 

Furthermore, the display of the links "to category", "learn more" and "more categories" and the display of the teaser image, the headline of the teaser and the text of the teaser can be set individually within the plugin configuration global or per category.

Within the plugin configuration, you can also choose whether the navigation bar should be pinned to the top of the screen when scrolling so that it is permanently visible. The resolution (tablet portrait, tablet landscape and desktop) can be selected and the height can be set in pixels, from which the navigation bar is to be pinned. 

In addition, the plug-in provides its own css classes for just about every item in the advanced menu that allows further customization.

Informations about the plugin

(1). Developed according to the new plugin system from shopware 5.2.

(2). Compatible with PHP 7.

(3). Test for 30 days without obligation: with the trial version you can use the plugin for 30 days free of charge and in full directly in your shop.

(4). Compatible themes: this plugin is compatible with the Responsive theme from shopware and themes derived from it. When using a third party theme, which was purchased through the shopware store, the proper use of the plugin can not be guaranteed as with any other shopware plugin. 

(5). Subshop compatiblity: the plugin supports subshops and can be activated per subshop.

(6). Unencrypted: the plugin is provided completely open source, so you do not need the license manager from shopware and it can therefore be used without problems without the iOnCube Loader.

(7). Own shopware blocks: the plugin provides its own shopware blocks so you be able to adapt or extend the plugin update safe in your own theme. The names of the corresponding own shopware blocks can be found in the instructions: https://shopwaredemo.digitalwert.de/media/pdf/f3/65/fa/Guide_OptimizeAdvancedMenu.pdf .

The configurations made per screenshot (the above settings were made within the main category "mountain air & adventure" and all default settings leave otherwise, in the subcategories only the category icons were assigned)

Different settings made within the plugin configuration: at the selection field "The same representation mode for each main category" the value "No - use a different representation mode for selected main categories" and at the selection filed "The same number of levels for each main category" the value "No - use a different number of levels for selected main categories" was selected.

Example 1 ( https://shopwaredemo.digitalwert.de/media/image/6d/f4/08/Optimizeadvancedmenu1.png ):

• width of the right teaser: 75%
• representation mode: Liste 1 - Überschrift des Teasers (nebeneinander)
• number levels: 2

Example  2 ( https://shopwaredemo.digitalwert.de/media/image/40/f0/bb/Optimizeadvancedmenu2.png ):

• width of the right teaser: 75%
• representation mode: Liste 2 - Icon links, Überschrift des Teasers rechts (nebeneinander)
• number levels: 2

Example 3 ( https://shopwaredemo.digitalwert.de/media/image/73/41/51/Optimizeadvancedmenu3.png ):

• width of the right teaser: 75%
• representation mode: Kachel 4 - vollflächiges Icon links, Überschrift des Teasers rechts
• number levels: 2

Example 4 ( https://shopwaredemo.digitalwert.de/media/image/04/c8/68/Optimizeadvancedmenu4.png ):

• width of the right teaser: 75%
• representation mode: Kachel 5 - vollflächiges Icon links, Überschrift und Text des Teasers rechts
• number levels: 2

Example 5 ( https://shopwaredemo.digitalwert.de/media/image/0d/ff/6b/Optimizeadvancedmenu5.png ):

• width of the right teaser: 50%
• representation mode: Liste 1 - Überschrift des Teasers (nebeneinander)
• number levels: 2

Example 6 ( https://shopwaredemo.digitalwert.de/media/image/bd/00/4d/Optimizeadvancedmenu6.png ):

• width of the right teaser: 50%
• representation mode: Liste 2 - Icons links, Überschrift des Teasers rechts (nebeneinander)
• number levels: 2

Example 7 ( https://shopwaredemo.digitalwert.de/media/image/7e/8f/77/Optimizeadvancedmenu7.png ):

• width of the right teaser: 50%
• representation mode: Liste 3 - Icons links, Überschrift des Teasers rechts (untereinander)
• number levels: 2

Example 8 ( https://shopwaredemo.digitalwert.de/media/image/c9/8a/ba/Optimizeadvancedmenu8.png ):

• width of the right teaser: 50%
• representation mode: Kachel 1 - vollflächiges Icon, Überschrift des Teasers darunter
• number levels: 2

Example 9 ( https://shopwaredemo.digitalwert.de/media/image/67/31/c9/Optimizeadvancedmenu9.png ):

• width of the right teaser: 50%
• representation mode: Kachel 2 - vollflächiges Icon, Überschrift des Teasers am unteren Bildrand
• number levels: 2

Example 10 ( https://shopwaredemo.digitalwert.de/media/image/07/34/a6/Optimizeadvancedmenu10.png ):

• width of the right teaser: 50%
• representation mode: Kachel 3 - vollflächiges Icon, Überschrift des Teasers mittig im Bild
• number levels: 2

Example 11 ( https://shopwaredemo.digitalwert.de/media/image/08/06/d8/Optimizeadvancedmenu11.png ):

• width of the right teaser: 50%
• representation mode: Kachel 4 - vollflächiges Icon links, Überschrift des Teasers rechts
• number levels: 2

Example 12 ( https://shopwaredemo.digitalwert.de/media/image/af/e6/01/Optimizeadvancedmenu12.png ):

• width of the right teaser: 50%
• representation mode: Kachel 5 - vollflächiges Icon links, Überschrift und Text des Teasers rechts
• number levels: 2

Example 13 ( https://shopwaredemo.digitalwert.de/media/image/da/83/e2/Optimizeadvancedmenu13.png ):

• width of the right teaser: 50%
• representation mode: Liste 2 - Icons links, Überschrift des Teasers rechts (nebeneinander)
• number levels: 1

Example 14 ( https://shopwaredemo.digitalwert.de/media/image/d9/65/32/Optimizeadvancedmenu14.png ):

• width of the right teaser: 50%
• representation mode: Kachel 1 - vollflächiges Icon, Überschrift des Teasers darunter
• number levels: 1

Example 15 ( https://shopwaredemo.digitalwert.de/media/image/4d/c8/de/Optimizeadvancedmenu15.png ):

• width of the right teaser: 50%
• representation mode: Kachel 2 - vollflächiges Icon, Überschrift des Teasers am unteren Bildrand
• number levels: 1

Example 16 ( https://shopwaredemo.digitalwert.de/media/image/db/47/af/Optimizeadvancedmenu16.png ):

• width of the right teaser: 50%
• representation mode: Kachel 3 - vollflächiges Icon, Überschrift des Teasers mittig im Bild
• number levels: 1

Example 17 ( https://shopwaredemo.digitalwert.de/media/image/90/dc/76/Optimizeadvancedmenu17.png ):

• width of the right teaser: 50%
• representation mode: Kachel 4 - vollflächiges Icon links, Überschrift des Teasers rechts
• number levels: 1

Example 18 ( https://shopwaredemo.digitalwert.de/media/image/67/36/11/Optimizeadvancedmenu18.png ):

• width of the right teaser: 50%
• representation mode: Kachel 5 - vollflächiges Icon links, Überschrift und Text des Teasers rechts
• number levels: 1

Example 19 ( https://shopwaredemo.digitalwert.de/media/image/b5/c6/69/Optimizeadvancedmenu19.png ):

• width of the right teaser: 0%
• representation mode: Liste 2 - Icon links, Überschrift und Text des Teasers rechts
• number levels: 1

Example 20 ( https://shopwaredemo.digitalwert.de/media/image/8f/c2/d8/Optimizeadvancedmenu20.png ):

• width of the right teaser: 0%
• representation mode: Kachel 1 - vollflächiges Icon, Überschrift des Teasers darunter
• number levels: 1

Example 21 ( https://shopwaredemo.digitalwert.de/media/image/10/71/e4/Optimizeadvancedmenu21.png ):

• width of the right teaser: 0%
• representation mode: Kachel 2 - vollflächiges Icon, Überschrift des Teasers am unteren Bildrand
• number levels: 1

Example 22 ( https://shopwaredemo.digitalwert.de/media/image/14/30/g0/Optimizeadvancedmenu22.png ):

• width of the right teaser: 0%
• representation mode: Kachel 3 - vollflächiges Icon, Überschrift des Teasers mittig im Bild
• number levels: 1

Example 23 ( https://shopwaredemo.digitalwert.de/media/image/e3/39/64/Optimizeadvancedmenu23.png ):

• width of the right teaser 0%
• representation mode: Kachel 4 - vollflächiges Icon links, Überschrift des Teasers rechts
• number levels: 1

Example 24 ( https://shopwaredemo.digitalwert.de/media/image/a8/12/ee/Optimizeadvancedmenu24.png ):

• width of the right teaser: 0%
• representation mode: Kachel 5 - vollflächiges Icon links, Überschrift und Text des Teasers rechts
• number levels: 1