Průvodce Divi šablonou: Nastavení a možnosti sekce Přizpůsobit

V druhém návodu se série článků o šabloně Divi se detailněji podíváme na možnosti nastavení sekce Přizpůsobit. Do této sekce se dostanete tak, že se přihlásíte do WordPress administrace a v levém menu vyberete Vzhled -> Přizpůsobit.

Celá struktura Divi nastavení v Přizpůsobit je:

• Hlavní nastavení
  • Nastavení rozvržení
  • Typografie
  • Pozadí
• Hlavička a Navigace
  • Formát hlavičky
  • Primární lišta menu
  • Sekundární lišta menu
  • Nastavení fixované navigace
  • Prvky hlavičky
• Patička
  • Rozvržení
  • Widgety
  • Prvky patičky
  • Menu patička
  • Spodní lišta
• Tlačítka
  • Styl tlačítek
  • Styl tlačítek při přejetí myši
• Blog
  • Příspěvek
• Mobilní styly
  • Tablet
  • Telefon
  • Mobilní menu
• Barevná schémata

Ostatní položky, které v nastavení Přizpůsobit najdete se týkají nastavení samotného WordPress nebo je sem mohou umisťovat pluginy.

Přizpůsobit: Hlavní nastavení

Hlavní nastavení obsahuje tři sekce Nastavení rozvržení, Typografie a Pozadí.

Nastavení rozvržení

POVOLIT OHRANIČENÉ ROZVRŽENÍ – zaškrtnutím nebude web od kraje ke kraji, ale objeví se ohraničení šířky těla stránky.

ŠÍŘKA OBSAHU WEBU – nastavení v px, kde definujete šířku těla stránky.

MEZERY MEZI SLOUPCI WEBU – výchozí nastavení mezery mezi sloupci Divi builderu.

VLASTNÍ ŠÍŘKA POSTRANNÍHO PANELU – zaškrtnutím umožníte změnit šířku postranního panelu (šířka se udává v %).

VÝŠKA SEKCE – výchozí nastavení odsazení sekce.

VÝŠKA ŘÁDKU – výchozí nastavení odsazení řádku.

BARVA ZVÝRAZNĚNÍ – definovaní výchozí barvy stránky, která se poté automaticky nastaví na spoustu prvků (například ikona menu na menších zařízeních).

Typografie

VELIKOST TEXTU V OBSAHU – velikost základního písma obsahu.

VÝŠKA ŘÁDKŮ V OBSAHU – výška řádky základního písma (hodnota je zadávána v em).

VELIKOST TEXTU V HLAVIČCE – velikost nadpisu. Definuje se velikost H1, ostatní písma z toho vycházejí.

MEZERY MEZI ZNAKY V HLAVIČCE

VÝŠKA ŘÁDKU V HLAVIČCE – výška řádku nadpisů (hodnota je zadávána v em).

STYL PÍSMA V HLAVIČCE – můžete nastavit tučně, italic, kapitálky nebo podtržení.

PÍSMO V ZÁHLAVÍ – volba písma pro nadpisy.

PÍSMO TEXTU V OBSAHU – volba písma pro text.

BARVA ODKAZU V OBSAHU

BARVA PÍSMA V OBSAHU – nastavení barvy textu.

BARVA TEXTU HLAVIČKY  – nastavení barvy nadpisů.

Pozadí

BARVA POZADÍ – nastavení barvy pozadí (sekce v Divi builderu mají pozadí nastavené na bílou, tak že je třeba jej upravit, pokud chcete toto nastavení používat skutečně všude).

OBRÁZEK POZADÍ – možnost nastavení obrázku na pozadí.

Přizpůsobit: Hlavička a navigace

Hlavička a navigace obsahuje následující položky Formát hlavičky. Primární lišta menu, Sekundární lišta menu, Nastavení fixované navigace a Prvky hlavičky.

Formát hlavičky

STYL ZÁHLAVÍ – nastavení základního zobrazení hlavičky (zarovnání na střed, výchozí, centrované s logem v menu…).

POVOLIT VERTIKÁLNÍ NAVIGACI – zaškrtnutím změníte horizontální menu na vertikální.

AŽ DO POSUNU SKRÝT NAVIGACI – zaškrtnutím nastavíte, že se menu zobrazí až při posunu dolu na stránce.

Primární lišta menu

ROZTÁHNOUT NA PLNOU ŠÍŘKU – zaškrtnutím nastavíte menu od kraje ke kraji prohlížeče.

SKRÝT OBRÁZEK LOGA – zaškrtnutí skryje obrázek loga.

MENU VÝŠKA – výška menu v px.

LOGO MAX VÝŠKA – maximální výška loga v %.

VELIKOST TEXTU – velikost položek menu v px.

