[UPDATE] ⭐ Grafiki kafelki v2 [09.2026] ⭐
Grafiki kafelki v2 — instrukcja z kreatorem układu, pełną pomocą LIVE/S, breakpointem Laptop i ustawieniami wyglądu. v07 naprawia obsługę pomocy w statycznej sekcji po lewej: odstępy, ustawienia responsywne, unikalne ID oraz wszystkie pozostałe stałe kontrolki otwierają teraz tooltip i pełny opis.
![Miniatura modułu: [UPDATE] ⭐ Grafiki kafelki v2 [09.2026] ⭐](/crm/uploads/instructions/module-thumbnails/mod_df769b9e0bf7b71c2ac4/thumbnail-979fa6fc5b.png)
Do czego służy moduł?
Grafiki kafelki v2 - GEAR pozwala budować elastyczne siatki banerów / kafelków graficznych. Aktualizacja rozszerza generator o osobny widok Laptop, responsywne odstępy, nowe opcje wyglądu i pozycjonowania oraz dodatkowe ustawienia pojedynczego kafelka.
Kreator nadal obsługuje przeciąganie kafelków, zmianę ich szerokości i wysokości oraz bibliotekę gotowych układów 2–8 banerów. Presety zachowują dotychczasowy kierunek, a układ laptopowy jest automatycznie budowany na bazie wariantu desktopowego i można go później dopracować osobno.
Formularz modułu 1:1 z Shoper / SVE + kreator układu
Najważniejsze zasady działania
- Podgląd ma teraz cztery widoki: Desktop / Laptop / Tablet / Telefon.
- Kliknięcie koła zębatego na kafelku ustawia szerokość i wysokość osobno dla aktywnego urządzenia.
- Możesz włączyć osobny odstęp między kafelkami dla każdego urządzenia.
- Sekcja Wygląd i interakcje steruje zoomem hover, zaokrągleniem, pozycją grafiki oraz boxem z treścią.
- Każdy kafelek może mieć własny ALT, własny kolor ramki hover, link na całym kafelku oraz otwieranie w nowej karcie.
- Gotowe układy 2–8 pozostają dostępne i po załadowaniu generują także kod laptopowy.
Laptop ma osobny breakpoint do 1440 px. Jeżeli w realnym module kod laptopa pozostanie pusty, front dziedziczy układ desktopowy. Tablet działa do 1024 px, a telefon do 768 px. W generatorze możesz przygotować osobny układ dla każdego z tych widoków.
Jak pracować z tą instrukcją?
- Ustaw podstawowe opcje modułu i wgraj grafiki po lewej stronie.
- Jeżeli chcesz szybki start, użyj przycisku Gotowe układy i załaduj preset dla wybranej liczby banerów.
- Doprecyzuj układ przeciągając kafelki na wizualizacji albo zmieniając szerokość / wysokość w dymku ustawień.
- Na końcu skopiuj układ lub przepisz kody grida z lewej strony do docelowego modułu w Shoperze.
Historia aktualizacji
Rozszerzyliśmy moduł o dodatkowe ustawienia responsywne oraz większą kontrolę nad wyglądem i zachowaniem pojedynczych kafelków.
- dodano osobny układ Laptop pomiędzy Desktopem a Tabletem,
- dodano możliwość ustawienia osobnego odstępu między kafelkami dla Desktopu, Laptopa, Tabletu i Telefonu,
- rozbudowano generator układu o osobne kody grida dla Desktop / Laptop / Tablet / Telefon,
- dodano powiększenie grafiki po najechaniu wraz z regulacją skali efektu,
- dodano ustawienie zaokrąglenia kafelków oraz pozycjonowania grafiki w pionie i poziomie,
- rozbudowano box z treścią o wybór pozycji, odstępu od krawędzi, koloru tła i zaokrąglenia,
- dla pojedynczego kafelka dodano tekst ALT grafiki, możliwość użycia własnego koloru ramki hover, ustawienie całego kafelka jako linku oraz otwieranie linku w nowej karcie,
- gotowe układy 2–8 banerów zostały rozszerzone o konfigurację dla widoku laptopowego.