Divi: Návod jak s šablonou začít
Napsal: Miroslav Bartík
V kategorii: Šablony
Dne: 8. 11. 2020
Šablonu Divi si můžete zakoupit formou členství na webu Elegant Themes. V rámci tohoto členství dostanete také magazínovou šablonu Extra a dva pluginy. Bloom, plugin určený pro přihlášení k newsletteru a Monarch, plugin pro sdílení obsahu na sociálních sítích.
Úvodní stránka » Divi: Návod jak s šablonou začít
Potřebný čas k přečtení: ( Počet slov: )
V tomto příspěvku z kategorie Šablony bych vám rád vysvětlil, jak s šablonou Divi začít a jak v divi builderu vytvářet obsah. Pokud si zrovna s tímhle tématem nevíte rady, jste začátečník a šablonu jste si čerstvě zakoupili, pohodlně se usaďte a dočtěte příspěvek do konce.
Tak s chutí do toho.

Licence šablony Divi

Autory šablony Divi jsou lidé z Elegat Themes
Šablonu Divi si můžete zakoupit formou členství na webu Elegant Themes. V rámci tohoto členství dostanete také magazínovou šablonu Extra a dva pluginy. Bloom, plugin určený pro přihlášení k newsletteru a Monarch, plugin pro sdílení obsahu na sociálních sítích.
Členství má tedy i díky těmto pluginům mnohem větší hodnotu, než by se mohlo zdát. Proto si myslím, že cena 89$/rok je naprosto adekvátní k obsahu, který dostanete. 
Pro ty, co plánují tvorbu webů formou práce na volné noze nebo nechtějí každý rok řešit licenci svého webu, je určena lifetime licence v hodnotě 249$. V případě pořízení lifetime licence pak můžete generovat další licenční klíče pro další, pozdější projekty.

Instalace šablony Divi

Doporučuji si k šabloně Divi nainstalovat také Child šablonu
Šablona Divi se instaluje ručně, protože se nenachází v repozitáři šablon. To znamená, že si z účtu na Elegant Themes stáhnete aktuální verzi souboru .zip a přes administraci svého webu nainstalujete šablonu. 
Pokud jste zakoupili nebo získali licenční klíč v rámci vaší společné práce na projektu od webdesignéra, požádejte jej o aktuální instalační soubor.
Po úspěšné instalaci doporučuji přejít do  Divi > Nastavení šablony, přepnout se na poslední záložku s názvem Aktualizace a zadat registrační údaje
Jako další krok doporučuji instalaci Child šablony, aby jste v případě potřeby mohli šablonu neomezeně upravovat bez ztráty vlastních kódů při aktualizaci šablony.

Potřebujete vlastní Divi Child šablonu? Vzužijte tu, kterou jsem pro vás vytvořil já >>>>

Pokud si nevíte rady s instalací šablony, přečtěte si předchozí příspěvek s názvem Jak vybrat a nainstalovat šablonu, který se tomuto tématu podrobně věnuje.

Tvorba obsahu v Divi – stránka

Prvním krokem při tvorbě obsahu s šablonou Divi je vytvoření stránky v administraci samotného redakčního systému WordPress.

To uděláme tak, že v levém hlavním panelu přejdeme na položku Stránky > Vytvořit stránku. Tu si pojmenujeme a pod polem pro zadání názvu si můžeme vybrat, zda chceme stránku a její obsah vytvářet/editovat v editoru šablony Divi (1), nebo v blokovém editoru Gutenberg (2).

Divi má tři možné způsoby tvorby stránek/příspěvků

V následujícím dialogu si vybereme, jakým způsobem chcete obsah vytvořit. Na výběr jsou tři možnosti:

  1. Stavět od začátku – tato možnost vám umožní začínat tzv. s čistým plátnem. To znamená, že si určíte rozložení sekcí, sloupců a modulů sami, bez jakékoliv pomoci.
  2. Zvolte rozložení – s touto možností si můžete do dané stránky načíst kompletně celé rozvržení/layout, které autoři šablony vytváří v rámci členství Elegant Themes. Přehled dostupných layoutů/rozvržení najdete na jejich webu.
  3. Klonujte stávající stránku – jak název napovídá, s touto volbou si můžete jednoduše vytvořit kopii stránky, kterou již na webu máte a u které již máte hotový obsah/layout.
