[im4] ⭐ Sekcja sprzedażowa⭐

Sekcja sprzedażowa buduje trzyczęściowy baner: grafikę po lewej, centralny box z nagłówkiem, opisem, ikoną i przyciskiem oraz grafikę po prawej. Moduł nadaje się m.in. do prezentacji konkretnej kategorii, serii produktów, promocji albo wyróżnienia kluczowej oferty.

1. Wgraj lewą i prawą grafikę.
2. Ustaw Tytuł oraz Treść środkowego boxa.
3. Opcjonalnie wgraj ikonę treści.
4. Włącz przycisk, wpisz jego tekst i link.
5. Dopasuj szerokości kolumn oraz parametr Nachodzenie boxa na grafiki.
6. Na końcu ustaw kolory, zaokrąglenia, cień i typografię.

Poniższy symulator odwzorowuje formularz modułu z Shopera. Zmiany pól LIVE są nanoszone na prawy podgląd bez przeładowania formularza. Fioletowe S użyłem tylko przy dwóch polach wysokości grafik mobile, ponieważ obecny CSS ukrywa te grafiki na telefonie i nie da się uczciwie pokazać ich efektu.

Najbardziej charakterystyczny efekt daje układ z bocznymi grafikami po około 25–30% szerokości oraz centralnym boxem nachodzącym na obie strony. Parametr Nachodzenie boxa na grafiki działa przez ujemny margines środkowej karty — zwiększaj go stopniowo, aż karta wejdzie na grafiki w pożądanym stopniu.

Jeżeli zdjęcie jest mocno kadrowane, ustaw Dopasowanie = Wypełnij i skoryguj kadr polem pozycji, np. center top albo 50% 20%.

Przycisk może prowadzić do kategorii, produktu, landing page lub dowolnego adresu. Po włączeniu opcji Otwórz przycisk w nowej karcie Twig dodaje target="_blank" oraz zabezpieczenie rel="noopener noreferrer".

• Box za mocno nachodzi na grafiki — zmniejsz wartość „Nachodzenie boxa na grafiki”.
• Zdjęcie ucina ważny fragment — zmień pozycję obrazu albo użyj trybu „Dopasuj”.
• Przycisku nie widać — sprawdź, czy opcja „Pokaż przycisk” jest aktywna oraz czy „Tekst przycisku” nie jest pusty.
• Brak całej sekcji — sprawdź pole „Włącz moduł”.