Divi šablona a Elegant Themes

Nové možnosti nastavení vizuálního editoru v Divi

Autor příspěvku Tomáš Cirkl

Všechny trendy budování obsahu se postupně přesouvají do vizuálních editorů a dalších způsobů editace obsahu, při nichž je rovnou vidět výsledný vzhled stránky. V klasickém WordPress tyto změny vidíme s postupným přesouváním nastavení do sekce Přizpůsobit a snahou o tvorbu výchozího vizuálního editoru Gutenberg, který je ovšem zatím spíše zklamáním.

Důležitým prvkem při práci s vizuálním editorem je uživatelská přívětivost a plynulost práce. V tomto zatím Vizuální editor v šabloně Divi trochu pokulhával. Stávalo se, že plovoucí ovládací prvky mizely, když jste už už chtěli na ně kliknout, nebo se zobrazovaly na místech, kde se na ně nedalo myší dostat.

Právě Visual builder v Divi prošel velkou aktualizací. Byly do něj přidány nové funkce a možnosti nastavení, které si v tomto článku představíme a ukážeme jak s nimi můžete pracovat.

Dva nové modely interakce prvků

Pro práci ve visual builderu můžete nově použít Click Mode a Grid Mode. Toto nastavení ovlivní chování plovoucích lišt sloužících pro práci s moduly, řádky nebo sekcemi.

Click Mode

Click Mode u vizuálního editoru

Ve výchozím nastavení vizual builderu se interakce prvku odehrává při najetí myši. Umístěním myši nad modul, řádku nebo sekci zobrazí jejich ovládací panely, které je poté možné kliknout. Tento způsob však nevyhovuje každému a může být dosti frustrující.

V Click Mode (Mód klikání) se ovládací panel prvků zobrazí až po kliknutí na daný element a zůstane viditelný do té doby, než kliknete na jiný.

Click Mode ale také umožňuje jednoduše najít hledaný element tak, že při najetí zvýrazňuje prvky, nad kterými se nacházíte. Díky tomu rychle najdete to, co hledáte.

Grid Mode

Grid Mode ve vizuálním editoru

Druhým novým způsobem zobrazení ovládacích prvků je Grid Mode (Mód mřížky). Jakmile tento mód aktivujete, tak ihned vidíte panel nastavení všech řádek, modulů a sekcí. Nepotřebujete tedy na nic klikat ani posouvat tam myš, aby se zobrazilo ovládání. Při otevření nastavení prvku se panely skryjí a můžete stránku nerušeně upravovat. I přesto, že je tento mód poměrně rušivý, hodí se například pro rychlé zobrazení struktury stránky.

Vylepšený Hover Mode

Ani výchozí Hover Mode (Mód přejetí) nebyl při aktualizaci vynechán a dostal vylepšení funkčnosti. Vývojáři se především soustředili na problémy se zobrazováním ovládacího panelu prvku a jeho skrýváním. Také se upravila pozice panelu při malých prvcích, kdy je nově připoutaná k horní části prvku, namísto aby byla uvnitř.

Nastavení zobrazení vizual builderu a jeho vlastní úprava

Nově si můžete uzpůsobit vzhled a funkci vizuálního editoru přesně podle vašich představ.

Úprava ovládacích prvků

Panel pro ovládání vizuál builderu je nyní plně upravitelný. Jednoduše si tak nastavte zobrazení pouze těch ikon, které používáte, přidejte si ikonku přiblížení, náhled zobrazení na různých zařízení….

Zobrazení všech nastavení

Zobrazení všech nastavení

Při otevření nastavení jednotlivého prvku si můžete nastavit, že se budou veškeré jeho možnosti nastavení zobrazovat přímo a nebude třeba nutné rozbalovat jednotlivé skupiny. Tuto možnost aktivujete v nastavení vizual builderu položkou Open All Options Toggles By Default (Otevřít všechna nastavení v základu).

Zcela skrýt vypnuté moduly

Zcela skrýt vypnuté moduly

Nové nastavení vizuál builderu také obsahuje položku, která umožňuje zcela skrýt moduly na některých nebo na všech zařízeních. Ve výchozím nastavení jsou neaktivní moduly rozlišeny pomocí  zobrazení 50% průhlednosti. Nicméně stále se zobrazují. Jestli byste je raději měli zcela skryté, můžete to učinit pomocí nastavení Show Disabled Modules at 50% (Zobrazit neaktivní moduly na 50%).

Odstranění animací Divi builderu

Odstranění animací Divi builderu

Starší počítače nebo prohlížeče mohou mít problém s přechodovými animacemi Divi builderu. V nastavení si je můžete nově vypnout a vylepšit si tak kompatibilitu. Položka se jmenuje Builder Interface Animations (Animace zobrazení v builderu).

Výchozí pozice okna

Výchozí pozice okna

Vyskakovací okna s možnostmi prvku nyní mají specifické nastavení. Můžete určit jejich výchozí pozici a velikost nebo jejich ukotvení ke straně obrazovky. Ve výchozím nastavení si builder pamatuje předchozí nastavení, které ale musíte na každé stránce upravovat. Nyní to lze udělat globálně a jen jednou. Položka nastavení se jmenuje Settings Default Modal Position (Nastavení výchozí pozice vyskakovacího okna).

Kontrola nad uloženou historií

Kontrola nad uloženou historií

Ve výchozím nastavení vizual builder vytvoří historii při každé změně, kterou provedete. Tyto uložené změny můžete v případě potřeby načíst a vrátit se tak k předchozí verzi. Nicméně při dlouhé práci je to opravdu obrovské množství uložených pozic a najít tu správnou může chvíli zabrat. Nová položka History State Interval (Interval ukládání do historie) umožňuje nastavení, kdy dojde k uložení do historie. Uložení může být nastavení například při každé 10,20 nebo 40 interakci. Opět je to vhodné pro vylepšení kompatibility na starších počítačích.

Nastavení výchozího módu pro interakci

Nastavení výchozího módu pro interakci

Společně s uvedením dvou nových módu pro interakci s vizual builderem (Grid Mode a Click Mode) přichází nastavení, kde si můžete zvolit výchozí možnost interakce. Ve výchozím nastavení je vždy použit Hover Mode, ale pokud vám nevyhovuje, můžete si jej změnit. Při dalším načtení pak bude tato možnost zvolena automaticky.

Divi šablona opět dostala krásné vylepšení použitelnosti a kompatibility, které všichni uživatelé v praxi určitě využijí.

O autorovi

Tomáš Cirkl

Baví mě Internet a zvláště pak redakční systém WordPress. Jsem pravidelným účastníkem a přednášejícím na WordCamp Praha a WordPress konferencích.

2 komentáře

  • Osobně raději pracuji v klasickém divi builderu než visualu. Ale jinak skvělý článek. Asi jej zase zkusím a dám mu šanci.
    Divi válí 🙂

    • Já si rád připravím v builderu strukturu a poté ve visual editoru dotahuji obsah a celkovou podobu stránky.

Zanechat komentář

Získejte více informací o WordPress!

Připojte se do našeho emailového seznamu a nenechte si ujít informace, novinky a návody ze světa WordPressu.

Úspěšně jste se zapsali do našeho newsletteru. Děkujeme!

Tomáš Cirkl

Tomáš Cirkl

WordPress specialista

Blog WPlama.cz píši už více než 3 roky. O WordPress přednáším a pořádám školení. Pro své klienty vytvářím a spravuji webové stránky.