Szablon Flatsome – Multipurpose WooCommerce Theme - 3.20.8

Flatsome to wielozadaniowy motyw WordPress firmy UX-Themes, zaprojektowany pod sklepy WooCommerce. Wyróżnia go wbudowany page builder UX Builder i Header Designer – strony oraz nagłówki powstają metodą przeciągnij i upuść, bez kodowania. Adresowany do właścicieli sklepów, freelancerów i agencji.

UX Builder i Header Designer — wizualne budowanie stron i nagłówka

UX Builder to wbudowany, front-endowy edytor Flatsome. Strony powstają w nim metodą przeciągnij i upuść, z podglądem na żywo, a wynik zapisuje się jako czyste shortcodes w edytorze WordPressa. Razem z Header Designerem do nagłówka i Live Theme Options w Customizerze daje pełną kontrolę nad układem, menu, kolorami i typografią – bez pisania kodu.

Jak działa edytor UX Builder

Edytor UX Builder pracuje bezpośrednio na froncie strony – zmiany widać od razu, dokładnie w tym widoku, jaki zobaczy odwiedzający. Treść składa się z gotowych komponentów. Wystarczy przeciągnąć je na płótno.

• Biblioteka elementów – 30 elementów treści, 9 sklepowych i 5 układu, czyli ponad 40 komponentów wraz z setkami presetów.
• Typy bloków – sekcje, wiersze i kolumny, slidery, banery, przyciski, galerie, ikony, zakładki, akordeony, odliczania oraz mapy.
• Opcje responsywne per urządzenie – osobne ustawienia marginesu, paddingu i liczby elementów w rzędzie dla desktopu, tabletu i telefonu, z podglądem układu w trzech szerokościach.

Header Designer i nagłówek mobilny

Header Designer składa nagłówek z gotowych elementów, metodą przeciągnij i upuść. Lista jest długa: menu z wielokolumnowymi dropdownami, ikona menu off-canvas, formularz wyszukiwania z AJAX live search (z filtrem po kategorii), mini koszyk lub koszyk off-canvas, dropdown konta, element kontaktowy, lista życzeń, ikony społecznościowe oraz własne shortcodes i HTML.

Flatsome tworzy też osobny, zoptymalizowany nagłówek mobilny z nawigacją off-canvas. Menu na telefonie działa niezależnie od wersji desktopowej.

Live Theme Options i system sliderów oraz banerów

Live Theme Options to panel w Customizerze WordPressa, w którym ustawia się globalne kolory, czcionki i układy, z natychmiastowym podglądem. Slidery i banery powstają w tym samym builderze, bez osobnej wtyczki. Funkcja Banner Focus Point wyznacza punkt ostrości obrazu, dzięki czemu baner poprawnie przycina się na tablecie i telefonie.

Funkcje sklepu na stronie kategorii i karcie produktu

Flatsome dokłada do WooCommerce gotowe funkcje sprzedażowe na stronie kategorii i karcie produktu: live search, product quick view, listę życzeń, sale bubble, quick add to cart oraz off-canvas filtering, działające także na telefonie. Na karcie produktu działają warianty z podglądem koloru, galeria pionowa lub pozioma, wideo w lightboxie i powiększenie obrazu.

Strona kategorii — układy, liczba produktów w rzędzie i filtrowanie

• Style listy – siatka (grid), widok listy (list) lub układ masonry, z obsługą dowolnych proporcji obrazu produktu.
• Liczba produktów w rzędzie – ustawiana per rozmiar ekranu, na przykład 4 kolumny na desktopie i 2 na telefonie.
• Off-canvas filtering – wysuwane filtrowanie dostępne także na urządzeniach mobilnych, obok wariantów z lewym, prawym lub ukrytym sidebarem.
• Live Search i Quick View – wyszukiwanie na żywo oraz podgląd produktu otwierany wprost z siatki kategorii.
• Sale Bubble i Quick Add To Cart – trzy style znaczników promocji oraz opcjonalny przycisk dodania do koszyka nad obrazem produktu.

Karta produktu — galeria, warianty z podglądem koloru i wideo

Na karcie produktu Flatsome rozszerza standardowy widok WooCommerce o dodatkowe elementy prezentacji. Obraz aktualizuje się do wybranego wariantu lub koloru, a galerię można ustawić pionowo albo poziomo.

• Product Videos – wideo produktu otwierane w lightboxie.
• Quick Zoom – powiększenie obrazu po najechaniu kursorem.
• Style zakładek – Sections, Tabs, Accordions lub Vertical Tabs, z wieloma układami karty i opcją nagłówka transparentnego.
• Next/Prev navigation – szybkie przechodzenie między kolejnymi produktami.
• Produkty zewnętrzne i afiliacyjne – wbudowana obsługa pozycji External/Affiliate.

Catalogue Mode — prezentacja produktów bez sprzedaży

