S Divi sú dokonca aj blogy modulom a váš „blog“ môžete umiestniť kdekoľvek na svojom webové stránky a v rôznych formátoch. Môžete skombinovať moduly blogu a bočného panela a vytvoriť tak klasický dizajn blogu. Pomocou modulu blogu a bočného panela je možné vytvoriť 1 stĺpec, 2 stĺpce alebo 3 stĺpce.

Ako pridať blogový modul na svoju stránku

Pred pridaním modulu blogu na svoju stránku musíte najskôr vstúpiť do Divi Builder. Raz Divi téma nainštalovaný na vašom webové stránky, všimnete si tlačidlo Použite nástroj Divi Builder nad editorom príspevkov vždy, keď vytvoríte novú stránku. Kliknutím na toto tlačidlo môžete aktivovať program Divi Builder, ktorý vám umožní prístup ku všetkým modulom Divi Builder. Potom kliknite na tlačidlo Použite Visual Builder na spustenie generátora vo vizuálnom režime. Môžete tiež kliknúť na tlačidlo Použite Visual Builder keď si prezeráte svoje webové stránky upstream, ak ste prihlásení do svojho hlavného panela WordPress.

Po zadaní do programu Visual Builder môžete kliknutím na sivé tlačidlo plus pridať nový modul na svoju stránku. Nové moduly je možné pridávať iba do riadkov. Ak začínate novú stránku, nezabudnite na svoju stránku najskôr pridať riadok. Máme skvelé návody na používanie prvkov lignes a sekcie od Divi.

Vyhľadajte modul blogu v zozname modulov a kliknutím naň ho pridajte na svoju stránku. V zozname modulov je možné vyhľadávať, čo znamená, že môžete tiež napísať slovo „blog“ a potom kliknúť na kláves Enter, aby ste automaticky našli a pridali modul blogu! Po pridaní modulu vás privíta zoznam možností modulu. Tieto možnosti sú rozdelené do troch hlavných skupín: Obsah , Koncepcia et pokročilý .

Prípad použitia modulu blogu s rozložením mriežky v špecializovanej sekcii s pravým bočným panelom

V tomto príklade pridám modul blogu na stránku blogu. Táto stránka blogu má úplnú hlavičku s nižšie uvedeným modulom vyhľadávania. Pod vyhľadávací modul pridám špecializovanú časť s modulom blogu na ľavej strane a časťou bočného panela na pravej strane. Bočný panel vpravo obsahuje miniaplikáciu posledných príspevkov, modul prihlásenia do e-mailu a modul osoby.

Takto vyzerá ukážka stránky.

Modul blogu sa nachádza v mriežke v ľavej časti špeciálnej sekcie.

Začnime.

Pomocou vizuálneho nástroja vytvorte špecializovanú sekciu s nasledujúcim rozložením:

Zobrazí sa výzva na pridanie stĺpca alebo riadku s dvoma stĺpcami pre ľavú stranu. Vyberte stĺpec riadok 1.

Potom do riadku pridajte blogový modul.

Aktualizujte nastavenia blogu takto:

Možnosti obsahu

Počet príspevkov: 6
Viac informácií Tlačidlo: ON
Zobraziť stránkovanie: NIE
Farba pozadia mriežky: #ffffff

Možnosti návrhu

Rozloženie: mriežka
Použite Dropshadow: ON
Ikona prekrytia: #ffffff
Farba prekrytia vznášadla: hlavička rgba (224,153,0,0.51)
polícia:
Hlavička veľkosti písma: 21px
Farba textu hlavičky: # 333333
Medzery medzi písmenami: 1px
Výška riadku hlavičky: 1.2 em
Hranica: ÁNO
Farba ohraničenia: # f0f0f0
Šírka ohraničenia: 1px
Štýl hraníc: Pevný

Možnosti avancées

Vlastné CSS (tlačidlo Viac):

farba: # e09900;
sledovací blok;
text-align: center;
horný okraj: 10px;
okraj: 1px pevná # ccc;
polstrovanie: 5px;
Transformácia textu: kapitalizácia;
rozdelenie písmen: 1px;

Rozšírené vlastné tlačidlo CSS pre tlačidlo Čítať viac vytvára vlastný vzhľad, ktorý zodpovedá dizajnu.

V pravom bočnom paneli v rozložení špecializovanej sekcie budete musieť pridať modul bočného panela, ktorý vloží miniaplikáciu posledných príspevkov. Nižšie budete musieť pridať modul Email Optin. A potom v časti Email Optin musíte pridať modul Osoba s informáciami o autorovi.

A je to!

