Die Plugins sind leider nicht mehr kostenlos. Hat jemand eine Idee wie ich ohne Template Anpassung den Footer auf 4-Spaltig bekomme?
Auch suche ich ein Youtube Plugin wo links text steht und recht Video ist.
Danke und Gruss
Hallo,
ohne eine Template-Anpassung? Gar nicht.
Da von Shopware 6 Bootstrap genutzt wird und die Bootstrap-CSS-Klasse aussagt, dass jede Spalte nur 33% einnehmen darf, geht das nur, wenn man die CSS-Klasse im Template ändert (oder die CSS-Definition der CSS-Klasse ändert, was jedoch auch nur in einem eigenen Theme geht).
Die Template-Anpassung kannst du aber auch jederzeit kostenfrei in einem eigenen Theme vornehmen, ohne das man dafür die genannten (nun kostenpflichtigen) Erweiterungen benötigt.
Grüße
Sebastian
1 „Gefällt mir“
Hallo @sschreier,
wie kann man am einfachsten die 4. Spalte mit eigenem HTML füllen?
Wenn ich bei Kataloge → Kategorien für die Footernavigation 4 Punkte anlege, kann ich mit dem folgenden CSS 4 Spalten darstellen:
@media (min-width: 768px) {
.footer-column {flex: 0 0 25%;
max-width: 25%;}
}
Für die 4. Spalte kann ich im Backend eine Überschrift vergeben, aber leider kein eigenes HTML darunter einfügen.
Wenn ich /footer.html.twig erweitere, wird es ziemlich kompliziert. Ich möchte nur eine Überschrift vergeben und dann eigenes HTML einfügen.
Möglichkeit 1:
Es gibt wohl ein Plugin, welcher in der 1. Ebene der Footer Kategorie den Beschreibungstext der Kategorie im Footer anzeigen lassen kann. Somit könnte man Texte unter der Überschrift anzeigen.
Möglichkeit 2:
Du erweiterst deine „footer.html.twig“ und trägst Überschrift und Text mittels Textbausteine ein.
@R4M, @sschreier, das ist der Code, der wahrscheinlich angepasst werden muss:
{% block layout_footer_navigation_columns %}
{% for root in page.footer.navigation.tree %}
{% block layout_footer_navigation_column %}
<div class="col-md-4 footer-column js-footer-column">
{% block layout_footer_navigation_information_headline %}
<div class="footer-column-headline footer-headline js-collapse-footer-column-trigger"
{{ dataBsTargetAttr }}="#collapseFooterTitle{{ loop.index }}"
aria-expanded="true"
aria-controls="collapseFooter{{ loop.index }}">
{% if root.category.type == 'folder' %}
{{ root.category.translated.name }}
{% else %}
<a href="{{ category_url(root.category) }}"
{% if category_linknewtab(root.category) %}target="_blank"{% endif %}
title="{{ root.category.translated.name }}">
{{ root.category.translated.name }}
</a>
{% endif %}
{% block layout_footer_navigation_information_icons %}
<div class="footer-column-toggle">
<span class="footer-plus-icon">
{% sw_icon 'plus' %}
</span>
<span class="footer-minus-icon">
{% sw_icon 'minus' %}
</span>
</div>
{% endblock %}
</div>
{% endblock %}
{% block layout_footer_navigation_information_content %}
<div id="collapseFooter{{ loop.index }}"
class="footer-column-content collapse js-footer-column-content"
aria-labelledby="collapseFooterTitle{{ loop.index }}">
<div class="footer-column-content-inner">
{% block layout_footer_navigation_information_links %}
<ul class="list-unstyled">
{% for treeItem in root.children %}
{% set category = treeItem.category %}
{% set name = category.translated.name %}
{# @deprecated tag:v6.5.0 - Use "category.translated.externalLink" directly or category_url function instead. #}
{% set externalLink = category.translated.externalLink %}
{% block layout_footer_navigation_information_link_item %}
<li class="footer-link-item">
{% block layout_footer_navigation_information_link %}
{% if category.type == 'folder' %}
<div>{{ name }}</div>
{% else %}
<a class="footer-link"
href="{{ category_url(category) }}"
{% if category_linknewtab(category) %}target="_blank"{% endif %}
title="{{ name }}">
{{ name }}
</a>
{% endif %}
{% endblock %}
</li>
{% endblock %}
{% endfor %}
</ul>
{% endblock %}
</div>
</div>
{% endblock %}
</div>
{% endblock %}
{% endfor %}
{% endblock %}
Könnt ihr mir bitte helfen und den obigen Code anpassen? Ich kann die footer.html.twig erweitern, aber weiß nicht wie es am sinnvollsten ist.
Wie bekommt man es am einfachsten hin, dass der Originalcode genommen wird, aber eine zusätzliche Spalte kommt, bei der eine Überschrift und darunter der gewünschte HTML-Code eingefügt werden?
Hallo UX4U
probier es mal so aus:
{% 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() }}
{% 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 %}
{% block layout_footer_navigation_columns %}
{{ parent() }}
{% block layout_footer_navigation_column_last %}
<div class="col-md-3 footer-column js-footer-column">
{% block layout_footer_navigation_information_headline_last %}
<div class="footer-column-headline footer-headline js-footer-column-headline js-collapse-footer-column-trigger"
id="collapseFooterAdvantages"
data-bs-target="#collapseFooterAdvantages"
aria-expanded="true"
aria-controls="collapseFooterAdvantages"
role="listitem">
{{ "footer.deinText"|trans|sw_sanitize }}
{% block layout_footer_navigation_information_last_icons %}
<div class="footer-column-toggle">
<span class="footer-plus-icon">
{% sw_icon 'plus' %}
</span>
<span class="footer-minus-icon">
{% sw_icon 'minus' %}
</span>
</div>
{% endblock %}
</div>
{% endblock %}
{% block layout_footer_navigation_dein_Text_für_diesen_Block %}
<div id="collapseFooter{{ loop.index }}"
class="footer-column-content collapse js-footer-column-content"
aria-labelledby="collapseFooterTitle{{ loop.index }}">
--- Dein Inhalt für die 4te Spalte ---
</div>
{% endblock %}
{% endblock %}
</div>
{% endblock %}
Viel Spaß
1 „Gefällt mir“
@fixxtech, das funktioniert.
Vielen Dank.