Catalogue Mode zamienia sklep w katalog bez funkcji zakupu. Tryb ukrywa ceny, podmienia przycisk „dodaj do koszyka” na formularz lub dowolny shortcode i zastępuje koszyk w nagłówku własną treścią. Sprawdza się przy katalogach online i prezentacjach oferty B2B, gdzie zamówienie idzie przez zapytanie, a nie przez kasę WooCommerce.

Gotowe dema i biblioteka Flatsome Studio

Flatsome zawiera około 15 gotowych dem sklepowych – między innymi Classic Shop, Fullscreen Fashion, Mega Shop i Sale Countdown – oraz około 6 dem biznesowych (Agency, Corporate, Booking), importowanych jednym kliknięciem. Biblioteka Flatsome Studio dostarcza gotowe sekcje i layouty do wstawienia w UX Builderze, a kreator Easy Setup Wizard prowadzi przez pierwszą konfigurację.

Dema sklepowe i biznesowe — import jednym kliknięciem

Każde demo to gotowa strona główna wraz z ustawieniami – importuje się ją jednym kliknięciem i traktuje jako punkt startowy. Dema sklepowe obejmują różne style prezentacji, od klasycznych siatek po pełnoekranowe układy fashion i strony z odliczaniem promocji. Dema biznesowe (Agency, Corporate, Freelancer, Booking) pasują do stron firmowych i landing page. Komponenty z różnych dem można mieszać.

Flatsome Studio — gotowe sekcje i layouty do mieszania

Flatsome Studio to internetowa biblioteka pre-zbudowanych sekcji i layoutów, które wstawia się bezpośrednio w UX Builderze. Zamiast budować stronę od pustego płótna, można złożyć ją z gotowych bloków i dopasować treść oraz kolory. Przy powtarzalnych projektach skraca to czas wdrożenia.

Dla kogo Flatsome sprawdza się najlepiej

Flatsome sprawdza się najlepiej u właścicieli małych i średnich sklepów WooCommerce bez umiejętności kodowania, w sklepach z mocną warstwą wizualną (fashion, akcesoria, elektronika) oraz w agencjach i u freelancerów budujących wiele stron klienckich z jednego narzędzia. Mniej pasuje do projektów świadomie opartych na Full Site Editing i do stron stricte blogowych.

Dla kogo Flatsome sprawdza się najlepiej:

• Właściciele małych i średnich sklepów WooCommerce, którzy budują witrynę bez programisty.
• Sklepy fashion, z akcesoriami i elektroniką, z dużym naciskiem na prezentację produktu.
• Freelancerzy i agencje dostarczający wiele stron klienckich z jednego stacku.
• Strony firmowe i katalogi B2B korzystające z Catalogue Mode.

Sklepy fashion, akcesoria i elektronika

Sklepy z mocną warstwą wizualną korzystają z dem sklepowych i rozbudowanych opcji prezentacji produktu. Galerie, quick view, warianty z podglądem koloru oraz sale bubble pokrywają typowe potrzeby branży odzieżowej, akcesoriów i elektroniki – tam, gdzie wygląd oferty wpływa na decyzję zakupową.

Freelancerzy i agencje budujący wiele stron klienckich

Freelancerzy i agencje pracują na jednym znanym stacku: motyw, UX Builder i Flatsome Studio. Wszechstronność (sklep, strona firmowa, blog, portfolio), mieszanie nagłówków, stron i kolorów oraz biblioteka gotowych sekcji pozwalają szybciej dostarczać różne projekty, bez dokupowania osobnego buildera do każdego z nich.

Dla kogo Flatsome nie jest dobrym wyborem

Flatsome ma jasne granice zastosowania – trzeba je znać przed wyborem motywu.

Dla kogo Flatsome nie jest najlepszym wyborem:

• Projekty świadomie oparte na motywach blokowych i Full Site Editing – Flatsome jest motywem klasycznym (Customizer i shortcodes UX Buildera).
• Zespoły, które chcą uniknąć lock-inu buildera – treść opiera się na shortcodes specyficznych dla Flatsome, więc późniejsza zmiana motywu bywa trudna.
• Strony stricte blogowe lub portfolio jako główny cel – lekkie motywy ogólnego przeznaczenia bywają tu wygodniejsze, mimo wbudowanych funkcji bloga i portfolio.
• Bardzo oszczędne środowiska hostingowe bez cache – motyw bywa opisywany jako zasobożerny i zakłada przyzwoity hosting oraz wtyczkę cache.

Integracje z wtyczkami SEO, formularzy i filtrów produktów

Flatsome integruje się z wtyczkami SEO Yoast i Rank Math (Rank Math z natywnymi breadcrumbs i primary category), z Contact Form 7 i MailChimpem do formularzy oraz newslettera, a także z wtyczkami filtrów produktów (FiboFilters) i etykiet (Advanced Woo Labels). Element Blocks pozwala używać bloków Gutenberga wewnątrz motywu, a sam motyw współpracuje z wtyczkami cache.

