4te Spalte im Footer

Guten Morgen allerseits,

ich steige gerade in das Thema Shopware6 ein und habe natürlich mit diversen Problemen zu kämpfen.
Aktuell stellt sich die Frage wie man eine vierte Spalte im Footer so anzeigt, dass alle 4 Spalten auf dem Desktop nebeneinander dargestellt werden.

Aktuelll ist es so, dass nur 3 Spalten in einer Reihe sind und die 4te darunter angefügt wird.

Kann mir dabei jemand helfen?

Grüsse
stickypedro

Soweit ich weiß kann man mit dem Default Theme von Shopware in den Einstellungen max. 4 Spalten auswählen, aber ich weiß gerade nicht, wo genau diese Funktion ist. Ansonsten ein anderes Theme auswählen, z.B. das Liberty, dieses ist auch kostenlos. Es gibt auch einige kostenpflichtige Plugins, bei denen man dies aufjedenfall einstellen kann… Aber auch kostenplfichitige Theme haben diese Einstellung, da kann man sogar 6 oder 8 Spalten konfigurieren

Hallo,

das lässt sich eigentlich recht einfach lösen, indem man entweder den CSS-Code für den Footer ändert oder das Template und die entsprechende Bootstrap-CSS-Klasse setzt, also bei allen Bereichen aus col-md-4 einfach col-md-3 platform/footer.html.twig at trunk · shopware/platform · GitHub macht.

Mich für solch eine Kleinigkeit von einem Theme abhängig machen würde ich aber nicht.

Grüße
Sebastian

1 „Gefällt mir“

Danke euch für euer Antworten.
Ich würde gerne das Basis Theme verwenden und nur Kleinigkeiten anpassen, aber wenn ich ehrlich bin, finde ich noch nichtmal die zugehörigen Daten.
Da werden sich sicher einige kaputtlachen,. Ich bin kein Entwickler, aber komme im Grunde im Bereich PHP, HTML und CSS bei allen gängigen System sehr gut zurecht, aber Shopware 6 ist mir ein Rätsel.

Komischerweise finde ich dazu auch nichts im Web. Auch am Erstellen eines Child-Themes scheitere ich diesmal kläglich. Sehr demotivierend. Ich finde nur die CSS-All aber keine Template-Dateien.

Könnt ihr mich dazu kurz aufklären?

Hallo,

steht eigentlich alles super eindeutig und gut beschrieben in den offiziellen Shopware 6 - Dokumentationen, besser kann man es auch nicht erklären: Customize templates - Shopware Developer .

Grüße
Sebastian

Das Problem ist, dass die im Beispiel angegebenen Pfade bei mir nicht aufzufinden sind.

im root gibt es zwar den Ordner src, aber keinen Storefront oder ähnliches wo ich den Ordner Layout samt Header, Footer etc. Daten finde.

Hallo,

alles, was man dazu benötigt, steht in den Dokumentationen, siehe: Create a first theme - Shopware Developer .

Dort steht auch nirgends, das man bestehende Dateien anpassen soll. Es ist auch ein Plugin in den Dokumentationen verlinkt, womit man jeden Twig-Block-Namen im Shop dann sieht.

In einem production-Template befindet sich das alles auch im vendor-Verzeichnis - wie erwähnt soll es dort aber auch niemals geändert werden.

Grüße
Sebastian

Das scheint alles echt zu hoch für mich…weiß noch nicht mal was mit Terminal gemeint ist, wo man das Theme erstellen soll.

Im Shopware5 konnte man einfach vom Haupttemplate ableiten und einfach die zu verändernden Dateien in den neuen Theme-Ordner kopieren, editieren und fertig.

Nun muss man anscheinend Informatik studiert haben :smiley:

So ein Mist…ich probiere mich die Nacht nochmal durchzubeissen…danke euch!

Ich muss mich bißle korrigieren, so wie es ausschaut, kann man durch das Default Theme keine 4 Spalten im Backend erzwingen… Da muss schon ein anderes Theme her… Aber es gibt kostenlose welches auch 4 Spalten darstellen können. Schreib mir eine private Nachricht, wenn Du Hilfe brauchst.

Dieses Theme ist kostenlos und kann 4 Spalten anzeigen… https://store.shopware.com/ssik376221434165f/free-liberty-responsive-theme.html?c=1033

Du muss kein Theme selbstständig erstellen. Du kannst es im Shopware 6 App Store kostenlos downloaden und in Deinem Shop hochladen, installieren etc. Aber noch besser, im Backend gibt es die Funktion " App Store", dort kannst Du direkt alles möglich aus dem Shopware 6 App Store installieren, aber Du musst erst einmal einen Shopware Account erstellen und diesen mit deinem Shop verbinden…

Danke dir…das ist mir bekannt. Nach der Methode vom sschreier geht auch das Basis-Theme mit 4 Spalten. Habe das mal im Browserinsektor getestet. Aber ich finde halte die Pfade nicht wo ich es auf dem Server anpassen kann bzw. verstehe nach wie vor nicht, wie ich ein Child-Theme erstellen kann wo ich es dann anpasse.

