Blok z efektem parallax

Sekcja z efektem paralaksy: zdjęcie tła przesuwa się wolniej niż treść podczas scrollowania. Własny tytuł, edytor WYSIWYG, przycisk CTA, jasne lub ciemne tło, pełna szerokość ekranu.

Dlaczego Twoim klientom to się spodoba?

Efekt paralaksy to jeden z tych elementów które sprawiają że strona sklepu wygląda nowocześnie i profesjonalnie. Zdjęcie tła przesuwające się wolniej niż treść podczas scrollowania tworzy głębię i dynamikę - strona ożywa zamiast być statyczną listą produktów.

Sekcja z paralaksą przyciąga wzrok i wyróżnia ważne komunikaty marketingowe, promocje lub przekierowania do kolekcji.

Jakie posiada możliwości?

Moduł tworzy sekcję z efektem paralaksy i treścią nad zdjęciem:

• - Tytuł sekcji nad treścią,
• - Treść z edytora WYSIWYG - dowolny HTML, formatowanie, linki,
• - Opcjonalny przycisk CTA z własnym linkiem i własnym tekstem,
• - Wyśrodkowanie całej zawartości sekcji,
• - Zdjęcie tła z efektem paralaksy (zalecany rozmiar 1920×820 px),
• - Wybór jasnego lub ciemnego tła - automatyczna zmiana koloru czcionki dla czytelności,
• - Tryb pełnej szerokości ekranu,
• - Możliwość dodania własnej klasy CSS,
• - Obsługa tłumaczeń PL/EN dla tytułu, treści, linku i tekstu przycisku.
• - własny identyfikator HTML (kotwica do przewijania strony) oraz własna klasa CSS do niestandardowego stylowania.

Korzyści dla Ciebie (Sprzedawcy)

Sekcja z paralaksą podnosi wizualną jakość sklepu bez kodowania:

• - Nowoczesny wygląd: efekt paralaksy jest charakterystyczny dla profesjonalnych stron e-commerce i wyróżnia sklep na tle konkurencji,
• - Elastyczne zastosowanie: sekcja sprawdza się jako baner promocyjny, wyróżnienie kolekcji, sekcja "o nas" lub dowolny storytellingowy blok,
• - Pełna kontrola treści: tytuł, WYSIWYG i przycisk CTA - możesz przekazać każdy komunikat marketingowy,
• - Bez kodowania: efekt paralaksy jest wbudowany - wystarczy wgrać zdjęcie i wpisać treść.

Co zyska Twój klient?

Klient przeglądający sklep z sekcją paralaksy:

• - Wizualne wrażenie: efekt głębi przy scrollowaniu sprawia że strona jest bardziej angażująca,
• - Szybką nawigację: przycisk CTA prowadzi bezpośrednio do oferty lub strony docelowej,
• - Czytelną treść: automatyczne dopasowanie koloru tekstu do jasnego lub ciemnego tła gwarantuje czytelność niezależnie od zdjęcia.

Jak to działa? (3 proste kroki)

Krok 1: Instalacja: Zainstaluj moduł z Shoper AppStore i umieść go w wybranym miejscu w edytorze SVE.

Krok 2: Konfiguracja: Wgraj zdjęcie tła (zalecane 1920×820 px) i wybierz czy jest jasne czy ciemne. Wpisz tytuł i treść w edytorze WYSIWYG. Opcjonalnie włącz przycisk CTA i wpisz link oraz tekst.

Krok 3: Działa automatycznie: Podczas scrollowania strony zdjęcie tła przesuwa się wolniej niż treść tworząc efekt paralaksy. Treść i przycisk pozostają czytelne na tle zdjęcia.

Najczęściej zadawane pytania (FAQ)

Jaki rozmiar zdjęcia tła jest zalecany?
Zalecany rozmiar to 1920×820 px. Mniejsze zdjęcie może wyglądać rozciągniętie lub pikselowato na dużych ekranach.

Czy efekt paralaksy działa na urządzeniach mobilnych?
Na urządzeniach mobilnych efekt paralaksy jest zazwyczaj uproszczony lub wyłączony ze względu na ograniczenia przeglądarek mobilnych - zdjęcie tła wyświetla się statycznie. Treść i przycisk CTA działają normalnie na wszystkich urządzeniach.

Jak sprawić żeby tekst był czytelny na ciemnym zdjęciu?
W ustawieniach modułu wybierz opcję "Tło jest ciemne" - moduł automatycznie zmieni kolor czcionki na biały dla lepszej czytelności.

Dodatkowe informacje

Moduł jest przeznaczony do szablonu Storefront.

Instrukcja modułu

Jeśli chcesz zobaczyć jakie inne aplikacje/moduły aktualnie oferujemy w sprzedaży w sklepie shoper - kliknij tutaj

Działanie przedstawionego modułu można zobaczyć w demo naszego szablonu Avant Storefront oraz można kupić gotowy szablon z wieloma innymi modułami dostępnymi w cenie szablonu.

Demo szablonu Avant Storefront