SEO — Yoast i Rank Math

Motyw jest zgodny z Yoast SEO oraz Rank Math. Rank Math od wersji 3.12 ma natywną integrację z Flatsome – obsługuje breadcrumbs i ustawienie kategorii głównej (primary category). Flatsome jest też optymalizowany pod SEO i rich snippets, co ułatwia poprawne wyświetlanie danych strukturalnych.

Formularze i newsletter — Contact Form 7 oraz MailChimp

Flatsome współpracuje z Contact Form 7 przy budowie formularzy kontaktowych oraz z MailChimpem (przez Contact Form 7) do zapisów na newsletter. Element Newsletter w nagłówku można podpiąć pod większość wtyczek formularzy, więc zapis do listy mailingowej działa wprost z poziomu Header Designera.

Filtry produktów, etykiety i edytor blokowy Gutenberg

Po stronie filtrów produktów potwierdzona jest integracja z FiboFilters – filtry można osadzić w sidebarze, jako panel off-canvas albo nad listą produktów, z dopasowaniem kolorów i breakpointu. Etykiety produktów obsługuje Advanced Woo Labels, działające na blokach Flatsome i w UX Builderze. Element Blocks pozwala dodatkowo używać natywnych bloków Gutenberga wewnątrz motywu.

Flatsome w polskim kontekście — wielojęzyczność i płatności

Flatsome jest motywem przygotowanym do tłumaczenia (translation-ready, w pakiecie pliki .po) i oficjalnie współpracuje z WPML oraz Polylang, więc interfejs i treści można przełożyć na polski (lub przetłumaczyć narzędziem typu Loco Translate). Polskie płatności i kurierów (Przelewy24, PayU, BLIK, InPost) obsługują wtyczki WooCommerce, nie sam motyw – Flatsome wyświetla standardowy koszyk i checkout WooCommerce.

Tłumaczenie na polski (WPML, Polylang, translation-ready)

Motyw dostarcza pliki .po, więc teksty interfejsu można przetłumaczyć na polski. Przy witrynach wielojęzycznych Flatsome oficjalnie wspiera WPML (z dedykowaną stroną zgodności) oraz Polylang – przełącznik języków w nagłówku działa właśnie w oparciu o jedno z tych rozwiązań. Alternatywą do samego tłumaczenia ciągów jest Loco Translate.

Płatności i kurierzy — rola wtyczek WooCommerce, nie motywu

Uwaga dla polskiego sklepu: Flatsome jako motyw nie ma własnych integracji z polskimi bramkami płatności ani kurierami. Przelewy24, PayU, BLIK, Tpay, InPost Paczkomaty, Furgonetka czy DPD podłącza się wtyczkami WooCommerce, które działają niezależnie od motywu. Obsługa waluty PLN oraz formatów cen i dat wynika z ustawień WooCommerce – Flatsome respektuje konfigurację sklepu i wyświetla standardowy koszyk oraz checkout.

Wydajność, wymagania serwerowe i kompatybilność

Flatsome celuje w nowoczesne środowiska serwerowe: rekomendowane PHP 8.1 lub nowsze i co najmniej 256 MB pamięci WordPress (MySQL 5.6+ lub MariaDB 10.1+). Motyw stosuje Smart Lazy Loading obrazów i teł oraz lekki framework CSS/JS, jest w pełni responsywny, wspiera RTL i ponad 700 Google Fonts, działa z aktualnymi wydaniami WooCommerce i współpracuje z edytorem blokowym Gutenberga oraz wtyczkami cache.

Smart Lazy Loading i lekki framework CSS/JS

Smart Lazy Loading wczytuje obrazy i tła dopiero wtedy, gdy są potrzebne, co skraca czas pierwszego renderowania strony. Framework CSS/JS jest minimalizowany, z naciskiem na małe pliki, a animacje CSS i parallax utrzymują się w okolicach 60 klatek na sekundę. Przy większych sklepach producent zaleca wtyczkę cache dla płynnego działania.

Wymagania serwerowe (PHP, pamięć, baza danych, SSL)

Aktualne rekomendacje serwerowe pochodzą z oficjalnej dokumentacji UX-Themes. Poniższa tabela zbiera najważniejsze parametry oraz informacje o kompatybilności motywu.

Kompatybilność z WordPress, WooCommerce, builderami i RTL

Flatsome jest budowany pod WooCommerce i nadpisuje liczne szablony sklepu, deklarując wsparcie najnowszych wydań platformy. Motyw ma własny UX Builder i nie jest projektowany pod zewnętrzne buildery typu Elementor, Divi czy Bricks, natomiast współpracuje z natywnym edytorem blokowym Gutenberga przez element Blocks. Pełne wsparcie RTL, dołączony child theme oraz zgodność z wtyczkami cache uzupełniają warstwę techniczną motywu.

Najczęściej zadawane pytania