MEZERY MEZI PÍSMENY – mezery mezi písmeny položek menu v px.

PÍSMO – styl písma pro menu.

STYL PÍSMA – můžete nastavit tučně, italic, kapitálky nebo podtržení.

BARVA TEXTU – barva položky v menu.

BARVA AKTIVNÍHO ODKAZU  – barva aktivní položky v menu.

BARVA POZADÍ – barva pozadí lišty menu.

BARVA POZADÍ VYSOUVACÍHO MENU

BARVA ČAR VYSOUVACÍHO POZADÍ

BARVA TEXTU VYSOUVACÍHO MENU

ANIMACE VYSOUVACÍHO MENU

Sekundární lišta menu

ROZTÁHNOUT NA PLNOU ŠÍŘKU – zaškrtnutím nastavíte zobrazení horní lišty od kraje ke kraji prohlížeče.

VELIKOST TEXTU – velikost položek v px.

MEZERY MEZI PÍSMENY – mezery mezi písmeny položek menu v px.

PÍSMO – styl písma pro lištu.

STYL PÍSMA – můžete nastavit tučně, italic, kapitálky nebo podtržení.

BARVA POZADÍ – barva pozadí horní lišty.

BARVA TEXTU – barva textu v horní liště.

BARVA POZADÍ VYSOUVACÍHO MENU

BARVA TEXTU VYSOUVACÍHO MENU

ANIMACE VYSOUVACÍHO MENU

Nastavení fixované navigace

SKRÝT OBRÁZEK LOGA – zaškrtnutí skryje obrázek loga.

PEVNÁ MENU VÝŠKA – nastavení výšky fixované navigace.

VELIKOST TEXTU – velikost textu v px.

BARVA POZADÍ PRIMÁRNÍHO MENU

BARVA POZADÍ SEKUNDÁRNÍHO MENU

PRIMÁRNÍ MENU BARVA ODKAZU – barva položky v primárním menu.

DRUHÁ NABÍDKA BARVA ODKAZU– barva položky v horním menu.

AKTIVNÍ PRIMARY MENU BARVA ODKAZU – barva aktivní položky v primárním menu.

Prvky hlavičky

ZOBRAZIT SOCIÁLNÍ IKONY – zaškrtnutím povolíte zobrazení sociálních ikon v sekundární liště.

ZOBRAZIT IKONU VYHLEDÁVÁNÍ – zaškrtnutím povolíte zobrazení ikony vyhledávání v hlavičce.

TELEFONNÍ ČÍSLO – do pole můžete vložit telefonní číslo, které se zobrazí v hlavičce stránky.

E-MAILOVÁ ADRESA  – do pole můžete vložit e-mail, který se zobrazí v hlavičce stránky.

Přizpůsobit: Patička

Patička obsahuje následující položky Rozvržení, Widgety, Prvky patičky, Menu patička a Spodní lišta.

Rozvržení

ROZVRŽENÍ SLOUPCŮ – nastavení rozvržení míst pro widgety v patičce

BARVA POZADÍ ZÁPATÍ – nastavení barvy pozadí pod widgety v patičce.

Widgety

VELIKOST TEXTU V HLAVIČCE – velikost nadpisu widgetu v patičce (v px).

STYL PÍSMA V HLAVIČCE – můžete nastavit tučně, italic, kapitálky nebo podtržení pro nadpis widgetu.

VELIKOST ODKAZU V OBSAHU – velikost odkazu ve widgetu (v px).

VÝŠKA ŘÁDKU ODKAZU V OBSAHU – výška řádky texu ve widgetu (v em).

STYL PÍSMA V OBSAHU – můžete nastavit tučně, italic, kapitálky nebo podtržení pro text widgetu.

BARVA PÍSMA WIDGETU

BARVA ODKAZU WIDGETU

BARVA HLAVIČKY WIDGETU – barva nadpisu widgetu v patičce.

BARVA ODSAZUJÍCÍCH TEČEK WIDGETU – barva teček při použítí seznamu ve widgetu.

Prvky patičky

ZOBRAZIT SOCIÁLNÍ IKONY – zaškrtnutím zobrazíte ikony sociálních sítí v patičce.

Menu patička

BARVA POZADÍ MENU V PATIČCE

BARVA TEXTU MENU V PATIČCE

BARVA AKTIVNÍHO ODKAZU MENU V PATIČCE

MEZERY MEZI PÍSMENY – mezery mezi písmeny položek menu v px.

STYL PÍSMA – můžete nastavit tučně, italic, kapitálky nebo podtržení pro položky menu v patičce.

VELIKOST PÍSMA – velikost písma položek menu v patičce.

Spodní lišta

BARVA POZADÍ – barva pozadí spodní lišty patičky.

BARVA TEXTU – barva textu ve spodní liště patičky.

