[Gelöst] Mobile Buttons funktion bereits ab Tablet größe Aktivieren

Shopware 5 Themes & Design
1

Hi zusammen…

ich habe zwar ein Thread bereits erstellt aber… mit dem neuen Design find ich kein Edit button um mein Thread klarer zu beschreiben…
Also hier nochmals neu…

Ich würde gerne die Funktion der Buttons im Responsive Design kommen ab PhonePotrai das sie bereits ab Tablet funktionsfähig sind.
Design ist bereits angepasst abe rihre Funktion ist nicht gegeben… und ich finde einfach nicht woran es leigt. Sowohl die Offcanvas Navigation lässt sich nicht rufen oder auch die Navigation… also durch das drücken des Such buttens erscheint nicht das TExtfeld…  Ich habe im „jquery.off-canvas-button.js“, „jquery.offcanvas-html-panel.js“, „jquery.off-canvas-menu.js“ und   „jquery.search.js“

DIe Funktion geht nur wenn der Screen in dementsprechendem berreich ist. Ansosnten bekomm ich in die URL nur den #ID Link zum cnavas oder zur suche aber mehr passiert nicht.

Hat jemand für mich einen Rat wie ich das bearbeiten kann das es auch bis tablet version funktionsfähig ist?

2

Hey, wie hast du es denn gelöst? Genau das brauche ich auch!

3

Hallo zusammen,

wir haben in Shopware einen sogenannten StateManager eingebaut, der es ermöglicht Javascript je nach Viewport-Breite zu aktivieren bzw. zu deaktivieren. Um bei diesen Beispiel zu bleiben. Das Offcanvas-Menü wird nur auf Mobile aktiviert:

StateManager.addPlugin('*[data-offcanvas="true"]', 'swOffcanvasMenu', ['xs', 's'])

https://github.com/shopware/shopware/blob/5.1/themes/Frontend/Responsive/frontend/_public/src/js/jquery.shopware-responsive.js#L34

Um das Offcanvas-Plugin (intern swOffcanvasMenu) auch auf Tablet zu aktivieren müsst ihr einfach in eueren eigenen Theme innerhalb einer Javascript folgendes aufrufen:

StateManager.addPlugin('*[data-offcanvas="true"]', 'swOffcanvasMenu', ['xs', 's', 'm'])

Alle weiteren Informationen rund um unseren StateManager und unserer jQuery Plugin-Basis findet ihr in unseren DevDocs: https://developers.shopware.com/designers-guide/javascript-statemanager-and-pluginbase/ 

Viele Grüße,
Stephan Pohl  Shopware

1 „Gefällt mir“
4

ok und wenn man das ganze auch noch standardmäßig auf der normalen Desktop-Version haben möchte? Ich habe es versucht, indem ich die Werte L und XL eingetragen habe, aber das Offcanvas erscheint nicht …

5

Halo,

bitte Unwissenheit verzeihen, aber wie mache ich das:

Um das Offcanvas-Plugin (intern swOffcanvasMenu) auch auf Tablet zu aktivieren müsst ihr einfach in eueren eigenen Theme innerhalb einer Javascript folgendes aufrufen:

StateManager.addPlugin(‚*[data-offcanvas=„true“]‘, ‚swOffcanvasMenu‘, [‚xs‘, ‚s‘, ‚m‘])

Wie muss die Datei denn heißen, die ich hierfür anlegen soll?! Und reicht als Inhalt wirklich stumpf  „StateManager.addPlugin(‚*[data-offcanvas=„true“]‘, ‚swOffcanvasMenu‘, [‚xs‘, ‚s‘, ‚m‘])“ einzutragen?

Wäre super wenn mir jemand helfen könnte.

6

@jonas3301 schrieb:

Halo,

bitte Unwissenheit verzeihen, aber wie mache ich das:

Um das Offcanvas-Plugin (intern swOffcanvasMenu) auch auf Tablet zu aktivieren müsst ihr einfach in eueren eigenen Theme innerhalb einer Javascript folgendes aufrufen:

StateManager.addPlugin(‚*[data-offcanvas=„true“]‘, ‚swOffcanvasMenu‘, [‚xs‘, ‚s‘, ‚m‘])

Wie muss die Datei denn heißen, die ich hierfür anlegen soll?! Und reicht als Inhalt wirklich stumpf  „StateManager.addPlugin(‚*[data-offcanvas=„true“]‘, ‚swOffcanvasMenu‘, [‚xs‘, ‚s‘, ‚m‘])“ einzutragen?

Wäre super wenn mir jemand helfen könnte.

Genau das habe ich mich auch gefragt :smiley: