Nastavení barev, písma a rozložení

Na záložce Vzhled webu nastavte barvy, písma, velikosti textu a zaoblení rohů jednou pro všechny stránky najednou.

Vzhled webu obsahuje nastavení, díky kterému celý e-shop vypadá jako jedna značka: jeho barvy, písma, velikosti textu a zaoblení rohů. Každé nastavení nastavíte jednou a každá stránka se podle něj řídí. Jednotlivé bloky mohou tato nastavení přepsat, pokud to potřebujete.

Otevření vzhledu webu

  1. Otevřete editor. Viz Editor na první pohled.
  2. V panelu nastavení vpravo klikněte na záložku Vzhled webu.
  3. Kliknutím na nadpis jej otevřete: Identita, Barvy, Typografie nebo Rozložení.

Změny se na stránce zobrazí ihned a ukládají se automaticky. Váš živý e-shop se změní, až jej publikujete.

Barvy

Otevřete Barvy, kde uvidíte sedm barev, ze kterých se skládá každá stránka.

Skupina Barvy v Vzhledu webu s barvami Zvýraznění, Text na zvýraznění, Pozadí stránky, Povrch, Text, Druhořadý text a Ohraničení a zprávou, že všechny dvojice barev se dobře čtou
  • Zvýraznění: hlavní barva vašeho e-shopu. Tlačítka a odkazy ji používají.
  • Text na zvýraznění: barva slov na zvýraznění, například popisku tlačítka.
  • Pozadí stránky: barva za vašimi stránkami.
  • Povrch: barva karet a panelů, například karet produktů a formulářů.
  • Text: barva nadpisů a dalšího hlavního textu.
  • Druhořadý text: tlumenější barva pro odstavce, popisy a drobný text.
  • Ohraničení: barva tenkých čar a obrysů.

Výběr barvy

  1. Klikněte na políčko barvy.
  2. Ve výběru barev, který se otevře, proveďte kteroukoli z těchto akcí:
    • Kliknutím nebo tažením ve velkém čtverci nastavte jas a sytost barvy. Pásek pod ním tažením změní samotný odstín.
    • Do políčka napište nebo vložte hex kód, například #2B2622.
    • Kliknutím na vzorek v části Barvy motivu znovu použijete barvu, kterou už máte, nebo vzorek v části Nedávné použijete barvu, kterou jste nedávno vybrali.
    Výběr barev otevřený pod Zvýrazněním, s čtvercem barev, pásem odstínů, políčkem pro hex kód, barvami motivu a jednou nedávnou barvou
  3. Výběr zavřete kliknutím kamkoli mimo něj nebo stiskem klávesy Esc.

Ověření čitelnosti textu

Pod sedmi barvami Payly kontroluje, zda je každá barva textu dobře čitelná na barvě pozadí, na které stojí. Pokud je vše v pořádku, uvidíte Všechny dvojice barev se dobře čtou. Pokud je některá dvojice příliš slabá, seznam ji pojmenuje, ukáže její kontrastní poměr a potřebnou hodnotu a nabídne tlačítko Opravit, které barvu textu upraví za vás.

Upozornění na kontrast se seznamem Druhořadý text na stránce a Druhořadý text na kartách, každé s poměrem a tlačítkem Opravit

Payly vám výběr dvojice s nízkým kontrastem nezakáže, ale světle šedý text na světlém pozadí se špatně čte, zvlášť na telefonu na slunci.

Typografie

Otevřete Typografie, kde vyberete písma a velikosti textu.

Skupina Typografie s položkami Písmo textu, Základní velikost písma, Výška řádku textu, Písmo nadpisů, Velikost nadpisů, Tloušťka nadpisů a Mezery mezi písmeny nadpisů
  • Písmo textu: písmo pro odstavce, menu a tlačítka.
  • Základní velikost písma: velikost běžného textu.
  • Výška řádku textu: mezera mezi řádky textu. Větší číslo dá více místa.
  • Písmo nadpisů: písmo pro nadpisy. Zvolte Použít písmo webu, pokud chcete pro nadpisy použít také písmo textu.
  • Velikost nadpisů: zvětší nebo zmenší všechny nadpisy, v procentech.
  • Tloušťka nadpisů: jak tučné jsou nadpisy.
  • Mezery mezi písmeny nadpisů: zúží nebo rozšíří mezery mezi písmeny v nadpisech.

Výběr písma

  1. Klikněte na políčko Písmo textu nebo Písmo nadpisů.
  2. Procházejte seznam, který zobrazuje každý název jeho vlastním písmem. Skupina Doporučené nahoře obsahuje písma, která se hodí pro většinu e-shopů.
    Seznam písem s vyhledávacím polem a skupinou Doporučené: Inter, DM Sans, Work Sans, Manrope a další
  3. Chcete-li písmo najít podle názvu, napište do pole Hledat písma….
  4. Kliknutím na písmo je použijete.

Seznam pokrývá celou knihovnu Google Fonts. Písma, která použijete, se při publikování zahrnou do vašeho e-shopu. Pokud písmo v seznamu chybí, napište jeho přesný název z Google Fonts do vyhledávacího pole a vyberte jej pod volbou Použít i tak.

Rozložení

Otevřete Rozložení, kde najdete dvě nastavení:

  • Zaoblení rohů určuje, jak zaoblené jsou rohy tlačítek, karet a obrázků. Posuňte na 0 pro ostré rohy a doprava pro měkké. Bloky, jejichž vlastní zaoblení rohů je Automaticky, se tímto nastavením řídí.
  • Směr textu je u většiny jazyků Zleva doprava. Volba Zprava doleva otočí celé rozložení pro arabštinu, hebrejštinu, perštinu a urdštinu.

Identita

Otevřete Identitu a nastavte Ikonu prohlížeče, malý obrázek, který se zobrazuje na záložce prohlížeče. Použijte jednoduchou značku místo celého loga, protože se zobrazuje přibližně v rozměru 16 pixelů. Klikněte na Nahrát obrázek nebo Procházet nahrávky, jak je popsáno v článku Přidání obrázků a použití knihovny médií. Pokud pole necháte prázdné, použije se vaše logo.

Vaše logo tady není. Je v záhlaví, kde se také zobrazuje. Viz Úprava záhlaví a zápatí.

Změna jen jednoho bloku

Každý textový blok, nadpis a tlačítko může přepsat písmo, velikost a barvy webu. Vyberte blok a otevřete jeho skupinu Typografie nebo Vzhled. Viz Úprava textu, nadpisů a tlačítek.

Tip: Pokud chcete zcela jiný vzhled, můžete začít znovu z některého z hotových návrhů. Viz Přepnutí na jiný vzhled webu.

Související články

Last updated 2026-10-16