Divi vám umožňuje umiestňovať posúvače do častí s plnou šírkou, vďaka čomu sa vaše posúvače rozšíria na celú šírku prehľadávača. Posuvníky Divi (Posuvníky) podporujú pozadie paralaxy, ako aj pozadie videa!
Ako pridať modul Diapo s celkovou šírkou od spoločnosti Divi
Predtým, ako budete môcť na svoju stránku pridať posuvný modul plnej šírky, musíte najskôr prejsť 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 Buildernad 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 keď si prezeráte svoje webové stránky v popredí, ak ste prihlásení do svojho hlavného panela WordPress.
Keď sa nachádzate v nástroji Visual Builder, môžete kliknúť na sivé tlačidlo plus a pridať na 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.
Vyhľadajte modul posúvača s plnou šírkou v zozname modulov a kliknutím naň ho pridajte na svoju stránku. V zozname modulov je možné prehľadávať, čo znamená, že môžete tiež napísať slovo „Snímka“ a potom kliknúť na kláves Enter, aby ste automaticky našli a pridali modul na posuvné tlačidlá na celú šírku! 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 prípadu: Pridanie sekcie Hero s posúvačom s plnou šírkou na vašu domovskú stránku
Posuvník celej šírky je skvelý spôsob, ako predviesť viac výziev na akciu nad hranicu svojej domovskej stránky. Kombinácia obrázkov a obsahu môže skutočne dať vašej sekcii profesionálny pocit, ktorý vynikne.
V tomto príklade pridám snímku celej šírky, ktorá bude slúžiť ako hlavná časť na domovskej stránke.
Pomocou programu Visual Builder pridajte sekciu Celá šírka do hornej časti svojej webovej stránky. Potom vložte modul Fullwidth Slider do svojej novej sekcie. Na karte Obsah v nastaveniach snímky celej šírky kliknite na + Pridať novú položku vytvoriť prvú snímku.
V nastaveniach snímky prvej snímky aktualizujte nasledujúce možnosti:
Možnosti obsahu
En-tête : [zadajte názov snímky]
Text tlačidla : [zadajte text tlačidla]
Obsah : [zadajte textový obsah snímky]
Tlačidlo URL : [zadajte cieľovú adresu URL tlačidla Slide]
Obrázok na pozadí : [zadajte obrázok, ktorý bude slúžiť ako pozadie snímky]
Možnosti návrhu
Použite prekrytie pozadia : ÁNO
Farba prekrytia pozadia : rgba (0,0,0,0.2) toto prekrytie mierne stmaví obrázok na pozadí, aby bol text čitateľnejší.
Uložte nastavenia snímky
Teraz duplikujte snímku, ktorú ste práve vytvorili, a podľa potreby aktualizujte novú snímku o nový obsah. Tento postup opakujte pre všetky snímky, ktoré chcete pridať.
To je všetko. V tomto príklade uvádzam iba dve snímky, ale výsledkom je efektívny posúvač hrdinu v celej šírke s viacerými výzvami na akciu, ktorý prinúti používateľa kliknúť na tlačidlo pre ďalšie informácie. Pretože toto je vaša hlavná výzva na akciu webové stránky, navrhujem spustiť rozdelené testy na vašej snímke s plnou šírkou pomocou Divi Leads a zistiť, ktorý z nich konvertuje najlepšie.
Posunutím plného obsahu
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.
šípky
Vyberte, či chcete zobraziť ľavú a pravú navigačnú šípku.
riadenie
Zvoľte, či sa majú alebo nebudú zobrazovať tlačidlá kruhu / indikátory posunu v spodnej časti kurzorov.
Štítok správcu
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.
Možnosti návrhu modulu posúvania
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ť.
Odstráňte vnútorný tieň
Štandardne sa v kurzore zobrazuje vnútorný tieň. Ak chcete tento tieň vypnúť, môžete to urobiť pomocou tohto nastavenia.
Parallaxový efekt
Ak povolíte túto možnosť, vaše obrázky na pozadí budú mať pri rolovaní pevnú pozíciu. Nezabudnite, že keď je toto nastavenie zapnuté, vaše obrázky upravia ich veľkosť na výšku prehliadača.
Písmo hlavičky
Písmo textu záhlavia 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 hlavičky
Tu môžete upraviť veľkosť textu hlavičky. Posunutím posúvača rozsahu môžete zväčšiť alebo zmenšiť veľkosť textu alebo 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 hodnoty svojej veľkosti.
Farba textu hlavičky
V predvolenom nastavení sa všetky farby textu v Divi zobrazujú ako biele alebo tmavošedé. Ak chcete zmeniť farbu textu 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 jednotlivými písmenami v texte hlavičky, 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 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 jazdca 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 hodnoty svojej veľkosti.
Telo polície
Písmo tela 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 v tele
Tu môžete upraviť veľkosť textu. Posunutím posúvača rozsahu môžete zväčšiť alebo zmenšiť veľkosť textu alebo 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 hodnoty svojej veľkosti.
Farba textu tela
V predvolenom nastavení sa všetky farby textu v Divi zobrazujú ako biele alebo tmavošedé. Ak chcete zmeniť farbu textu, vyberte túto farbu vo výbere farieb pomocou tejto možnosti.
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 v 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 tela
Výška riadku ovplyvňuje medzery medzi jednotlivými riadkami textu v tele. Ak chcete zväčšiť medzery 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.
Vrchná vypchávka
Tento parameter riadi vnútorný priestor medzi hornou časťou modulu a textovým obsahom v module. Ak chcete tento priestor zväčšiť alebo zmenšiť, zadajte tu požadovanú hodnotu. Napríklad na zmenšenie medzery a celkovej veľkosti kurzora môžete zadať hodnotu 100 pixelov. Môžete tiež zadať percentuálnu hodnotu, napríklad 10%, aby bola výška dynamickejšia.
Spodné čalúnenie
Tento parameter riadi vnútorný priestor medzi spodnou časťou modulu a textovým obsahom v module. Ak chcete tento priestor zväčšiť alebo zmenšiť, zadajte tu požadovanú hodnotu. Napríklad na zmenšenie medzery a celkovej veľkosti kurzora môžete zadať hodnotu 100 pixelov. Môžete tiež zadať percentuálnu hodnotu, napríklad 10%, aby bola výška dynamickejšia.
Pre tlačidlo použite vlastné štýly
Povolenie tejto možnosti odhalí rôzne nastavenia prispôsobenia tlačidiel, ktoré môžete použiť na zmenu vzhľadu tlačidla vášho modulu.
Veľkosť textu tlačidla
Toto nastavenie je možné použiť na zväčšenie alebo zmenšenie veľkosti textu v tlačidle. Tlačidlo sa prispôsobuje podľa toho, ako sa zväčšuje a zmenšuje veľkosť textu.
Farba textu tlačidla
V predvolenom nastavení majú tlačidlá farbu zvýraznenia témy, ako je definované v nástroji Customizer Theme. Táto voľba umožňuje priradiť tlačidlu tohto modulu vlastnú farbu textu. Vyberte si svoju vlastnú farbu pomocou výberu farieb a zmeňte farbu tlačidla.
Farba pozadia tlačidla
Štandardne majú tlačidlá priehľadnú farbu pozadia. To je možné zmeniť výberom požadovanej farby pozadia vo výbere farieb.
Šírka okraja tlačidla
Všetky tlačidlá Divi majú predvolene okraj 2px. Túto hranicu je možné pomocou tohto nastavenia zväčšiť alebo zmenšiť. Okraje je možné odstrániť zadaním hodnoty 0.
Farba ohraničenia tlačidla
V predvolenom nastavení okraje tlačidiel preberajú zvýrazňujúcu farbu témy, ako je definované v nástroji Customizer Theme. Táto možnosť vám umožňuje priradiť vlastnú farbu orámovania tlačidlu tohto modulu. Vyberte si svoju vlastnú farbu pomocou výberu farieb a zmeňte farbu orámovania tlačidla.
Polomer okraja tlačidla
Polomer orámovania ovplyvňuje zaoblenie rohov vašich tlačidiel. Predvolene majú tlačidlá v aplikácii Divi malý polomer okraja, ktorý zaobľuje rohy o 3 pixely. Túto hodnotu môžete znížiť na 0, ak chcete vytvoriť štvorcové tlačidlo, alebo ho výrazne zvýšiť, ak chcete vytvoriť tlačidlá s kruhovými okrajmi.
Rozostup písmen tlačidla
Medzery medzi písmenami ovplyvňujú medzeru medzi jednotlivými písmenami. Ak chcete zväčšiť medzeru medzi jednotlivými písmenami v texte tlačidla, 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.
Button Font
Písmo textu vášho tlačidla 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.
Pridajte ikonu tlačidla
Zakázané, toto nastavenie odstráni ikony z vášho tlačidla. V predvolenom nastavení sa na všetkých tlačidlách Divi zobrazuje ikona šípky pri umiestnení kurzora myši.
Ikona tlačidla
Ak sú ikony povolené, môžete pomocou tohto nastavenia zvoliť, ktorá ikona sa bude vo vašom tlačidle používať. Divi má na výber rôzne ikony.
Tlačidlo s farebnou ikonou
Úpravou tohto nastavenia zmeníte farbu ikony, ktorá sa zobrazí na vašom tlačidle. V predvolenom nastavení je farba ikony rovnaká ako farba textu vášho tlačidla, ale toto nastavenie vám umožňuje upraviť farbu nezávisle.
Tlačidlo umiestnenia ikony
Môžete zvoliť zobrazenie ikony tlačidla vľavo alebo vpravo od tlačidla.
Zobraziť ikonu iba pri umiestnení kurzora myši na tlačidlo
Ikony tlačidiel sa predvolene zobrazujú iba pri umiestnení kurzora myši. Ak chcete, aby sa ikona vždy zobrazovala, vypnite toto nastavenie.
Umiestnite kurzor myši na farbu textu
Keď na tlačidlo umiestnite kurzor myši, použije sa táto farba. Farba sa zmení od základnej farby definovanej v predchádzajúcich nastaveniach.
Farba pozadia tlačidla myši
Keď na tlačidlo umiestnite kurzor myši, použije sa táto farba. Farba sa zmení od základnej farby definovanej v predchádzajúcich nastaveniach.
Tlačidlo hraničného presúvania farieb
Keď na tlačidlo umiestnite kurzor myši, použije sa táto farba. Farba sa zmení od základnej farby definovanej v predchádzajúcich nastaveniach.
Presuňte kurzor na políčko
Keď na tlačidlo umiestnite kurzor myši, použije sa táto hodnota. Hodnota sa zmení od základnej hodnoty definovanej v predchádzajúcich nastaveniach.
Tlačidlo na oddelenie poznámok
Keď na tlačidlo umiestnite kurzor myši, použije sa táto hodnota. Hodnota sa zmení od základnej hodnoty definovanej v predchádzajúcich nastaveniach.
Pokročilé možnosti posuvný modul s plnou šírkou
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.
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.
Automatická animácia
Ak chcete, aby sa kurzor posúval automaticky, bez toho, aby musel návštevník kliknúť na ďalšie tlačidlo, túto možnosť zapnite a potom podľa potreby nastavte rýchlosť otáčania nižšie.
Rýchlosť automatickej animácie (v ms)
Tu môžete určiť, ako rýchlo vybledne kurzor medzi jednotlivými snímkami, ak je vyššie povolená možnosť „Automaticky animovať“. Čím vyššie číslo, tým dlhšia prestávka medzi jednotlivými rotáciami.
Pokračujte v automatickom posúvaní na ukazovateli kurzora
Ak zapnete túto funkciu, automatické posúvanie bude pokračovať na podržaní myši.
Skryť obsah v mobile
S zmenšovaním veľkosti obrazovky na mobilných zariadeniach sa stáva hodnota nehnuteľností na obrazovke čoraz cennejšia. Niekedy je dobré vypnúť niektoré menej dôležité prvky kurzora, aby ste zmenšili veľkosť kurzora a zvýšili jeho čitateľnosť. Povolenie tohto nastavenia skryje textový obsah kurzora v mobilných zariadeniach.
Skryť CTA v mobile
S zmenšovaním veľkosti obrazovky na mobilných zariadeniach sa stáva hodnota nehnuteľností na obrazovke čoraz cennejšia. Niekedy je dobré vypnúť niektoré menej dôležité prvky kurzora, aby ste zmenšili veľkosť kurzora a zvýšili jeho čitateľnosť. Aktivácia tohto nastavenia skryje tlačidlá výzvy na akciu v mobile na mobile.
Prezerajte si obrázky / videá na mobilných zariadeniach
S zmenšovaním veľkosti obrazovky na mobilných zariadeniach sa stáva hodnota nehnuteľností na obrazovke čoraz cennejšia. Niekedy je dobré vypnúť niektoré menej dôležité prvky kurzora, aby ste zmenšili veľkosť kurzora a zvýšili jeho čitateľnosť. Povolením tohto nastavenia sa zobrazia snímky snímok a videá v mobilných zariadeniach (v predvolenom nastavení sú zakázané).
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.
Možnosti obsahu pre prvky snímok s plnou šírkou
Názov
Sem zadajte text názvu kurzora.
Text tlačidla
Ak chcete zobraziť tlačidlo pod obsahom svojej snímky, zadajte text tlačidla tu. Ak nechcete zobraziť tlačidlo, nechajte toto pole prázdne.
Obsah
Sem zadajte obsah tela kurzora. Upozorňujeme, že množstvo textu, ktoré tu zadáte, bude určovať výšku vašich snímok.
Tlačidlo URL
Ak zobrazíte tlačidlo, do tohto poľa zadajte platnú webovú adresu URL a nastavte cieľový odkaz.
Presuňte obrázok
Ak pridáte obrázok snímky, zobrazí sa naľavo od textu snímky nad pozadím snímky. Ak neurčíte obrázok snímky, zostane vám vycentrovaná snímka iba s textom. Pretože výšku každej snímky určuje text, bude mať snímka dostatočne vysokú, takže klesne pod spodnú časť snímky a v dolnej časti sa vytvorí zarovnaný obrázok.
Upozorňujeme, že výšku snímky s obrázkom snímky možno určiť podľa vyššej snímky v posúvači. Ak chcete mať obrázok zarovnaný v dolnej časti, uistite sa, že je snímka dostatočne veľká, aby sa do nej zmestili. Z dôvodu čitateľnosti sa obrázky snímok zobrazujú iba v posúvačoch šírky stĺpca, stĺpca alebo 1 stĺpca. Rovnako sa obrázky snímok nebudú zobrazovať v šírkach prehliadača menších ako 768 pixelov. Šírky obrázka snímky sú definované nižšie. Odporúčame, aby vaše snímky boli minimálne také široké.
Video slide
Ak pridáte video z prezentácie, zobrazí sa naľavo od textu nad pozadím pozadia. Ak neurčíte snímku, budete vľavo so stredovou snímkou, ktorá bude obsahovať iba text. Pretože výšku každej snímky určuje text, bude mať snímka dostatočne vysokú, takže klesne pod spodnú časť snímky a v dolnej časti sa vytvorí zarovnaný obrázok.
Pozastaviť video
Umožnite ostatným hráčom pozastaviť video, keď začnú hrať
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í.
Výška snímky je určená množstvom textu, ktorý pridáte. Ak máte viac snímok, posúvač vezme výšku najvyššej snímky.
Šírka kurzora je určená šírkou prehliadača. Na základe štandardných veľkostí obrazovky odporúčame, aby vaše obrázky boli minimálne 1280 768 x XNUMX pixelov.
Pozícia obrázka na pozadí
V predvolenom nastavení sa obrázky na pozadí zobrazujú v strede snímky. Toto nastavenie môžete použiť na zmenu umiestnenia v hornom, dolnom, ľavom, pravom alebo v ktoromkoľvek zo štyroch rohov snímky.
Veľkosť obrázka na pozadí
V predvolenom nastavení sa obrázky na pozadí proporčne zväčšia, aby sa zabezpečilo, že vyplnia celú snímku. Túto možnosť však môžete použiť na zmenu predvoleného správania. „Pokrytie“ je predvolené správanie, ktorým sa obrázok zväčší tak, aby pokryl celú oblasť snímky. Možnosť „Prispôsobiť“ tiež vynúti, aby obrázok pokryl celú oblasť, vynúti však jeho výšku a šírku tak, aby zodpovedali výške a šírke kurzora. Môže to mať za následok skreslenie obrázka, ale zabráni sa jeho orezaniu. „Skutočná veľkosť“ nezmení mierku obrázka a zobrazí ho v pôvodnej veľkosti.
Farba pozadia
Ak chcete pre svoju snímku použiť iba jednofarebné pozadie, použite výber farby na nastavenie farby pozadia.
Video na pozadí MP4
Všetky videá by sa mali sťahovať v oboch formátoch .MP4 .WEBM, aby sa zabezpečila maximálna kompatibilita vo všetkých prehľadávačoch. Stiahnite si verziu .MP4 tu. Dôležitá poznámka: Pozadia videa sú z mobilných zariadení zakázané. Namiesto toho sa použije váš obrázok bkacground. Z tohto dôvodu by ste mali nastaviť obrázok na pozadí aj video na pozadí, aby ste dosiahli lepšie výsledky.
Video na pozadí WEBM
Všetky videá by sa mali sťahovať v oboch formátoch .MP4 .WEBM, aby sa zabezpečila maximálna kompatibilita vo všetkých prehľadávačoch. Stiahnite si verzie .WEBM tu. Dôležitá poznámka: Pozadia videa sú z mobilných zariadení zakázané. Namiesto toho sa použije váš obrázok bkacground. Z tohto dôvodu by ste mali nastaviť obrázok na pozadí aj video na pozadí, aby ste dosiahli lepšie výsledky.
Šírka videa na pozadí
Ak majú videá mať správnu veľkosť, musíte tu zadať presnú šírku videa (v pixloch).
Pozadie výšky videa
Ak majú videá mať správnu veľkosť, musíte tu zadať presnú výšku videa (v pixloch).
Možnosti návrhu prvkov posuvných prvkov
Použite prekrytie pozadia
Ak je táto možnosť povolená, nad obrázok pozadia a za obsah posúvača sa pridá vlastná farba prekrytia.
Farba prekrytia pozadia
Pomocou výberu farieb vyberte farbu pozadia.
Použite prekrytie textu
Keď je táto možnosť povolená, za text kurzora sa pridá farba pozadia, aby bola čitateľnejšia na obrázkoch na pozadí.
Farba prekrytia textu
Pomocou nástroja na výber farieb vyberte farbu pre textové prekrytie.
Polomer okraja prekrytia textu
Polomer ohraničenia ovplyvňuje zaoblenie rohov oblasti prekrytia textu. Rohy majú predvolene mierne zaoblený okraj 3 pixelov. Túto hodnotu môžete znížiť na 0, čím vytvoríte obdĺžnikový rámček, alebo ju môžete zväčšiť, aby sa rohy ešte viac zaoblili.
Vlastné farebné šípky
Keď umiestnite kurzor myši na modul posúvača, zobrazia sa šípky, ktoré umožňujú návštevníkovi prechádzať jednotlivými snímkami. V predvolenom nastavení tieto šípky dedia farbu hlavného textu snímky. Pomocou tohto nastavenia však môžete pre tieto šípky definovať vlastnú farbu.
Dot Nav Custom Color
V každom kurzore sa pod obsahom kurzora zobrazujú položky navigácie bodmi. Tieto prvky umožňujú používateľovi pohybovať sa kurzorom. Pomocou nástroja na výber farieb v tomto nastavení môžete definovať vlastnú farbu, ktorá sa použije pre tieto prvky.
Vertikálne zarovnanie obrázka
Toto nastavenie určuje vertikálne zarovnanie obrázka. Váš obrázok môže byť vycentrovaný vertikálne alebo zarovnaný na spodok snímky.
Farba textu
Ak je pozadie vašej snímky tmavé, mala by byť farba textu nastavená na „Svetlá“. Naopak, ak je pozadie snímky svetlé, farba textu by mala byť nastavená na hodnotu „Dark“.
Písmo hlavičky
Písmo textu záhlavia 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 hlavičky
Tu môžete upraviť veľkosť textu hlavičky. Posunutím posúvača rozsahu môžete zväčšiť alebo zmenšiť veľkosť textu alebo 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 hodnoty svojej veľkosti.
Farba textu hlavičky
V predvolenom nastavení sa všetky farby textu v Divi zobrazujú ako biele alebo tmavošedé. Ak chcete zmeniť farbu textu 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 jednotlivými písmenami v texte hlavičky, 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 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 jazdca 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 hodnoty svojej veľkosti.
Body Font
Písmo tela 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 v tele
Tu môžete upraviť veľkosť textu. Posunutím posúvača rozsahu môžete zväčšiť alebo zmenšiť veľkosť textu alebo 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 hodnoty svojej veľkosti.
Farba textu tela
V predvolenom nastavení sa všetky farby textu v Divi zobrazujú ako biele alebo tmavošedé. Ak chcete zmeniť farbu textu, vyberte túto farbu vo výbere farieb pomocou tejto možnosti.
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 v 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 tela
Výška riadku ovplyvňuje medzery medzi jednotlivými riadkami textu v tele. Ak chcete zväčšiť medzery 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.
Pre tlačidlo použite vlastné štýly
Povolenie tejto možnosti odhalí rôzne nastavenia prispôsobenia tlačidiel, ktoré môžete použiť na zmenu vzhľadu tlačidla vášho modulu.
Veľkosť textu tlačidla
Toto nastavenie je možné použiť na zväčšenie alebo zmenšenie veľkosti textu v tlačidle. Tlačidlo sa prispôsobuje podľa toho, ako sa zväčšuje a zmenšuje veľkosť textu.
Farba textu tlačidla
V predvolenom nastavení majú tlačidlá farbu zvýraznenia témy, ako je definované v nástroji Customizer Theme. Táto voľba umožňuje priradiť tlačidlu tohto modulu vlastnú farbu textu. Vyberte si svoju vlastnú farbu pomocou výberu farieb a zmeňte farbu tlačidla.
Farba pozadia tlačidla
Štandardne majú tlačidlá priehľadnú farbu pozadia. To je možné zmeniť výberom požadovanej farby pozadia vo výbere farieb.
Tlačidlo Šírka hranice
Všetky tlačidlá Divi majú predvolene okraj 2px. Túto hranicu je možné pomocou tohto nastavenia zväčšiť alebo zmenšiť. Okraje je možné odstrániť zadaním hodnoty 0.
Farba ohraničenia tlačidla
V predvolenom nastavení okraje tlačidiel preberajú zvýrazňujúcu farbu témy, ako je definované v nástroji Customizer Theme. Táto možnosť vám umožňuje priradiť vlastnú farbu orámovania tlačidlu tohto modulu. Vyberte si svoju vlastnú farbu pomocou výberu farieb a zmeňte farbu orámovania tlačidla.
Polomer okraja tlačidla
Polomer orámovania ovplyvňuje zaoblenie rohov vašich tlačidiel. Predvolene majú tlačidlá v aplikácii Divi malý polomer okraja, ktorý zaobľuje rohy o 3 pixely. Túto hodnotu môžete znížiť na 0, ak chcete vytvoriť štvorcové tlačidlo, alebo ho výrazne zvýšiť, ak chcete vytvoriť tlačidlá s kruhovými okrajmi.
Rozostup písmen tlačidla
Medzery medzi písmenami ovplyvňujú medzeru medzi jednotlivými písmenami. Ak chcete zväčšiť medzeru medzi jednotlivými písmenami v texte tlačidla, 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.
Button Font
Písmo textu vášho tlačidla 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.
Pridajte ikonu tlačidla
Zakázané, toto nastavenie odstráni ikony z vášho tlačidla. V predvolenom nastavení sa na všetkých tlačidlách Divi zobrazuje ikona šípky pri umiestnení kurzora myši.
Ikona tlačidla
Ak sú ikony povolené, môžete pomocou tohto nastavenia zvoliť, ktorá ikona sa bude vo vašom tlačidle používať. Divi má na výber rôzne ikony.
Tlačidlo s farebnou ikonou
Úpravou tohto nastavenia zmeníte farbu ikony, ktorá sa zobrazí na vašom tlačidle. V predvolenom nastavení je farba ikony rovnaká ako farba textu vášho tlačidla, ale toto nastavenie vám umožňuje upraviť farbu nezávisle.
Tlačidlo umiestnenia ikony
Môžete zvoliť zobrazenie ikony tlačidla vľavo alebo vpravo od tlačidla.
Zobraziť ikonu iba pri umiestnení kurzora myši na tlačidlo
Ikony tlačidiel sa predvolene zobrazujú iba pri umiestnení kurzora myši. Ak chcete, aby sa ikona vždy zobrazovala, vypnite toto nastavenie.
Umiestnite kurzor myši na farbu textu
Keď na tlačidlo umiestnite kurzor myši, použije sa táto farba. Farba sa zmení od základnej farby definovanej v predchádzajúcich nastaveniach.
Farba pozadia tlačidla myši
Keď na tlačidlo umiestnite kurzor myši, použije sa táto farba. Farba sa zmení od základnej farby definovanej v predchádzajúcich nastaveniach.
Tlačidlo hraničného presúvania farieb
Keď na tlačidlo umiestnite kurzor myši, použije sa táto farba. Farba sa zmení od základnej farby definovanej v predchádzajúcich nastaveniach.
Presuňte kurzor na políčko
Keď na tlačidlo umiestnite kurzor myši, použije sa táto hodnota. Hodnota sa zmení od základnej hodnoty definovanej v predchádzajúcich nastaveniach.
Tlačidlo na oddelenie poznámok
Keď na tlačidlo umiestnite kurzor myši, použije sa táto hodnota. Hodnota sa zmení od základnej hodnoty definovanej v predchádzajúcich nastaveniach.
Rozšírené možnosti kurzora Fullwidth
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.
Alternatívny textový obrázok
Alternatívny text poskytuje všetky potrebné informácie, ak sa obrázok nenačíta, nezobrazuje správne alebo v inej situácii, keď ho užívateľ nevidí. Umožňuje tiež načítanie a rozpoznávanie obrázkov vyhľadávacími nástrojmi.
[vc_row center_row=”yes”][vc_column width=”1/2″][vcex_button target=”blank” layout=”expanded” 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][/vc_column=][vc_column width] /1″][vcex_button url=”https://www.elegantthemes.com/affiliates/idevaffiliate.php?id=2&url=23065&tid40632=tutorials” target=”blank” layout=”expanded” align=”center” font_family = ”Raleway” font_weight=”1″ style=”flat” custom_background=”#c700e” custom_hover_background=”#4226d8f” custom_color=”#ffffff” custom_hover_color=”#ffffff” icon_right=”fa fa-download”]STIAHNUŤ TEMPLATES 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
Dobrý deň,
Ďakujem veľmi pekne za tento návod. Priznám sa, že som úplne stratený a nerobím niečo, čo by malo byť biblické:
vymazať jednu (alebo viac) snímok navyše v mojej divi prezentácii
Samozrejme som videl, že v zozname snímok vytvorenej prezentácie napravo od každého riadku zodpovedajúceho snímke nájdeme ikonu „koša“ a tri malé bodky: ale kliknutie na smetný kôš... pridá kópiu aktuálnej snímky! a kontextové menu neobsahuje žiadny riadok umožňujúci vymazanie.
Niekde som objavil (nepamätám si kde), že som sa musel „umiestniť na snímku, aby sa odstránil“ (uistite sa, že je na obrazovke), ale nič to nezmenilo.
Pracujem na Macu v systéme Mojave. A skúšal som sa pripojiť na WordPress vo Firefoxe ako v Chrome
Ďakujem veľmi pekne za akúkoľvek pomoc, ktorú môžete...a prepáčte za takú hlúpu otázku
haló
Ďakujem za tento tutoriál, je to naozaj kompletné!
Viete, či je možné zmeniť alebo dokonca odstrániť animáciu z textu? pretože to nie je predvolené, ide to zdola nahor na obrázkoch na pozadí a myslím, že to nie je veľmi pekné.
ďakujem
Dobrý deň, Olivier,
Pozeráte sa na príslušné nastavenia textu?
Dobrý deň,
Je možné, že kliknutie na posúvacie tlačidlo presmeruje odkaz URL na novú kartu?
Ďakujem vopred za vaše svetlá!
Ahoj ! dakujem za tvoj clanok. môj problém je, že sa video na pozadí nezobrazuje v mobilných zariadeniach, môj klient to skutočne chcel. Myslel som, že som našiel svoju odpoveď, pretože podľa vášho článku v časti „Pokročilé“ existuje možnosť aktivovať videá v mobile, ktoré sú predvolene deaktivované. ale túto možnosť som na svojom divi nenašiel. Ďakujeme Vám za Vašu odpoveď…
Yanis
Dobrý deň, Yanis,
Je vaše Divi aktuálne?