Modul počítadla čísel na WordPress tému Divi je skvelý spôsob, ako zobraziť čísla zábavným a pútavým spôsobom. Tento modul sa bežne používa na zobrazenie štatistika o vás alebo vašej firme. Napríklad zobrazenie vášho počtu zákazníkov alebo sledovateľov na Facebooku je skvelý spôsob, ako predviesť sociálny dôkaz.

číslo zobrazenia divi wordpress.png

Ako pridať modul Číslo počítadla Divi

Predtým, ako budete môcť na svoju stránku pridať modul počítadla, musíte najskôr prejsť do Divi Buildera. Raz Divi téma nainštalovaný na vašom webe, 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 aktivujete program Divi Builder a získate 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 pri prehliadaní webových stránok v popredí, ak ste pripojení k dashboardu WordPress.

divi builder

Po zadaní nástroja Visual Builder môžete kliknutím na sivé tlačidlo plus pridať na svoju stránku nový modul. Nové moduly je možné pridávať iba do riadkov. Ak začínate novú stránku, nezabudnite najskôr na svoju stránku pridať riadok.

divi.png číslo počítadla

Vyhľadajte modul počítadla čísel v zozname modulov a kliknutím naň ho pridajte na svoju stránku. Zoznam modulov je prehľadateľný, čo znamená, že môžete tiež napísať slovo „počítadlo čísel“ a potom kliknúť na „Enter“, aby ste automaticky našli a pridali modul počítadla čísel! 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íklad použitia: Použitie modulu digitálneho počítadla na zobrazenie výsledkov projektu

Skvelý spôsob, ako použiť modul počítadla čísel, je ilustrovať štatistika pre prípadové štúdie. Stačí označiť každé počítadlo číslom, aby používateľ mohol ľahko vidieť úspešnosť projektu. V tomto príklade používam modul digitálneho počítadla na zobrazenie štyroch výsledkov projektu.

Ako vidíte, horná časť stránky obsahuje tri ciele projektu pomocou modulu „ Počítadlo barov V dolnej časti stránky nájdete výsledky prípadovej štúdie pomocou modulov digitálneho počítadla.

napríklad compteur.gif

Sekcia stránky, ktorá zobrazuje výsledky prípadovej štúdie pomocou digitálnych modulov, vyžaduje použitie špecializovanej sekcie. Pomocou programu Visual Builder pridajte na stránku špecializovanú sekciu a vyberte nasledujúce rozloženie:

vlastný oddiel divi.png

Vyberte rozloženie 1 stĺpca na pravej strane časti a zadajte názov a text požadovaný pre výsledky prípadovej štúdie.

rozsah inzercie divi.png

Rozloženie stĺpcov 2 vložte priamo pod rozloženie stĺpcov 1 na pravej strane sekcie.

rozdelený stĺpec divi.png

Teraz pridajte svoj modul počítadla prvého čísla do ľavého stĺpca.

pridajte číslo sekcie divi.png

Aktualizujte parametre počítadiel čísel takto:

Možnosti obsahu

Názov: Noví návštevníci
Číslo: 54210
Percentuálny podpis: VYP

Možnosti návrhu

Farba textu: tmavá
Písmo názvu: predvolené
Veľkosť písma titulu: 20px
Názov textu Farba: # 405c60
Výška riadku názvu: 1em
Počet znakov: predvolené, tučné
Počet znakov: 60px
Číslo Farba textu: # e07a5e
Číslo Výška riadku: 72px

obsah sekcie číslo divi.png

Uložte nastavenia

Duplikujte modul Počítadlá čísel a pretiahnite ho do susedného pravého stĺpca a aktualizujte možnosti Názov a Číslo.

čítač číslo príkladu construction.png

Duplikujte riadok, ktorý obsahuje dva moduly počítadla čísel, aby sa nižšie zobrazili ďalšie dva počítadlá.

digitálna counter duplikácia divi.png

Potom pre tieto možnosti aktualizujte názov a číslo. Teraz máte všetky štyri počítadlá celých čísel.

Nezabudnite pridať obrázok 667 x 320 do ľavého stĺpca / bočnej strany špecializovanej sekcie.

Je koniec! Kombinácia počítadiel čísel a počítadiel stĺpcov na tejto stránke prípadových štúdií skutočne robí obsah pútavým.

Modul konečnej realizácie compteur.png

Možnosti digitálneho obsahu počítadla

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 nájde na tejto karte.

vybratá oblasť obsah wordpress divi.png

Názov

Zadajte názov počítadla. Toto sa zobrazí pod číslom v menšom texte.

názov

Toto je číslo, ktoré počítadlo spočíta. Keď prejdete nadol po stránke a dostanete sa k počítadlu, číslo sa počíta rýchlo od 0, kým nedosiahne číslo, ktoré ste tu nastavili. Sem možno umiestniť iba číselné hodnoty.

Znak percenta

Tu si môžete zvoliť, či sa má znak percenta pridať za vyššie definované číslo.

Farba pozadia

Definujte pre svoj modul vlastnú farbu pozadia alebo nechajte predvolenú farbu prázdnu.

Obrázok pozadia

Ak je nastavený, tento obrázok sa použije ako pozadie pre tento modul. Ak chcete odstrániť obrázok na pozadí, stačí odstrániť adresu URL z poľa nastavení. Na pozadí farieb pozadia sa zobrazia obrázky pozadia, čo znamená, že pri použití obrázka pozadia nebude farba pozadia viditeľná.