Možnosti obsahu blogu

Na karte Obsah nájdete všetky obsahové prvky modulu, napríklad text, obrázky a ikony. Všetko, čo ovláda čo Vo vašom module sa vždy zobrazí táto karta.

Číslo položky (počet položiek)

Nastavte počet správ, ktoré chcete zobraziť. Pre všetko, čo sa v tomto module objaví, budete musieť mať správy.

Vyberte kategórie, ktoré chcete zahrnúť do príspevku. Tu sa zobrazia všetky kategórie správ, ktoré ste vytvorili, aby ste ich mohli vybrať alebo zrušiť výber.

Zahrnuté kategórie

Vyberte kategórie, ktoré chcete zahrnúť do informačného kanála.

Formát metadát

Tu nastavte formát dátumu, ktorý chcete zobraziť vo svojich blogových príspevkoch. Predvolené rozloženie je formát M j, Y (6. januára 2014) WordPress codex vo formátoch dátumu pre viac možností.

Obsah

Zobrazením celého obsahu sa vaše príspevky na indexovej stránke neskrátia. Zobraziť úryvok zobrazí iba text vášho úryvku.

Ofsetové číslo

Vyberte počet správ, ktoré chcete posunúť. Ak kompenzujete napríklad 3 príspevkami, prvé tri príspevky vo vašom informačnom kanáli blogu sa nezobrazia.

Zobraziť odporúčaný obrázok

Táto možnosť vám umožňuje vybrať si, či chcete miniatúry zobrazovať vo vašom blogovom module.

Prečítajte si viac

Tu môžete nastaviť, či sa má po úryvku zobraziť odkaz „prečítať viac“.

Zobraziť autora

Vyberte, či chcete alebo nechcete zobraziť autora každého blogového príspevku v poli metaúdajov pod názvom príspevku.

Zobraziť dátum

Vyberte, či chcete alebo nechcete zobraziť dátum, kedy bol každý článok vytvorený, v poli Meta položky pod nadpisom správy.

Zobraziť kategórie

Vyberte, či sa majú kategórie príspevkov uverejniť v oblasti meta príspevkov pod názvom publikácie.

Zobraziť počet komentárov

Vyberte, či chcete alebo nechcete zobrazovať počet komentárov v poli meta príspevku pod názvom príspevku.

Zobraziť stránkovanie

Vyberte, či chcete alebo nechcete zobrazovať stránkovanie pre tento informačný kanál. Ak chcete povoliť očíslované stránkovanie, budete si musieť nainštalovať doplnok Stránka WP stránky Navi .

Štítok správy

Toto zmení štítok modulu v generátore pre ľahšiu identifikáciu. Pri použití pohľadu WireFrame vo Visual Builderi sa tieto štítky zobrazia v modulovom bloku rozhrania Divi Builder.

Možnosti návrhu blogu

Na karte Dizajn nájdete všetky možnosti štýlov modulu, ako sú písma, farby, veľkosť a medzery. Táto karta umožňuje upraviť vzhľad vášho modulu. Každý modul Divi má dlhý zoznam nastavení dizajnu, pomocou ktorých môžete vyladiť takmer čokoľvek.

dispozície

Môžete sa rozhodnúť zobrazovať svoje blogové príspevky v mriežke alebo v celej šírke.

Prekrytý obrázok

Ak je táto možnosť povolená, farba a ikona prekrytia sa zobrazia, keď sa návštevník umiestni na vybraný obrázok správy.

Farba ikony prekrytia

Tu môžete nastaviť vlastnú farbu ikony prekrytia.

Vznášanie farby krytu

Tu môžete definovať vlastnú farbu prekrytia.

Prevzatie ikony výberu myši

Tu môžete definovať vlastnú ikonu prekrytia.

Farba textu

Si váš blog je umiestnená na svetlom pozadí, farba textu by mala byť nastavená na „Tmavý“. Víza, áno váš blog je umiestnená na tmavom pozadí, farba textu by mala byť nastavená na „Svetlé“.

Písmo hlavičky

Písmo hlavičky môžete zmeniť výberom požadovaného písma v rozbaľovacej ponuke. Divi prichádza s desiatkami úžasných typov písma, ktoré používajú písma Google. Divi predvolene používa pre všetok text na svojej stránke písmo Open Sans. Štýl textu môžete tiež prispôsobiť pomocou možností tučného písma, kurzívy, veľkých písmen a podčiarknutia.

Veľkosť písma hlavičky

