Style strony kontrolują wygląd wizualny Twoich stron sprzedażowych drop. Styl należy do konta, więc możesz ponownie użyć jednego stylu dla każdego drop lub przechowywać kilka wariantów.
Tworzenie stylu
Przejdź do Settings i otwórz kartę Page Styles, a następnie kliknij Create New Style. Otwiera się pusty formularz stylu. Tu nie ma wyboru ścieżki — zawsze zaczyna się od ustawień domyślnych.
Dwa inne sposoby na uzyskanie stylu bez wypełniania formularza od zera:
- Duplicate — każda karta stylu na liście Page Styles ma przycisk Duplicate. Klonuje styl jako „nazwa (Copy)", który następnie edytujesz.
- Extract from a website — ta opcja znajduje się tylko w kroku Page Design kreatora drop, nie w obszarze Page Styles. Zobacz How to extract styles from a website.
Najpierw nadaj stylowi Style Name. Nazwy muszą być unikalne; znacznik wyboru lub krzyżyk obok pola wskazuje, czy nazwa jest już zajęta.
Formularz (trzy karty)
Formularz ma trzy karty: Colors, Typography i Buttons. Nie ma okienka podglądu na żywo — tylko mały miniaturka Twojego przesłanego logo.
Colors
Kolory są pogrupowane:
- Core — Background, Text.
- Buttons — Background, Text.
- Secondary — Secondary, Secondary Text (panele, sekcje, obszary wyróżnione).
- Accent — jeden kolor akcentu do wyróżnień.
- Muted — Muted, Muted Text (subtelne tła, stany wyłączone).
- Other Elements — Border, Timer Background, Timer Text.
- Logo — Logo Color, plus przycisk Logo Background (ciemna warstwa za logo). Gdy jest włączony, ustawiasz jego kolor, przezroczystość, padding i styl rogu (kwadratowy lub zaokrąglony).
Każdy kolor otwiera selektor po kliknięciu jego próbki.
Typography
- Font Sizes — Display, Heading, Subheading, Body, Caption. Każda jest polem tekstowym, więc możesz użyć rem, px lub wyrażenia
clamp(). - Font Weights — Display, Heading, Body, każda 100–900 (400 normalnie, 700 pogrubienie).
- Font Families — Heading Font i Body Font, wybierane z ustalonej listy (Inter, Arial, Helvetica, Georgia, Times New Roman, Verdana).
Tutaj nie ma kontroli border-radius.
Buttons
Pomimo nazwy, ta karta zawiera stylowanie przycisków oraz ustawienia hero, logo i produktów.
- Button Appearance — Shape (Rounded / Square / Pill), Style (Solid / Ghost), Rollover State (Darken / Brighten na hover).
- Hero Layout — Vertical Alignment (Top / Bottom / Center) i Horizontal Alignment (Left / Center).
- Logo Image — prześlij obraz logo i ustaw jego szerokość.
- Product Display — Preview Images (Artwork / Product / Staging Shot), Thumbnails (Artwork / Product) i Default Selected product (Smallest / Largest).
- Additional Options — przełączniki dla Header Downward Arrow (z niestandardowym tekstem), Low Inventory Warning (z niestandardowym tekstem) i Shipping Cost Display (koszty dla USA/Kanada/Europa i reszty świata).
Zapisywanie
Kliknij Create Style w górnym prawym rogu. (Podczas edycji istniejącego stylu przycisk nosi nazwę Update Style.) Styl jest zapisywany w bibliotece Page Styles i staje się możliwy do wybrania w kroku Page Design każdego kreatora drop.
Edycja później
Przejdź do Settings → Page Styles, kliknij przycisk Edit stylu, wprowadź zmiany i kliknij Update Style. Szczegóły znajdziesz w artykule How to edit a Page Style.