Ich würde schon gerne das Basis-Theme verwenden, da es superclean ist und sehr gut zu meinem Projekt passt, aber ein paar sehr kleine Veränderungen würde ich gerne vornehmen.

Beispielsweise 4 Spalten im Footer, eine dünne Linie unterm Header, Haupnavi mitteg etc. Nix wildes…wird aber grad zu einem Riesenprojekt :smiley:

Aber vielleicht hast du Recht und ich komme mit einem anderen Theme eher ans Ziel…ich teste mal das Liberty…danke!

Es gibt 2 kostenlose Plugins im Shopware App Store, einmal Custom JavaScript/CSS Manager für Shopware 6 Link: https://store.shopware.com/dne5719820551438f/custom-javascript/css-manager-fuer-shopware-6.html und Custom Template Manager Link: https://store.shopware.com/dne5116914822923f/custom-template-manager.html

Wenn du diese 2 Plugins installierst, dann kannst Du quasi alles aus Deinem Tmeplate sehen ohne extra ind en Server zu gehen, diese 2 Plugins sind echt super, denn hier kannst Du Befehle durchgeben, sofern Du auch Codes erstellen kannst, man muss halt wissen, wo genau der richtige Code reinkommt, aber alles was man bearbeitet hat, kann man auch wunderbar wieder entfernen, die Übersicht ist viel besser, als im Server unter Template zu ändern… Installiere diese 2 Plugins, die sind wirklich sehr hilfreich

Vielen Dank für die zwei Apps…diese helfen mir schonmal weiter!

super… Übrigens wegen den Spalten, dass müsste das Plugin CSS Manager sein, ein neues erstellen, Container nennt man es glaube ich, dann Deinen Befehl, 4 , 5 oder 6 Spalten oder was du halt so möchtest… Im anderen Plugin kommt es glaube ich nicht rein, das ist mehr für Inhalt, z.B. wenn ich einen Pinterest Link haben möchte, mit Bilder etc.

Ich hatte auch mit dem Problem zu kämpfen. Deshalb hier eine Lösung für das Standard-Theme. Im eigenen Theme in der „EignesTheme/src/Resources/views/storefront/layout/footer/footer.html.twig“ (falls noch nicht vorhanden anlegen) folgendes eintragen:

{% sw_extends ‚@Storefront/storefront/layout/footer/footer.html.twig‘ %}

  		{% block layout_footer_navigation_hotline %}
                <div class="col-md-3 footer-column js-footer-column">
                    {% block layout_footer_navigation_hotline_headline %}
                         {{ parent() }}
                            {% block layout_footer_navigation_hotline_icons %}
                                 {{ parent() }}
                            {% endblock %}
                        
                    {% endblock %}

                    {% block layout_footer_navigation_hotline_content %}
                         {{ parent() }}
                    {% endblock %}
                </div>
            {% endblock %}


  		{% block layout_footer_navigation_column %}
              	<div class="col-md-3 footer-column js-footer-column">
  			   {% block layout_footer_navigation_information_headline %}
  				{{ parent() }}
  			   {% endblock %}
  			   
  			   {% block layout_footer_navigation_information_content %}
                   	{{ parent() }}
                   {% endblock %}
  			</div>				
           	{% endblock %}

Danach bin/console theme:compile und bin/console cache:clear

Wenn ich die Änderung vornehme, dann lädt das Theme nicht mehr

kann nicht funktionieren. "" sind die korrekten Zeichen.

{% sw_extends "@Storefront/storefront/layout/footer/footer.html.twig" %}

1 „Gefällt mir“

Wenn ich im Originaltheme folgende Änderung mache:

col-md-4

zu

col-md-3

dann funktioniert es.

Aber wie mache ich die Änderung updatesicher?

{% sw_extends ‚@Storefront/storefront/layout/footer/footer.html.twig‘ %}

{% block layout_footer_navigation_hotline %}
< div class=„col-md-4 footer-column js-footer-column“>
{{ parent() }}
< div class=„col-md-3 footer-column js-footer-column“>
{% endblock %}

{% block layout_footer_navigation_column %}
< div class=„col-md-4 footer-column js-footer-column“>
{{ parent() }}
< div class=„col-md-3 footer-column js-footer-column“>
{% endblock %}

funktioniert es nicht.

Wer kann mir hierbei helfen?

Update sicher macht man etwas allgemein, indem man ein eigenes Plugin nutzt (Plugin oder Theme), welches den Standard erweitert (wie in deinem Post).

Dann den entsprechenden Block im Original überschreiben und es sollte tun. Überschrieben werden kann immer nur einmal. Das heißt wenn ein anderes Plugin exakt den gleichen Block überschreibt, dann zählt die Reihenfolge der Plugins. Oder man erweitert das andere Plugin, dann funktioniert überschreiben des Überschriebenen auch.

Cache geleert?