Divi je určite jedným z nich Témy WordPress v súčasnosti najpopulárnejší. Jedným z prvkov, ktoré tvoria silu tejto témy, je jej tvorca (Divi Builder), ktorý nám veľa pripomína Visual Composer.

Divi Builder má dve formy: štandardný „Back-end Builder“ a „Visual Builder“. Obe rozhrania umožňujú vytvárať úplne rovnaké typy webových stránok s rovnakými obsahmi a rovnakými parametrami návrhu. Rozdiel je iba v rozhraní. Aplikácia Back-end Builder je umiestnená na hlavnom paneli WordPress a je prístupná so všetkými ostatnými štandardnými nastaveniami WordPress.

Nachádza sa vo vnútri používateľského rozhrania WordPress a nahrádza štandardný editor príspevkov WordPress. Je to skvelé na vykonávanie rýchlych zmien, keď sa nachádzate na paneli dashboard, ale je tiež obmedzený panelom dashboard a je vykreslený ako blokovaná reprezentácia vášho webu. Tento výukový program sa zameria iba na vizuálny nástroj na tvorbu.

Stiahnite si tému DIVI WordPress

Úplne nový Visual Builder vám na druhej strane umožňuje vytvárať stránky na prednej časti vášho webu! Je to úžasný zážitok a umožňuje oveľa rýchlejší dizajn. Po pridaní obsahu alebo úprave nastavení dizajnu vo vizuálnom nástroji na vytváranie sa zmeny prejavia okamžite.

Môžete kliknúť na stránku a začať písať. Môžete zvýrazniť text a upraviť jeho písmo a štýl. Môžete pridať nový obsah, zostaviť stránku a vidieť všetko, čo sa deje pred vašimi očami.

Ako povoliť Visual Builder

Keď ste prihlásení na svojom paneli WordPress, môžete prejsť na ľubovoľnú stránku v prednej časti svojho webu a kliknutím na tlačidlo „Aktivovať program Visual Builder“ na paneli správ WordPress spustiť program na tvorbu. vizuálne.

Ak upravujete svoju stránku na informačnom paneli, môžete prejsť na vizuálny nástroj na vytváranie kliknutím na tlačidlo „Povoliť vizuálny program“, ktoré je v hornej časti back-endového rozhrania nástroja Divi Builder (všimnite si, že musíte najskôr aktivujte Divi Builder skôr, ako sa objaví tlačidlo vizuálneho builderu).

Základy Visual Builder

Sila Divi spočíva v nástroji Visual Builder, nástroji na vytváranie stránok, ktorý pracuje s programom „Drag and Drop“, ktorý umožňuje vytvárať takmer akýkoľvek typ webových stránok kombináciou a usporiadaním jednotlivých častí obsahu.

Nástroj na tvorbu používa tri hlavné stavebné bloky: oddiely, riadky a moduly. Unisono ich použitie vám umožňuje vytvoriť nespočetné množstvo rozložení. Sekcie sú najväčšími stavebnými blokmi a sú v nich umiestnené skupiny radov. Riadky sa nachádzajú vo vnútri sekcií a slúžia na umiestnenie modulov. Moduly sú umiestnené vo vnútri radov. Toto je štruktúra každej webovej stránky Divi.

oddiely

Najzákladnejším a najväčším stavebným prvkom používaným pri navrhovaní usporiadaní pomocou Divi sú oddiely. Používajú sa na vytváranie veľkých skupín obsahu a je to prvá vec, ktorú na svoju stránku pridáte. Existujú tri typy sekcií: Pravidelná, Špeciálna a Celá šírka.

Pravidelné sekcie sú tvorené radmi stĺpcov, zatiaľ čo sekcie s plnou šírkou sú tvorené modulmi s plnou šírkou, ktoré rozširujú celú šírku obrazovky. Špeciálne časti umožňujú pokročilejšie rozloženie strán.

riadok

Riadky sú vo vnútri sekcií a do sekcie môžete umiestniť ľubovoľný počet riadkov. Na výber je veľa rôznych typov stĺpcov. Keď ste pre svoj riadok definovali štruktúru stĺpca, môžete do požadovaného stĺpca umiestniť moduly. Počet modulov, ktoré môžete umiestniť do stĺpca, nie je nijako obmedzený.

moduly

Moduly sú časti obsahu, ktoré tvoria váš web. Každý modul Divi sa dokáže prispôsobiť akejkoľvek šírke stĺpca a všetky reagujú úplne.

Zostavte svoju prvú stránku

Na zostavenie vašej stránky sa používajú tri základné stavebné bloky (sekcie, línie a moduly).

Pridáva sa prvá sekcia

Predtým, ako budete môcť na svoju stránku niečo pridať, musíte najskôr pridať sekciu. Sekcie je možné pridávať kliknutím na modré tlačidlo (+). Keď umiestnite kurzor myši na sekciu, ktorá už na stránke existuje, nižšie sa zobrazí modré tlačidlo (+). Po kliknutí sa pod sekciu, nad ktorou práve vznášate, pridá nová sekcia.

