Adăugarea videoclipurilor pe pagina dvs. în Divi este simplă atunci când utilizați modulul Video. Acest modul vă permite să încorporați videoclipuri din orice sursă, dar și să personalizați imaginea în miniatură și butonul de redare.
Cum să adăugați un modul video pe pagina dvs.
Înainte de a putea adăuga un modul video la pagina dvs., trebuie mai întâi să accesați Divi Builder. Odata ce Divi tema instalat pe site-ul dvs., veți observa un buton Utilizați Divi Builder deasupra editorului de postare ori de câte ori creați o pagină nouă. Faceți clic pe acest buton pentru a activa Divi Builder și pentru a accesa toate modulele Divi Builder. Apoi faceți clic pe buton Utilizați Visual Builder pentru a porni generatorul în modul vizual. De asemenea, puteți face clic pe buton Utilizați Visual Builder când îți răsfoiești site-ul în prim plan dacă ești conectat la tabloul de bord WordPress.
După ce ați intrat în Visual Builder, puteți face clic pe butonul plus gri pentru a adăuga un nou modul la pagina dvs. Modulele noi pot fi adăugate numai în rânduri. Dacă începeți o pagină nouă, nu uitați să adăugați mai întâi un rând la pagina dvs.
Localizați modul video în lista de moduri și faceți clic pe acesta pentru a-l adăuga la pagina dvs. Lista de moduri poate fi căutată, ceea ce înseamnă că puteți, de asemenea, să tastați cuvântul „video” și apoi să faceți clic pe Enter pentru a găsi și adăuga automat modul video! Odată adăugat modulul, veți fi întâmpinat de lista de opțiuni a modulului. Aceste opțiuni sunt separate în trei grupe principale: Conținut , Concepție et avansat .
Exemplu de caz de utilizare: adăugarea unui videoclip la pagina dvs. de destinație
Adăugarea unui videoclip pe pagina de destinație este o modalitate excelentă de a face acest lucru promova produsele dvs. și creșteți numărul de conversii. În acest exemplu, vă voi arăta cum puteți utiliza modulul video pentru a adăuga un videoclip pe pagina dvs. de destinație. Am pus un cerc roșu unde ar trebui să meargă videoclipul.
Folosind Visual Builder, adaug o nouă secțiune cu un rând cu lățime completă (1 coloană). În setările de rând, sub fila Proiectare, selectez opțiunea „Utilizați lățimea personalizată”. Pentru opțiunea Lățime personalizată care apare, introduc o lățime personalizată de 767 px. Acest lucru asigură faptul că modulul video pe care îl voi adăuga în acest rând nu depășește această lățime și devine prea mare pe dimensiuni mai mari ale ecranului.
Apoi adaug modulul video la rând. Sub fila Conținut a setării modulului video, introduc adresa URL a videoclipului pe care doresc să îl încorporez pe pagina de destinație. Pentru acest exemplu folosesc adresa URL a unui videoclip YouTube.
Apoi, adaug o adresă URL de suprapunere a imaginii pentru videoclipul meu, făcând clic pe butonul „Generați videoclip”. Aceasta extrage automat un cadru din videoclip pentru a servi ca suprapunere cu o nouă pictogramă video personalizată.
Sub fila Proiectare, schimb culoarea pictogramei de redare pentru a se potrivi cu pagina mea de destinație.
Acum am un videoclip pentru pagina mea de destinație, care arată curat și se potrivește cu designul meu.
Acum că ați văzut modul video în acțiune, intrați în toate setările sale în secțiunile de mai jos. Am oferit o privire detaliată asupra a ceea ce veți găsi în fiecare filă a setărilor modulului și o explicație a ceea ce face fiecare.
Opțiuni de conținut
URL-ul videoclipului
Modulul Divi Video vă permite să adăugați videoclipuri utilizând două metode diferite. Puteți descărca propriul fișier video de pe computer făcând clic pe butonul „Descărcați video” și selectând fișierul dorit, sau puteți introduce orice adresă URL video de la o sursă video terță parte, cum ar fi Youtube sau Vimeo. Doar copiați și lipiți URL-ul din browserul dvs. și lipiți-l în câmpul URL video, iar Divi se va ocupa de restul!
Adresa URL de suprapunere a imaginii
Dacă doriți să setați o imagine miniatură video personalizată, care va fi plasată pe interfața video standard cu un buton de redare personalizat pentru a crea un aspect mai clar și mai stilizat, puteți alege să faceți acest lucru folosind câmpul Suprapunere imagine. Acest control vă permite fie să încărcați propria imagine personalizată, fie să permiteți automat Divi să genereze una din adresa URL a videoclipului dvs. Majoritatea furnizorilor de video acceptă această opțiune, cum ar fi Youtube și Vimeo. Pur și simplu faceți clic pe butonul „Generați video” și lăsați-l pe Divi să se ocupe de restul!
Admin Label
În mod implicit, modulul dvs. video va apărea cu o etichetă „Video” în generator. Eticheta de administrare vă permite să modificați această etichetă pentru o identificare ușoară.
Opțiuni de proiectare
schimbați culoarea pictogramei
Dacă desemnați o suprapunere de imagine pentru podul dvs. video, videoclipul afișat conține o pictogramă de redare deasupra videoclipului. Puteți desemna culoarea acestei pictograme aici pentru a se potrivi culorilor de pe pagina dvs.
Opțiuni avansate
Identificator CSS și clase
Acesta poate fi folosit pentru a adăuga un ID CSS sau o clasă la modulul dvs. Acestea pot fi apoi utilizate în foaia de stil sau în caseta CSS personalizată Opțiuni temă pentru a aplica un stil personalizat modulului. ID-urile CSS pot fi, de asemenea, vizate cu linkuri de ancorare pentru a face legătura cu anumite zone ale paginii dvs.
CSS personalizate
Aici puteți adăuga CSS personalizat la modulul dvs. video.
vizibilitate
Dacă doriți să ascundeți modulul video pe unele dispozitive, puteți selecta dispozitivele pe care doriți să dezactivați modulul video.
[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”]DESCĂRCĂ TEMA DIVI [/vcex_button][/vc_column][vc_column] width=” 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=”fa fa-download”]DESCARCĂ ȘABLOANELOR DIVI[/vcex_button][/vc_column][/vc_row]
Alte tutoriale Divi
- site-uri web 5 pentru utilizare restaurant tematic Divi
- Cum să adăugați text pe un produs Divi WooCommerce
- Modificarea culorii meniului între paginile Divi
- Cum să personalizați grilele unui blog cu Divi
- Cum de a utiliza rolul editor Divi pe WordPress
- Cum se creează un glisor Divi pe ecran complet
- Modificarea culorii meniurilor între paginile Divi
- Caracteristici pe care probabil nu le cunoașteți despre Divi
- Cum se utilizează Divi Builder pe WordPress
- Cum se utilizează modulul de defilare video Divi
- Cum se utilizează modulul Divi Builder Flip
- Cum să adăugați un modul de mărturie pe Divi Builder
- Cum se utilizează modulul de text Divi
- Cum se creează un slider pe Divi
- Cum se editează un rol de utilizator Divi
- Cum se utilizează modulul Divi Social Media
- Cum se utilizează modulul magazin pe tema WordPress Divi
- Cum se utilizează modulul bara laterală Divi
- Cum se utilizează modulul de prețuri pentru divi
- Cum se utilizează modulul de titlu al publicațiilor Divi
- Cum se adaugă un modul video de Divi
- Cum să utilizați modulul de navigare pentru articole
- Cum se utilizează modulul de căutare Divi
- Cum se utilizează modulul portofel Divi
- Cum se utilizează modulul persoană pe Divi Builder
- Cum se utilizează modulul portofel cu filtrul Divi
- Modul de utilizare a modulului glisant cu lățime întreagă
- Cum se utilizează modulul de imagine Divi Builder
- Modul de utilizare a modulelor de navigație full-width din Divi Builder
- Cum se utilizează modulul galerie de imagini
- Modul de utilizare a modulului de carduri cu dimensiuni multiple de la Divi Builder
- Cum să utilizați modulul de portofoliu Full Width Divi
- Cum se utilizează modulul antet de Divi pentru lățimea completă
- Cum se utilizează modulul Counter Modul Divi
- Cum se utilizează glisorul de articole pe Divi Builder
- Cum se utilizează modulul Divi Email Optin