Divi editor má mnoho nastavení, ale jednoduše pochopitelné.

Abych mohl lépe ilustrovat, jak se s šablonou vytváří obsah, zvolil jsem první možnost a přešel k obrazovce s editací. Zde je několik položek, u kterých se zastavíme:

  1. Sekce (modrá) – sekce jsou hlavní oddíly stránky a v editoru jsou zvýrazněny modrou barvou
  2. Řádek (zelená) – řádky se vkládají do cekcí a obsahují jednotlivé obsahové moduly.
  3. Modul (šedá) – modul určuje, co se v jednotlivých řádcích/sekcích zobrazuje. To znamená např. obrázek, text atd.
  4. Přidání obsahu – sekce, řádky i moduly se do stránky/příspěvku vkládají s pomocé tzv. plus, které je odlišeno právě barvou.
  5. Nastavení editoru – editor divi si můžete nastavit podle svých představ. Najdete zde například volbu pro vypnutí efektů v editoru nebo zobrazení náhledů v mobilních zařízeních nebo tabletu.
  6. Možnosti stránky a práce s ní – zde se nachází důležitá funkce, a tou je Historie úprav. V ní se můžete vrátit až o deset kroků zpět. Pak zde můžete celý obsah uložit do Divi knihovny nebo celý obsah smazat či přenést na jiný web s šablonou Divi (export přes soubor .json).
  7. Vyhledávání, vrstvy a nápověda a možnosti ukládání – zde si můžete vzhledávat v nápovědě nebo funkcích editoru. Velmi užitečnou funkcí jsou zde vrstvz (Layers), která přehledně ukazuje každou sekci, řádek i modul v přehledných vnořených seznamech. A v neposlední řadě je zde zelené tlačítko pro ukládání změn (nebo modré v případě, že se jedná o kocept stránky/příspěvku).
Nastavení modulu v divi editoru

Poté, co si zvolíte modul, který chcete do obsahu vložit, objeví se vám následně okno s natavením modulu. Pro tuto ukázku jsem zvolil modul upotávka.

Každé okno nastavení modulů má tři důležité části:

  1. Obsah (2) – zde se určuje veškerý obsah modulů, to jest texty, obrázky, ikony atd.
  2. Návrh (3) – na této kartě určujete, jak se obsah modulů bude zobrazovat, to jest jakým písmem bude vzkreslen nadpis, jakou bude mít barvu atd.
  3. Pokročilé (4) – zde máte možnost nastavit si vlastní css styly, určit si, v jakém zařízení bude modul viditelný či neviditelný nebo nastavit použití Scroll Effects.

Pokud nechcete procházet kompletně celé nastavení modulu a chcete si v rzchlosti nastavit pouze nadpis a popisek, stačí kliknout v obsahu na editační ikonku (1). Ta vás přenese přímo k daným volbám. Pokud jste s nastavením modulu spokojeni, stačí návrh uložit s pomocí zeleného tlačítka (5) na spodní straně nastavení modulu.

Po úpravě nastavení modulu Upotávka může obsah  vypadat například takhle..

Tvůrce motivů

Tvůrce motivů v šablone Divi slouží k nastavení šablon u jednotlivých stránek a příspěvků webu. Můžete si zde nastavit jak globální záhlaví a zápatí, ale také šablony pro jednotlivé stránky/příspěvky bez závislosti na globální nastavení.

Nastavují se zde také stránky kategorií, archivů nebo třeba stránka 404 nebo stránka výsledků vzhledávání

