Kde se tato nastavení nacházejí
Branding se nastavuje pro každý trh zvlášť a v rámci trhu ovlivňuje všechny stránky najednou. Otevřete editor, vyberte trh pomocí tlačítka trhů (vlajka státu) v horní části levého postranního panelu a poté otevřete záložku Nastavení (ikona ozubeného kola). Nastavení má své vlastní podzáložky v tomto pořadí: Branding, Barvy, Písma, Rozvržení, Animace, Automatizace, Vstupy, Ikony, Omezení, Pokladna, Formulář pokladny, Stránka údržby, Vlastní CSS a Vlastní Javascript. Změny se vztahují na vybraný trh a projeví se po kliknutí na Publikovat. Přepnutí trhu načte jeho vlastní barvy, písma a rozvržení.
Barevná schémata
Záložka Barvy obsahuje až 9 barevných schémat. Jakmile dosáhnete limitu, karta pro přidání se změní na neaktivní odznak s počtem, například 9/9. Každá sekce, blok a komponenta odkazuje na jedno schéma podle jeho čísla, takže změna barev ve schématu okamžitě upraví vzhled všech sekcí, které jej používají, napříč všemi stránkami. Kliknutím pravým tlačítkem na kartu schématu ji můžete duplikovat nebo smazat.
Role barev v každém schématu
Každé schéma definuje tyto role, všechny jako hexadecimální hodnoty:
- Pozadí: hlavní pozadí sekce.
- Vnitřní pozadí: tónované pozadí pro karty a vnořený obsah v sekci.
- Nadpis: barva textu nadpisů.
- Text: barva odstavců a běžného textu.
- Důležitý text: zvýrazněný text, například ceny a důležité hodnoty.
- Odkazy a Odkazy při najetí: barva odkazů v běžném a najetém stavu.
- Okraj: okraje prvků a dělící čáry.
- Obrys: zvýrazněné obrysy a focus ringy, které musí být výraznější než okraje.
- Stín: barva stínu (obvykle poloprůhledná).
- Primární tlačítko: pozadí, text a okraj, každý má vlastní barvu při najetí (celkem 6 hodnot).
- Sekundární tlačítko: pozadí, text a okraj, každý má vlastní barvu při najetí (celkem 6 hodnot).
- Vstup pozadí, text, okraj a popisek: stylování formulářových polí.
- Vstup při najetí: pozadí pole při najetí myší.
Tipy pro silná schémata
- Ponechte neutrální světlé Pozadí ve většině sekcí a výrazné barvy si schovejte pro jedno akcentní schéma na hero sekci a výzvy k akci.
- Nastavte Pozadí primárního tlačítka tak, aby bylo jasně odlišné od Pozadí sekce, aby tlačítko vyniklo.
- Vnitřní pozadí nastavte jako jemný odstín hlavního Pozadí, aby karty působily odděleně, ale nerušily.
- Snažte se o kontrast alespoň 4,5:1 mezi textem a jeho pozadím.
Písma
Záložka Písma přiřazuje čtyřem rolím vždy jednu rodinu písma:
- Tělo: odstavcový text a popisy.
- Nadpis: všechny nadpisy v obchodě.
- Podnadpis: sekundární názvy a podnadpisy sekcí.
- Akcent: stylové písmo pro ceny, odznaky a dekorativní zvýraznění.
Dostupná písma: Inter, Helvetica, SF Mono, New York, System UI, Roboto, Open Sans, Lato, Montserrat, Poppins, Raleway, Nunito, Merriweather, Playfair Display, Lora, PT Sans, PT Serif, Quicksand, Space Grotesk, DM Sans, Syne, Manrope, Outfit, Urbanist, Oswald, Bebas Neue, Abel, Abril Fatface a Acme. Pro obchody s arabským obsahem je každé písmo automaticky spárováno s odpovídajícím arabským protějškem, takže arabské písmo nemusíte vybírat zvlášť.
Šířka stránky
Záložka Rozvržení obsahuje posuvník Šířka stránky, kterým nastavíte maximální šířku hlavní obsahové mřížky od 900 do 1400 px po krocích po 100 (tedy 900, 1000, 1100, 1200, 1300 nebo 1400; výchozí je 1200). Sekce nastavené na Šířka stránky jsou omezeny tímto rozměrem, sekce nastavené na Celá šířka vždy zabírají celou šířku okna. Na obrazovkách užších než zvolená šířka se sekce zmenší na 100 % šířky obrazovky.
Logo
Logo nastavíte na dvou místech: v bloku Logo v sekci Hlavička a v bloku O nás v patičce. Klikněte na blok a použijte jeho výběr obrázku Logo pro výběr z knihovny médií nebo nahrání nového. Po výběru nastavte zobrazovací Šířku a Výšku (každá 20 až 300 px); druhý rozměr se automaticky přizpůsobí pro zachování poměru stran. Výchozí logo v hlavičce má 120 px na šířku a 50 px na výšku, můžete nastavit jeho vodorovnou pozici (vlevo, na střed nebo vpravo) a vnitřní okraje. Logo v hlavičce standardně odkazuje na domovskou stránku; můžete jej nastavit jako čistě dekorativní vypnutím přepínače Logo odkazuje na domovskou stránku ve skupině Hlavička v záložce Omezení.
Favicon
Favicon nastavíte v záložce Branding. Klikněte na Vybrat favicon a zvolte obrázek PNG, JPEG, WEBP nebo ICO (doporučená velikost 32x32 nebo 16x16 px). Zobrazí se na záložkách prohlížeče a v záložkách oblíbených.
Obrázek pozadí těla
Také v záložce Branding můžete volitelně nastavit Obrázek těla za celý obchod (PNG, JPEG nebo WEBP). Po výběru obrázku se zobrazí dvě možnosti: Velikost (Překrýt vyplní celé okno, případně ořízne; Přizpůsobit zobrazí celý obrázek) a Opakovat (pokud je zapnuto, obrázek se dlaždicově opakuje a posouvá se se stránkou; pokud je vypnuto, jeden obrázek zůstává fixní a obsah se přes něj posouvá). Použijte silně komprimovaný obrázek, aby se stránka načítala rychle.
Vlastní CSS a JavaScript
Pro úpravy, které standardní nastavení neumožňuje, záložky Vlastní CSS a Vlastní Javascript umožňují vložit až 1 000 znaků, které se aplikují a spouští na každé stránce obchodu. Používejte je střídmě. Pro stylování omezené na jednu sekci má každá sekce také svou vlastní záložku Vlastní CSS v ovládacím panelu, což je bezpečnější než pole pro celý web.