Footer bei Smartphones in der Navigation anzeigen

Wie kann man, wenn man bei Smartphones auf den Navigationsbutton klickt, auch den Footer anzeigen lassen?

Hallo,
wenn du die Links aus dem Footer im Offcanvas-Menü anzeigen möchtest, sobald auf den Navigationsbutton geklickt wird, könnte eine Möglichkeit sein, das entsprechende Template des Offcanvas-Menüs anzupassen. Dazu könntest du beispielsweise die Links aus dem Footer der „Service-Navigation“ zuweisen und den entsprechenden Block im Template so anpassen, dass die page.header.serviceMenu ausgegeben wird.

@Sysgrade_eCommerce danke.

Ich habe folgende Einbindung ausprobiert:

{% sw_extends '@Storefront/storefront/layout/navigation/offcanvas/categories.html.twig' %}

{% block layout_navigation_offcanvas_navigation_categories %}
{{ parent() }}

{% sw_include '@Storefront/storefront/layout/footer/footer.html.twig' %}
{% endblock %}

Dann sind aber die Menüpunkte vom Footer nicht aufklappbar. Was muss man ändern, damit das geht?

Wie kann man nur den Block „layout_footer_navigation“ statt allen Blöcken von „footer.html.twig“ einbinden?

Ich würde den entsprechenden Block einfach kopieren und hier einfügen.

Vieles im Frontend funktioniert über JavaScript, das auf class Namen zurückgreift. Daher kann es sein, dass das JavaScript nicht mehr ausgeführt wird, wenn die class Hierarchie nicht mehr stimmt. Da hilft leider nur jeden Einzelfall prüfen.

Hallo @Max_Shop,

danke für die Antwort.

Damit kann ich nur den einen Block statt allen Blöcken von footer.html.twig einbinden. Geht das nicht mit einem Befehl, dass man nur einen statt alle Blöcke einbinden kann?

Ich habe im Inspektor der Firefox-Entwicklerwerkzeuge das div mit der Klasse container kopiert und vollständig eingefügt.
Damit kann man die Navigationspunkte leider auch nicht durch einen Klick oder Tipp aufklappen. Da ja vorher der komplette Footer eingebunden war, hätte es mich gewundert, wenn es gehen würde.

Nein, einem include kann man nur Variablen mitgeben, nicht aber Blöcke ausschließen.

Du könntest aber testen die include einzubinden und darunter die nicht gewünschten Blöcke leer zu überschreiben.

@Max_Shop

{% sw_extends '@Storefront/storefront/layout/navigation/offcanvas/categories.html.twig' %}

{% block layout_navigation_offcanvas_navigation_categories %}
{{ parent() }}

{% sw_include '@Storefront/storefront/layout/footer/footer.html.twig' %}

{% block layout_footer_bottom %}
{% endblock %}

{% endblock %}

funktioniert leider nicht, um den unerwünschten Teil nicht anzuzeigen.

Wie bei Footer bei Smartphones in der Navigation anzeigen - #5 von UX4U beschrieben, sind die Navigationspunkte leider nicht aufklappbar.

Könntest du mir bitte helfen, damit ich es hinbekomme?

Hallo,

so „einfach“ wie es scheint, ist es nicht. Damit das JavaScript (speziell shopware/src/Storefront/Resources/app/storefront/src/plugin/collapse/collapse-footer-columns.plugin.js at trunk · shopware/shopware · GitHub ) weiter funktioniert, müsste man es erneut initialisieren, sobald das OffCanvas-Menü geöffnet wurde. Erst dann würde das auf- und zuklappen wieder funktionieren.

Grüße
Sebastian

Hallo @sschreier,

vielen Dank.

Wie initialisiere ich das JavaScript erneut? Twig-Dateien erweitern kann ich.

Hast du eine Lösung, wie ich nur einen bestimmten Block statt der ganzen footer.html.twig einbinden kann?

Die Blöcke, die du überschreiben möchtest, dürfen vermutlich nicht im gleichen Block sein, sondern danach als separate Blöcke.