Tu môžete upraviť veľkosť textu hlavičky. Posunutím posúvača intervalu môžete zväčšiť alebo zmenšiť veľkosť textu alebo môžete priamo zadať požadovanú hodnotu veľkosti textu do vstupného poľa napravo od posúvača. Vstupné polia podporujú rôzne merné jednotky, čo znamená, že môžete zmeniť typ jednotky zadaním „px“ alebo „em“ v závislosti od svojej veľkosti.

Farba textu hlavičky

V predvolenom nastavení sú všetky farby textu v Divi zobrazené v bielej alebo tmavošedej farbe. Ak chcete zmeniť farbu svojej hlavičky, vyberte pomocou tejto možnosti požadovanú farbu vo výbere farieb.

Medzery medzi hlavičkami

Medzery medzi písmenami ovplyvňujú medzeru medzi jednotlivými písmenami. Ak chcete zväčšiť medzeru medzi každým písmenom textu záhlavia, pomocou posuvníka intervalu upravte medzeru alebo zadajte požadovanú veľkosť medzery do vstupného poľa vpravo od jazdca. Vstupné polia podporujú rôzne merné jednotky, čo znamená, že môžete zmeniť typ jednotky zadaním „px“ alebo „em“ v závislosti od svojej veľkosti.

Výška riadku hlavičky

Výška riadku ovplyvňuje medzeru medzi každým riadkom textu hlavičky. Ak chcete zväčšiť medzeru medzi každým riadkom, upravte medzeru pomocou posúvača rozsahu alebo zadajte požadovanú veľkosť medzery do vstupné pole napravo od kurzora. Vstupné polia podporujú rôzne merné jednotky, čo znamená, že môžete zmeniť typ jednotky zadaním „px“ alebo „em“ v závislosti od svojej veľkosti.

Font písma

Písmo tela môžete zmeniť výberom požadovaného písma v rozbaľovacej ponuke. Divi prichádza s desiatkami úžasných typov písma, ktoré používajú písma Google. Divi predvolene používa pre všetok text na svojej stránke písmo Open Sans. Štýl textu môžete tiež prispôsobiť pomocou možností tučné, kurzíva, veľké písmená a podčiarknutie.

Veľkosť písma v tele

Tu môžete upraviť veľkosť textu. Posunutím posúvača intervalu môžete zväčšiť alebo zmenšiť veľkosť textu alebo môžete priamo zadať požadovanú hodnotu veľkosti textu do vstupného poľa vpravo od posúvača. Vstupné polia podporujú rôzne merné jednotky, čo znamená, že môžete zmeniť typ jednotky zadaním „px“ alebo „em“ v závislosti od svojej veľkosti.

Farba textu tela

V predvolenom nastavení sú všetky farby textu v Divi zobrazené v bielej alebo tmavošedej farbe. Ak chcete zmeniť farbu svojho základného textu, vyberte pomocou tejto možnosti požadovanú farbu vo výbere farieb.

Rozmiestnenie písmen

Medzery medzi písmenami ovplyvňujú medzeru medzi jednotlivými písmenami. Ak chcete zväčšiť medzeru medzi jednotlivými písmenami textu, upravte medzeru pomocou posúvača intervalu alebo zadajte požadovanú veľkosť medzery do vstupného poľa vpravo od jazdca. Vstupné polia podporujú rôzne merné jednotky, čo znamená, že môžete zmeniť typ jednotky zadaním „px“ alebo „em“ v závislosti od svojej veľkosti.

Výška línie tela

Výška riadku ovplyvňuje medzeru medzi každým riadkom základného textu. Ak chcete zväčšiť medzeru medzi jednotlivými riadkami, upravte medzeru pomocou posúvača intervalov alebo zadajte požadovanú veľkosť medzery do vstupného poľa vpravo od jazdca. Vstupné polia podporujú rôzne merné jednotky, čo znamená, že môžete zmeniť typ jednotky zadaním „px“ alebo „em“ v závislosti od svojej veľkosti.

Metas písmo

Písmo svojho meta textu môžete zmeniť výberom požadovaného písma v rozbaľovacej ponuke. Divi prichádza s desiatkami úžasných typov písma, ktoré používajú písma Google. Divi predvolene používa pre všetok text na svojej stránke písmo Open Sans. Štýl textu môžete tiež prispôsobiť pomocou možností tučného písma, kurzívy, veľkých písmen a podčiarknutia.

Veľkosť písma Metas

Tu môžete upraviť veľkosť svojho meta textu. Posunutím posúvača intervalu môžete zväčšiť alebo zmenšiť veľkosť textu alebo môžete priamo zadať požadovanú hodnotu veľkosti textu do vstupného poľa vpravo od posúvača. Vstupné polia podporujú rôzne merné jednotky, čo znamená, že môžete zmeniť typ jednotky zadaním „px“ alebo „em“ v závislosti od svojej veľkosti.