Pro přidání nové šablony stačí kliknout na prázdné pole s pluskem. V následujícím kroce si nastavíte, pro ktero stránku/příspěvek je daná šablona platná. Nutno dodat, že stránka/příspěvek, pro kterou chceme šablonu stanovit již musí existovat a musí být zveřejněna (ne v režimu konceptu).

Jednoduchá tvorba šablon v Divi Tvůrci motivů

Určení, pro kterou stránku danou šablonu nastavujeme je snadné a přehledné, ale obsahuje tři důležité části:

  1. Určení, pro jakou stránku bude daná šablona platit a pro jakou stránku šablonu vzloučit. Např. šablonu stanovíme pro všechny kategorie blogu a vzloučíme ji třeba pro kategorii Recepty, protože k reptům chceme odlišnou šablonu.
  2. Výběr nastavení šablony v tvůrci šablon
  3. Potvrzení výběru

Pokud již máte vytvořené záhlaví a zápatí a nastavené jako globální, přiřadí se tyto dvě položky k šabloně automaticky Pokud je ještě vytvořenz nemáte, na webu se bude zobrazovat záhlaví a zápatí ze základního nastavení Divi šablony.

Doporučuji ale vytvořit si vlastní záhlaví a zápatí webu podle vlastních představ s pomocí divi editoru tak, jak jsem popsal v první části tohoto článku.

Pro úplnost dodám, že každá nastavenou šablonu lze jakkoliv upravit 1 (duplikovat, smazat, přenést na jiný web s Divi atd.). I samotné položky šablony, jako je záhlaví, tělo i zápatí webu (2). Pokud se vám návrh, který jste vytvořili nelíbí, lze ho jednoduše smazat s pomocí ikony koše (3).

Pár slov na závěr

Plusy

  • snadná ovladatelnost
  • cenová politika
  • velká komunita uživatelů
  • spousta doplňujících šablon/layoutů a pluginů
  • mnoho návodů, jak šablonu používat na oficiálním blogu Elegant Themes

Mínusy

  • špatný překlad do češtiny
  • těžkopádnost šablony
  • velmi časté zaměření na efekty

Souhrn

Osobní zkušenost v začátcích s šablonou Divi byla hodně tíživá. Bylo pro mě složité pochopit funkci jednotlivých modulů a bylo do jisté míry náročné „zakousnout“ se do dokumentace šablony. 

Nicméně poté, co jsem toto překonal, zjistil jsem, že Divi je skvělý nástroj pro tvorbu webů na redakčním systému WordPress. A je jedno, zda se jedná o malou vizitku freelancera nebo větší magazín či e-shop. 
A to je pro tuto chvíli vše.
Věřím, že vám příspěvek vysvětlil, jak s šablonu Divi začít,  jak vytvořit svou první stránku a vysvětlil, jak pracovat s divi tvůrce motivů.
Pokud chcete, přihlaste se k odběru newsletteru (aby jste nezmeškali další návody). V případě, že potřebujete konkrétni rady ohledně vašeho webu, najdete mě na profesní síti LinkedIn, lifestylovém Instagramu nebo jako administrátora WordPress skupiny na Facebooku

Zůstaňme ve spojení

Poslední příspěvky

Doporučuji

Miroslav Bartík

Jsem webspecialista pro tvorbu obsahu a designu webů. Pracuji s redakčním systémem WordPress, s jehož pomocí plním sny firem i jednotlivců o funkčním webu,

Newsletter

N

Učení bez nákladů

S pomocí těchto návodů se rychle a zdarma naučíte s WordPressem pracovat jako zkušenější uživatelé.

N

Vhodné pro začátečníky

Postupy v článcích jsou psány jednoduše, s ohledem na začínající a technicky méně zdatné uživatele.

N

Bez rozpaků a neurčitostí

Jistě jste u jiných webů zažili moment překvapení, kdy jste si říkali „Cože, jak to sakra..“ Zde se vám to nestane.

0 komentářů

Přidat komentář

Vaše emailová adresa nebude zveřejněna. Vyžadované informace jsou označeny *

2 + seven =

Pin It on Pinterest