Hallo zusammen, ich möchte gerne bei “Klick” auf Service/Hilfe anstatt des Drop-Down-Menüs ein Off-Canvas-Panel öffnen, das wie das Warenkorb-Panel sich von rechts öffnet und dann weitere Infos anzeigt. Ich habe dazu bereits die Datei widgets/checkout/info.tpl in mein Theme kopiert und dort einen Button “Service/Hilfe” erzeugt, der im Header neben dem “Account-Button” angezeigt wird und die Seite “Info” aufruft (im Prinzip genau wie der Button “Account”). Die “Info” Seite möchte ich gerne als Off-Canvas-Panel anzeigen. Kennt da jemand eine Lösung? Mein Code für den “einfachen Button”: [code]{block name=“frontend_index_checkout_actions_service”}
Kann jemand einen Tip geben, wie oder wo man suchen muss? Gibt es im Standard Funktionen für die Off-Canvas-Aufrufe? In der Doku habe ich auch nicht viel gefunden was weiterhilft: https://developers.shopware.com/styletile/_components-offcanvas-button.html oder https://developers.shopware.com/styletile/_components-offcanvas-menu.html haben mich nicht richtig weiter gebracht. Helfen evt. die folgenden Scripte im Ordner themes/Frontend/Responsive/frontend/_public/src/js/ : jquery.off-canvas-button.js jquery.off-canvas-menu.js jquery.offcanvas-html-panel.js Oder gibt es Beispiele, wie man diese Scripte nutzen kann? Solche Off-Canvas-Panels sind doch immer recht nützlich, wenn man Infos seitlich einspielen möchte…
Hallo Raschu, Du solltest Dir den StateManager ansehen. Durch Aufruf des StateManagers in JS kannst Du Deine eigenen offCanvas Elemente bestimmen. Hierzu gibst Du den Trigger und das Datenelement an, bestimmst die Viewports und schreibst wie beim Warenkorb oder Menü deine HTML Container in das Template. Durch Aufruf des StateManagers und der Übergabe der CSS Klasse des Trigger-Elements sowie der CSS Klasse des Inhalts-Ziels-Elements bestimmst Du ein eigenständiges offCanvas Element. Das hat Shopware, wie ich finde, sehr gut gelöst. Als PluginType übergibst das gewünschte offCanvas Plugin, z.B. HTML Panel. Den Inhalt hinterlegst Du statisch im Quellcode (Inhalt-Ziel-Element) oder lädst diesen per ajax in das Inhalts-Element. Doc: https://developers.shopware.com/designe … luginbase/ … viel Spaß beim experimentieren!