Farba textu pre meta

V predvolenom nastavení sú všetky farby textu v Divi zobrazené v bielej alebo tmavošedej farbe. Ak chcete zmeniť farbu svojho meta textu, vyberte pomocou tejto možnosti požadovanú farbu vo výbere farieb.

Rozstup meta písmen

Medzery medzi písmenami ovplyvňujú medzeru medzi jednotlivými písmenami. Ak chcete zväčšiť medzeru medzi každým písmenom svojho meta textu, pomocou jazdca rozsahu upravte medzeru alebo zadajte požadovanú veľkosť medzery do vstupného poľa vpravo od jazdca. Vstupné polia podporujú rôzne merné jednotky, čo znamená, že môžete zmeniť typ jednotky zadaním „px“ alebo „em“ v závislosti od svojej veľkosti.

Výška metálnej čiary

Výška riadku ovplyvňuje medzery medzi jednotlivými riadkami v meta-texte. Ak chcete zväčšiť medzery medzi jednotlivými riadkami, upravte medzeru pomocou posúvača rozsahu alebo do poľa zadajte veľkosť medzery, ktorú chcete. napravo od kurzora. Vstupné polia podporujú rôzne merné jednotky, čo znamená, že môžete zmeniť typ jednotky zadaním „px“ alebo „em“ v závislosti od svojej veľkosti.

Použite okraj

Povolenie tejto možnosti umiestni orámovanie okolo vášho modulu. Túto hranicu je možné prispôsobiť pomocou nasledujúcich podmienených parametrov.

Farba hranice

Táto možnosť ovplyvňuje farbu vášho orámovania. Vyberte vlastnú farbu z výberu farieb a použite ju na svoje orámovanie.

Šírka hranice

V predvolenom nastavení sú hranice široké 1 pixel. Túto hodnotu môžete zvýšiť presunutím jazdca rozsahu alebo zadaním vlastnej hodnoty do vstupného poľa vpravo od jazdca. Podporované vlastné jednotky merania, čo znamená, že môžete zmeniť predvolenú jednotku z „px“ na inú, napr. Em, vh, vw atď.

Štýl hraníc

Okraje podporujú osem rôznych štýlov vrátane: plný, bodkovaný, bodkovaný, dvojitý, drážka, hrebeň, vložka a štart. Z rozbaľovacej ponuky vyberte požadovaný štýl a aplikujte ho na svoje orámovanie.

Rozšírené možnosti blogu

Na karte Pokročilé nájdete možnosti, ktoré sa môžu hodiť skúsenejším webovým dizajnérom, napríklad vlastné atribúty CSS a HTML. Tu môžete použiť vlastné CSS na ktorýkoľvek z mnohých prvkov modulu. Na modul môžete tiež použiť vlastné triedy a identifikátory CSS, ktoré sa dajú použiť na prispôsobenie modulu v súbore style.css vašej detskej témy.

CSS ID

Zadajte voliteľné ID CSS, ktoré sa použije pre tento modul. ID je možné použiť na vytvorenie vlastného štýlu CSS alebo na prepojenie s konkrétnymi sekciami vašej stránky.

Triedu CSS

Zadajte voliteľné triedy CSS, ktoré sa majú použiť pre tento modul. Na vytvorenie vlastného štýlu CSS možno použiť triedu CSS. Môžete pridať viacero tried oddelených medzerou. Tieto triedy môžu byť použité vo vašom Divi téma Child alebo vo vlastnom CSS, ktoré pridáte na svoju stránku alebo web pomocou Divi Theme Options alebo Divi Builder Page Settings.

Vlastné CSS

Vlastné CSS možno použiť aj na modul a na ktorékoľvek z vnútorných prvkov modulu. V sekcii Vlastné CSS nájdete textové pole, kde môžete pridať CSS priamo ku každému prvku. Položky CSS v týchto nastaveniach sú už vložené so značkami štýlov. Musíte teda iba zadať pravidlá CSS oddelené bodkočiarkami.

viditeľnosť

Táto možnosť vám umožňuje ovládať zariadenia, na ktorých sa modul zobrazuje. Môžete sa rozhodnúť deaktivovať svoj modul na tabletoch, smartfónoch alebo stolových počítačoch jednotlivo. To je užitočné, ak chcete používať rôzne módy na rôznych zariadeniach alebo ak chcete zjednodušiť mobilný dizajn odstránením určitých prvkov zo stránky.

To je pre tento návod všetko.