Ak začnete novú stránku, automaticky sa pridá prvá sekcia.

Pridáva sa prvý riadok

Po pridaní prvej sekcie môžete začať pridávať riadky stĺpcov dovnútra. Sekcia môže obsahovať ľubovoľný počet riadkov a môžete kombinovať riadky z rôznych typov stĺpcov a vytvoriť tak rôzne rozloženia.

Ak chcete pridať riadok, kliknite na zelené tlačidlo (+) v prázdnej časti alebo kliknite na zelené tlačidlo (+), ktoré sa zobrazí pri umiestnení kurzora myši na aktuálny riadok, a pridajte nový riadok nižšie. Po kliknutí na zelené tlačidlo (+) sa zobrazí zoznam typov stĺpcov. Vyberte stĺpec podľa vášho výberu a ste pripravení pridať svoj prvý modul.

Pridanie prvého modulu

Moduly môžu byť pridané do riadkov a každý riadok môže obsahovať ľubovoľný počet modulov. Moduly sú obsahovými prvkami vašej stránky a Divi obsahuje viac ako 40 rôznych prvkov, ktoré môžete použiť na zostavenie.

Môžete použiť základné moduly, ako sú texty, obrázky a tlačidlá, alebo pokročilejšie moduly, ako sú posuvníky, galérie portfólií a eCommerce Obchody.

Ak chcete pridať modul, kliknite na sivé tlačidlo (+), ktoré existuje vo vnútri prázdneho stĺpca, alebo kliknite na sivé tlačidlo (+), ktoré existuje, keď umiestnite kurzor myši na modul na stránke a pridáte nový modul nižšie. . Po kliknutí na tlačidlo vás privíta zoznam modulov.

Vyberte modul podľa vášho výberu a bude pridaný na vašu stránku a zobrazí sa ovládací panel modulu. Pomocou tohto ovládacieho panela môžete začať konfigurovať svoj modul.

To je pre tento tutoriál všetko. S tým, čo ste sa dnes naučili, budete môcť vytvoriť rozloženie s Divi. Vrátime sa s pokročilými tutoriálmi na túto tému. Už si môžete stiahnuť Divi téma.

[vc_row center_row = "yes"] [vc_column width = "1/2 ″] [vcex_button target =" blank "layout =" rozšírené "align =" center "font_family =" Raleway "font_weight =" 700 ″ style = "flat" custom_background = "# 18b69d" custom_hover_background = "# 118d7a" custom_color = "#ffffff" custom_hover_color = "#ffffff" icon_right = "fa fa-download"] STIAHNUŤ TÉMU DIVI [/ vcex_button] [/ width_column] [»v] » 1/2 ″] [vcex_button url = "https://www.elegantthemes.com/affiliates/idevaffiliate.php?id=23065&url=40632&tid1=tutorials" target = "blank" layout = "expanded" align = "center" font_family = "Raleway" font_weight = "700 ″ style =" flat "custom_background =" # c4226e "custom_hover_background =" # 8d184f "custom_color =" #ffffff "custom_hover_color =" #ffffff "icon_right" TEM DOWNLOOWN DIVI [/ vcex_button] [/ vc_column] [/ vc_row]

Ďalšie výukové programy spoločnosti Divi

• 5 webové stránky pre použitie v hoteli Divi tému
• Ako pridať text na produktoch Divi WooCommerce
• Ako zmeniť farbu ponuky medzi stránkami Divi
• Ako si prispôsobiť mriežky blogu s Divi
• Ako používať role Divi editor na WordPress
• Ako vytvoriť posuvník Divi na celej obrazovke
• Ako zmeniť farbu ponúk medzi stránkami Divi
• Funkcie, ktoré pravdepodobne neviete o Divi
• Ako používať Divi Builder na WordPress
• Ako používať modul posúvania videa Divi
• Ako používať modul Divi Builder Flip
• Ako pridať modul posudkov na Divi Builder
• Ako používať textový modul Divi
• Ako vytvoriť posúvač na Divi
• Ako upraviť rolu používateľa Divi
• Ako používať modul Divi Social Media
• Ako používať modul obchodu na tému WordPress Divi
• Ako používať modul bočného panela Divi
• Ako používať modul tabuľky cien Divi
• Ako používať titulný modul publikácií Divi
• Ako pridať video modul Divi
• Ako používať navigačný modul článku
• Ako používať vyhľadávací modul Divi
• Ako používať modul peňaľenky Divi
• Ako používať osobný modul na nástroji Divi Builder
• Ako používať modul peňaženky s filtrom Divi
• Ako používať posuvný modul s plnou šírkou
• Ako používať modul obrazu Divi Builder
• Ako používať navigačný modul v celej šírke nástroja Divi Builder
• Ako používať modul galérie obrázkov
• Ako používať modul kariet Divi Builder s plnou šírkou
• Ako používať portálový modul Divi s plnou šírkou
• Ako používať modul záhlavia Divi s plnou šírkou
• Ako používať počítací modul Divi
• Ako používať posúvač článkov v aplikácii Divi Builder
• Ako používať modul Divi Email Optin