Tilføjelse af videoer til din side i Divi er enkelt, når du bruger videomodulet. Dette modul giver dig mulighed for at integrere videoer fra enhver kilde, men også til at tilpasse miniaturebilledet og afspilningsknappen.
Sådan føjes et videomodul til din side
Før du kan tilføje et videomodul til din side, skal du først hoppe ind i Divi Builder. En gang Divi-tema installeret på din hjemmeside, vil du bemærke en knap Brug Divi Builder over indlægseditoren, når du opretter en ny side. Klik på denne knap for at aktivere Divi Builder og få adgang til alle Divi Builder-modulerne. Klik derefter på knappen Brug Visual Builder for at starte generatoren i visuel tilstand. Du kan også klikke på knappen Brug Visual Builder når du gennemser dit websted i forgrunden, hvis du er tilsluttet dit WordPress-dashboard.
Når du har indtastet Visual Builder, kan du klikke på den grå plus-knap for at tilføje et nyt modul til din side. Nye moduler kan kun tilføjes inden for rækker. Hvis du starter en ny side, skal du huske at føje en række til din side først.
Find videomodet på listen over mods, og klik på det for at tilføje det til din side. Listen over mods er søgbar, hvilket betyder, at du også kan skrive ordet "video" og derefter klikke på enter for automatisk at finde og tilføje video mod! Når modulet er tilføjet, vil du blive mødt af listen over modulindstillinger. Disse muligheder er opdelt i tre hovedgrupper: Indhold , Conception et avanceret .
Brug eksempeleksempel: Tilføjelse af en video til din destinationsside
Tilføjelse af en video til din landingsside er en fantastisk måde at gøre det på fremme dine produkter og øge antallet af konverteringer. I dette eksempel vil jeg vise dig, hvordan du kan bruge videomodulet til at tilføje en video til din landingsside. Jeg sætter en rød cirkel, hvor videoen skal hen.
Ved hjælp af Visual Builder tilføjer jeg et nyt afsnit med en fuldbredderække (1 kolonne). I rækkeindstillingerne under fanen Design vælger jeg indstillingen "Brug brugerdefineret bredde". For den tilpassede breddeindstilling, der vises, indtaster jeg en brugerdefineret bredde på 767 px. Dette sørger for, at det videomodul, jeg vil tilføje i denne række, ikke overstiger denne bredde og bliver for stort på større skærmstørrelser.
Derefter tilføjer jeg videomodulet til rækken. Under fanen Indhold i indstillingen Videomodul indtaster jeg videoens URL til den video, jeg vil integrere på min destinationsside. Jeg bruger URL'en til en YouTube-video til dette eksempel.
Derefter tilføjer jeg en billedoverlay-url til min video ved at klikke på knappen "Generer video". Dette trækker automatisk en ramme fra videoen for at fungere som et overlay med et nyt tilpasset videoikon.
Under fanen Design ændrer jeg farven på afspilningsikonet, så det matcher min destinationsside.
Nu har jeg en video til min destinationsside, der ser ren ud og matcher mit design.
Nu hvor du har set video-modet i aktion, kan du dykke ned i alle dets indstillinger i afsnittene nedenfor. Vi har givet et detaljeret kig på, hvad du finder i hver fane i modulets indstillinger og en forklaring på, hvad hver enkelt gør.
Indholdsindstillinger
URL til videoen
Divi Video-modulet giver dig mulighed for at tilføje video ved hjælp af to forskellige metoder. Du kan uploade din egen videofil fra din computer ved at klikke på knappen "Download video" og vælge den ønskede fil, eller du kan indtaste enhver video-URL fra tredjeparts videokilde, såsom Youtube eller Vimeo. Bare kopier og indsæt URL'en fra din browser og indsæt den i feltet Video URL, og Divi tager sig af resten!
URL til billedoverlay
Hvis du vil indstille et brugerdefineret videominiaturebillede, der placeres på standardvideointerfacet med en brugerdefineret afspilningsknap for at skabe et skarpere og mere stiliseret udseende, kan du vælge at gøre det ved hjælp af feltet Billedoverlay. Denne kontrol giver dig enten mulighed for at uploade dit eget personlige billede eller automatisk lade Divi generere et fra URL'en til din video. De fleste videoudbydere understøtter denne mulighed, som Youtube og Vimeo. Klik blot på knappen "Generer video" og lad Divi tage sig af resten!
Admin Label
Som standard vises dit videomodul med en 'Video' -etiket i generatoren. Admin-taggen giver dig mulighed for at ændre dette tag for nem identifikation.
Design muligheder
skift ikonfarve
Hvis du udpeger et billedoverlay til din videopod, indeholder den viste video et afspilningsikon over videoen. Du kan udpege farven på dette ikon her for at matche farverne på din side.
Valgmuligheder avancées
CSS-id og klasser
Dette kan bruges til at tilføje et CSS-ID eller en klasse til dit modul. Disse kan derefter bruges i dit typografiark eller i feltet Temaindstillinger Brugerdefineret CSS til at anvende en brugerdefineret stil til modulet. CSS-id'er kan også målrettes med ankerlink til link til bestemte områder på din side.
Tilpasset CSS
Her kan du tilføje tilpasset CSS til dit videomodul.
synlighed
Hvis du vil skjule dit videomodul på nogle enheder, kan du vælge de enheder, som du vil deaktivere videomodulet på.
[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=”flad” custom_background=”#18b69d” custom_hover_background=”#118d7a” custom_color=”#ffffff” custom_hover_color=”#ffffff” icon_right=”fa fa-download”]DOWNLOAD DIVI TEMA [/vcex_button][/vc_column 1 ][vc_column" /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”]DOWNLOAD THE TEMPLATES DIVI[/vcex_button][/vc_column][/vc_row]
Andre Divi tutorials
- 5 websteder, der bruger Divi restaurant tema
- Sådan tilføjer du tekst på et Divi WooCommerce-produkt
- Sådan ændres menuen farve mellem Divi sider
- Sådan tilpasses tavlerne på en blog med Divi
- Sådan bruges rolle Divi redaktør på WordPress
- Sådan opretter du en Divi-skyder på fuld skærm
- Sådan ændres menuenes farve mellem Divi-sider
- Funktioner, som du sandsynligvis ikke kender til Divi
- Sådan bruger du Divi Builder på WordPress
- Sådan bruges Divi-video-rullemodulet
- Sådan bruges Divi Builder Flip-modulet
- Sådan tilføjes et vidnesbyrdsmodul om Divi Builder
- Sådan bruges Divi-tekstmodulet
- Sådan opretter du en skyder på Divi
- Sådan redigeres en Divi-brugerrolle
- Sådan bruges Divi Social Media-modulet
- Sådan bruges butikmodulet med temaet WordPress Divi
- Sådan bruges Divi sidebar modul
- Sådan bruges Divi Price Table Module
- Sådan bruges titelmodulet i Divi-publikationer
- Sådan tilføjes et videomodul til Divi
- Sådan bruges artikelnavigationsmodulet
- Sådan bruges Divi-søgemodulet
- Sådan bruges Divi wallet-modulet
- Sådan bruges personmodulet på Divi Builder
- Sådan bruges tegnebogen modulet med Divi filter
- Sådan bruges glidemodulet i fuld bredde
- Sådan bruges Divi Builder Image Module
- Sådan bruger du navigationsmodulet med fuld bredde i Divi Builder
- Sådan bruges billedgallerimodulet
- Sådan bruges Divi Builder Fuldbredde-kortmodul
- Sådan bruges Divi Full Width Portfolio Module
- Sådan bruges Divi-modulet i fuld bredde
- Sådan bruges Divi Counter Module
- Sådan bruges artikelskyderen på Divi Builder
- Sådan bruges Divi Email Optin-modulet