Správcovská značka

Toto zmení štítok modulu v konštruktore na ľahšiu identifikáciu. Keď použijete zobrazenie WireFrame v programe Visual Builder, tieto štítky sa zobrazia v bloku modulu rozhrania Divi Builder.

Dizajnové možnosti (štýl) digitálneho merača

Na karte Dizajn nájdete všetky možnosti štýlov modulu, ako sú písma, farby, veľkosť a medzery. Toto je karta, ktorú použijete na zmenu vzhľadu vášho modulu. Každý modul Divi má dlhý zoznam nastavení dizajnu, pomocou ktorých môžete čokoľvek meniť.

počítadlo dizajnu zóny divi.png

Farba textu

Tu môžete zvoliť, či má byť text nadpisu svetlý alebo tmavý. Ak pracujete na tmavom pozadí, text by mal byť svetlý. Ak je vaše pozadie svetlé, text by mal byť tmavý.

Písmo názvu

Písmo textu nadpisu môžete zmeniť výberom požadovaného písma v rozbaľovacej ponuke. Divi prichádza s desiatkami skvelý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é písmo, kurzíva, veľké písmená a podčiarknutie.

Veľkosť písma titulu

Tu môžete upraviť veľkosť textu nadpisu. Posunutím posúvača rozsahu môžete zväčšiť alebo zmenšiť veľkosť textu alebo priamo zadajte 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 hodnoty svojej veľkosti.

Farba textu titulu

V predvolenom nastavení sa všetky farby textu v Divi zobrazujú ako biele alebo tmavošedé. Ak chcete zmeniť farbu textu svojho nadpisu, zvoľte pomocou tejto možnosti požadovanú farbu vo výbere farieb.

Rozmiestnenie hlavných písmen

Medzery medzi písmenami ovplyvňujú medzeru medzi jednotlivými písmenami. Ak chcete zväčšiť medzeru medzi jednotlivými písmenami v texte nadpisu, 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 hodnoty svojej veľkosti.

Výška riadku názvu

Výška riadku ovplyvňuje medzeru medzi každým riadkom textu nadpisu. Ak chcete zväčšiť medzeru medzi jednotlivými riadkami, upravte medzeru pomocou posúvača rozsahu alebo do vstupného poľa zadajte požadovanú veľkosť medzery. sa nachádza 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 hodnoty svojej veľkosti.

Písma čísla

Písmo svojho textu môžete zmeniť výberom požadovaného písma v rozbaľovacej ponuke. Divi prichádza s desiatkami skvelý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é písmo, kurzíva, veľké písmená a podčiarknutie.

Veľkosť písma čísla

Tu môžete upraviť veľkosť vášho digitálneho textu. Posunutím posúvača rozsahu môžete zväčšiť alebo zmenšiť veľkosť textu alebo priamo zadajte 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 hodnoty svojej veľkosti.

Farba digitálneho textu

V predvolenom nastavení sa všetky farby textu v Divi zobrazujú ako biele alebo tmavošedé. Ak chcete zmeniť farbu digitálneho textu, vyberte pomocou tejto možnosti požadovanú farbu vo výbere farieb.

Rozstup číslic

Medzery medzi písmenami ovplyvňujú medzeru medzi jednotlivými písmenami. Ak chcete zväčšiť medzeru medzi jednotlivými písmenami v číselnom texte, 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 hodnoty svojej veľkosti.

Výška línie čísla

Výška riadku ovplyvňuje medzeru medzi každým riadkom numerického textu. Ak chcete zväčšiť medzeru medzi jednotlivými riadkami, upravte medzeru pomocou posúvača rozsahu alebo do vstupného poľa zadajte požadovanú veľkosť medzery. sa nachádza 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 hodnoty 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ú okraje š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é merné jednotky, čo znamená, že môžete zmeniť predvolenú jednotku z „px“ na inú, napríklad em, vh, vw atď.

Štýl hraníc

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

Vlastné čalúnenie

Výplň je priestor pridaný do vášho modulu medzi okrajom modulu a jeho vnútornými prvkami. Na ktorúkoľvek zo štyroch strán modulu môžete pridať vlastné hodnoty výplne. Ak chcete odstrániť vlastný okraj, odstráňte pridanú hodnotu zo vstupného poľa. Predvolene sa tieto hodnoty merajú v pixeloch, ale do vstupných polí môžete zadať vlastné jednotky merania.

Pokročilé možnosti počítadla čísel

Na karte rozšírené nájdete možnosti, ktoré by sa mohli 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.

digitálny protiproudový oddiel design.png

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 je možné použiť triedu CSS. Môžete pridať viac tried oddelených medzerou. Tieto triedy môžete použiť vo svojej podradenej téme Divi alebo vo vlastnej šablóne štýlov CSS, ktorú pridáte na svoju stránku alebo na svoj web pomocou možností témy Divi alebo nastavení na stránke Divi Builder.

Vlastné CSS

Vlastné CSS je možné použiť aj na modul a na ktorékoľvek z jeho vnútorných častí. V sekcii Vlastné CSS nájdete textové pole, kde môžete priamo do každého prvku pridať vlastné šablóny štýlov CSS. Záznamy CSS v týchto nastaveniach sú už zabalené v značkách štýlov. Stačí teda 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.

[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