Bloki szablonów

Widget renderuje się przez standardowe twigowe include’y Shopware. Jeśli drop-downy pozycji nie pasują do Twojego theme’a, możesz rozszerzyć szablony z własnego pluginu / appki.

Szablony storefrontu z pluginu

Plik	Cel
storefront/p2lab/widget/estimated-delivery.html.twig	Kontener widgetu. Iteruje po aktywnych komponentach (komunikat / zegar / kroki) i includeuje każdy.
storefront/p2lab/widget/component/message.html.twig	Komponent komunikatu
storefront/p2lab/widget/component/clock.html.twig	Komponent zegara (layouty default i compact, warianty default i boxes)
storefront/p2lab/widget/component/steps.html.twig	Komponent kroków
storefront/p2lab/widget/media.html.twig	Helper do renderowania ikon
storefront/block/cms-block-p2lab-cms-estimated-delivery.html.twig	Wrapper bloku CMS

Strony, do których plugin się wpina

Plugin dostarcza rozszerzenia theme’a dla tych stron:

Plik	Strona storefront
storefront/page/product-detail/buy-widget.html.twig	Buy widget na karcie produktu
storefront/page/checkout/cart/index.html.twig	Koszyk
storefront/page/checkout/confirm/index.html.twig	Potwierdzenie zamówienia
storefront/page/checkout/address/index.html.twig	Adres / inline rejestracja w checkoucie

Każde rozszerzenie strony respektuje drop-down Placement position swojej zakładki — jeśli wybierzesz disabled, rozszerzenie nie renderuje nic.

Ręczne renderowanie widgetu

Jeśli potrzebujesz widgetu w miejscu, którego plugin jeszcze nie obsługuje, includuj szablon widgetu bezpośrednio z theme’a:

{% sw_include "@P2LabEstimatedDelivery/storefront/p2lab/widget/estimated-delivery.html.twig" with {
    p2labEstimatedDeliveryCmsBlock: null
} %}

Widget sam się policzy, używając tej samej konfiguracji Settings / Widget / Translation co reszta storefrontu. Przekazanie non-null bloku CMS włącza ścieżkę “inherit from product” opisaną w Storefront → Blok CMS.

Nadpisywanie renderowanego HTML

Każdy blok twig wewnątrz szablonów widgetu używa konwencji p2lab_estimated_delivery_…, więc możesz je rozszerzać standardowym wzorcem override Shopware. Przykładowo, by dodać wrapper wokół komunikatu:

{# Resources/views/storefront/p2lab/widget/component/message.html.twig #}
{% sw_extends '@P2LabEstimatedDelivery/storefront/p2lab/widget/component/message.html.twig' %}

{% block p2lab_estimated_delivery_widget_message %}
    <div class="my-theme__delivery-banner">
        {{ parent() }}
    </div>
{% endblock %}

Trzyma Cię to na wspieranej ścieżce szablonów i przeżywa aktualizacje pluginu, dopóki nazwy bloków pod spodem się nie zmieniają.

Haki CSS

Każdy element widgetu ma stabilną klasę BEM z prefixem p2lab-estimated-delivery__ — np. p2lab-estimated-delivery__widget-clock__compact-info lub p2lab-estimated-delivery__widget-steps__list-item. Override’y CSS w Twoim theme celują w te klasy bezpośrednio.