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.

divi builder

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.

modul video divi.png

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.

crearea unui videoclip pe divi exemple.jpg

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.

utilizați o lățime personalizată divi.png

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.

adăugați un videoclip pe divi.png

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ă.

adăugați o suprapunere divi video.jpg

Sub fila Proiectare, schimb culoarea pictogramei de redare pentru a se potrivi cu pagina mea de destinație.

editați pictograma player divi video.jpg

Acum am un videoclip pentru pagina mea de destinație, care arată curat și se potrivește cu designul meu.

design final cu conținutul video.jpg

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

parametru modul divi.png

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

proiectare secțiune divi.png design

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

modul video avansat section.png

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