STYL PÍSMA – můžete nastavit tučně, italic, kapitálky nebo podtržení pro spodní lištu v patičce.

VELIKOST PÍSMA – velikost písma pro text ve spodní liště patičky v px.

VELIKOST IKON SOCIÁLNÍCH SÍTÍ – velikost ikon v px.

BARVA IKON SOCIÁLNÍCH SÍTÍ

DISABLE FOOTER CREDITS – zaškrtnutím deaktivujete zobrazení textu v patičce.

EDIT FOOTER CREDITS – pole pro zadání vlastního textu do spodní lišty patičky.

Přizpůsobit: Tlačítka

Tlačítka obsahují následující položky Styl tlačítek a Styl tlačítek při přejetí myši.

Styl tlačítek

VELIKOST TEXTU – velikost textu tlačítka v px.

BARVA TEXTU – barva textu tlačítka.

BARVA POZADÍ – barva pozadí tlačítka.

ŠÍŘKA RÁMEČKU – šířka rámečku tlačítka.

BARVA RÁMEČKU – barva rámečku tlačítka.

RADIUS RÁMEČKU – rádius zaoblené rohu tlačítka v px.

MEZERY MEZI PÍSMENY – mezery mezi písmeny tlačítka v px.

STYL PÍSMA TLAČÍTKA – pro tlačítko můžete nastavit tučně, italic, kapitálky nebo podtržení.

PÍSMO TLAČÍTKA – nastavení druhu písma pro tlačítko.

PŘIDAT IKONU DO TLAČÍTKA  – definuje o přidání ikony k textu tlačítka.

VYBRAT IKONU – výběr ikony tlačítka.

BARVA IKONY  – barva ikony tlačítka.

UMÍSTĚNÍ IKONY – definuje umístění ikony u tlačítka.

ZOBRAZIT IKONU POUZE PŘI PŘEJETÍ MYŠÍ – definuje zda bude ikona viditelná pořád nebo jen při přejetí myší.

Styl tlačítek při přejetí myši

BARVA TEXTU – barva textu tlačítka při přejetí myší.

BARVA POZADÍ – barva pozadí tlačítka při přejetí myší.

BARVA RÁMEČKU – barva rámečku tlačítka při přejetí myší.

RADIUS RÁMEČKU – rádius zaoblené rohu tlačítka při přejetí myší v px.

MEZERY MEZI PÍSMENY – mezery mezi písmeny tlačítka při přejetí myší v px.

Přizpůsobit: Blog

Blog obsahuje pouze nastavení pro Příspěvek.

Příspěvek

VELIKOST META TEXTU – velikost písma meta informací v px.

VÝŠKA META ŘÁDKU – výška řádky textu meta informací v em.

MEZERY MEZI META ZNAKY – mezery mezi písmeny v meta informacích v px.

STYL META PÍSMA – můžete nastavit tučně, italic, kapitálky nebo podtržení pro meta informace.

VELIKOST TEXTU V HLAVIČCE – velikost nadpisu příspěvku v px.

VÝŠKA ŘÁDKU V HLAVIČCE – výška řádku nadpisu příspěvku v em.

MEZERY MEZI ZNAKY V HLAVIČCE – nastavení mezery mezi písmeny v nadpisu příspěvku v px.

STYL PÍSMA V HLAVIČCE – můžete nastavit tučně, italic, kapitálky nebo podtržení pro nadpis příspěvku.

Přizpůsobit: Mobilní styly

Mobilní styly obsahují nastavení pro Tablet, Telefon a Mobilní menu.

Tablet

VÝŠKA SEKCE – nastavení odsazení sekce pro tablet v px.

VÝŠKA ŘÁDKU– nastavení odsazení řádku pro tablet v px.

VELIKOST TEXTU V OBSAHU – nastavení velikosti textu pro tablet.

VELIKOST TEXTU V HLAVIČCE – nastavení velikosti nadpisu pro tablet.

Telefon

VÝŠKA SEKCE – nastavení odsazení sekce pro telefon v px.

VÝŠKA ŘÁDKU– nastavení odsazení řádku pro telefon v px.

VELIKOST TEXTU V OBSAHU – nastavení velikosti textu pro telefon .

VELIKOST TEXTU V HLAVIČCE – nastavení velikosti nadpisu pro telefon .

Mobilní menu

SKRÝT OBRÁZEK LOGA – zaškrtnutím skryjete logo na telefonu.

BARVA TEXTU – barva textu menu na telefonu.

BARVA POZADÍ – barva pozadí hlavičky na telefonu.

Přizpůsobit: Barevná schémata

Divi obsahuje pět výchozí předdefinovaných barevných schémat, ze kterých si můžete vybrat.

Barvy jsou:

• Modrá (výchozí)
• Zelená
• Oranžová
• Růžová
• Červená