{% sw_extends '@Storefront/storefront/element/cms-element-image-gallery.html.twig' %}
{# ============================================================
GoFlare Gallery Override
- Custom Circle-Arrow SVGs (Hauptbild + Thumbnails)
- Dot-Navigation ausgeblendet
- Force horizontal thumbnail axis (CMS hat "left" konfiguriert)
- Shopware JS (Zoom, Slider, Fullscreen) bleibt intakt
============================================================ #}
{# ---- Gallery-Position: im CMS-Admin auf "underneath" gestellt ---- #}
{# Shopware rendert jetzt nativ horizontale Thumbnails.
Keine Twig-Overrides für Position/Achse nötig. #}
{# ---- Hauptbild: Prev-Arrow → Kreis + Chevron links ---- #}
{% block element_image_gallery_inner_control_prev_icon %}
{% endblock %}
{# ---- Hauptbild: Next-Arrow → Kreis + Chevron rechts ---- #}
{% block element_image_gallery_inner_control_next_icon %}
{% endblock %}
{# ---- Thumbnail-Arrows (Position: left) → Kleine Kreise ---- #}
{% block element_image_gallery_inner_thumbnails_controls_left_prev_icon %}
{% endblock %}
{% block element_image_gallery_inner_thumbnails_controls_left_next_icon %}
{% endblock %}
{# ---- Thumbnail-Arrows (Position: underneath) → Kleine Kreise ---- #}
{% block element_image_gallery_inner_thumbnails_controls_underneath_prev_icon %}
{% endblock %}
{% block element_image_gallery_inner_thumbnails_controls_underneath_next_icon %}
{% endblock %}
{# ---- Zoom-Modal Arrows → Gleiche Circle-Pfeile ---- #}
{% block element_image_gallery_inner_zoom_modal_slider_control_prev_icon %}
{% endblock %}
{% block element_image_gallery_inner_zoom_modal_slider_control_next_icon %}
{% endblock %}
{# ---- Dot-Navigation komplett ausblenden ---- #}
{% block element_image_gallery_slider_dots %}{% endblock %}
{# ---- Thumbnail-Galerie auch auf Mobile (xs/sm) anzeigen ----
Shopware deaktiviert die Thumbnails per Default auf xs/sm
(thumbnailSlider.responsive.xs|sm.enabled = false).
Wir setzen sie hier auf enabled:true, bevor das Original rendert. #}
{% block element_image_gallery_inner %}
{% set gallerySliderOptions = gallerySliderOptions|replace_recursive({
thumbnailSlider: {
responsive: {
xs: { enabled: true, controls: true },
sm: { enabled: true, controls: true }
}
}
}) %}
{{ parent() }}
{% endblock %}