Divi Tutorial: Hur man lägger till en videomodul till Divi

Att lägga till videor till din sida i Divi är enkelt när du använder videomodulen. Denna modul låter dig bädda in videor från vilken källa som helst, men också att anpassa miniatyrbilden och uppspelningsknappen.

Så lägger du till en videomodul till din sida

Innan du kan lägga till en videomodul på din sida måste du först hoppa in i Divi Builder. När Divi-tema installerat på din webbplats kommer du att märka en knapp Använd Divi Builder ovanför inläggsredigeraren när du skapar en ny sida. Klicka på den här knappen för att aktivera Divi Builder och få tillgång till alla Divi Builder-moduler. Klicka sedan på knappen Använd Visual Builder för att starta generatorn i visuellt läge. Du kan också klicka på knappen Använd Visual Builder när du surfar på din webbplats i förgrunden om du är ansluten till din WordPress-instrumentpanel.

När du har angett Visual Builder kan du klicka på den grå plusknappen för att lägga till en ny modul på din sida. Nya moduler kan bara läggas till inom rader. Om du börjar en ny sida, kom ihåg att först lägga till en rad på din sida.

Leta reda på videomod i listan över mods och klicka på den för att lägga till den på din sida. Modlistan är sökbar, vilket innebär att du också kan skriva ordet “video” och sedan klicka på Enter för att automatiskt hitta och lägga till videomod! När modulen har lagts till hälsas du av listan över modulalternativ. Dessa alternativ är uppdelade i tre huvudgrupper: Innehåll , Conception et advanced .

Använd fallexempel: Lägga till en video på din målsida

Att lägga till en video på din målsida är ett bra sätt att främja dina produkter och öka konverteringarna. I det här exemplet ska jag visa dig hur du kan använda videomodulen för att lägga till en video på din målsida. Jag sätter en röd cirkel där videon ska hamna.

Med Visual Builder lägger jag till ett nytt avsnitt med en rad med full bredd (1 kolumn). I radinställningarna, under fliken Design, väljer jag alternativet "Använd anpassad bredd". För alternativet Anpassad bredd som visas anger jag en anpassad bredd på 767 pixlar. Detta ser till att den videomodul som jag ska lägga till i den här raden inte överstiger denna bredd och blir för stor på större skärmstorlekar.

Sedan lägger jag till videomodulen i raden. Under fliken Innehåll i inställningen Videomodul anger jag video-URL: en för den video jag vill bädda in på min målsida. Jag använder webbadressen till en YouTube-video för detta exempel.

Sedan lägger jag till en webbadress för bildöverlägg för min video genom att klicka på knappen "Skapa video". Detta drar automatiskt en ram från videon för att fungera som ett överlägg med en ny anpassad videoikon.

Under fliken Design ändrar jag färgen på uppspelningsikonen så att den matchar min målsida.

Nu har jag en video för min målsida som ser ren ut och matchar min design.

Nu när du har sett videomodet i aktion, dyk in i alla dess inställningar i avsnitten nedan. Vi har gett en detaljerad titt på vad du hittar på varje flik i modulens inställningar och en förklaring av vad de gör.

Innehållsalternativ

URL till videon

Med Divi Video-modulen kan du lägga till video med två olika metoder. Du kan ladda ner din egen videofil från din dator genom att klicka på knappen "Ladda ner video" och välja önskad fil, eller så kan du ange valfri video-url från videokälla från tredje part, t.ex. Youtube eller Vimeo. Kopiera bara och klistra in URL: en från din webbläsare och klistra in den i fältet Video URL och Divi tar hand om resten!

URL för bildöverlagring

Om du vill ställa in en anpassad videominiatyrbild, som kommer att placeras på standardvideogränssnittet med en anpassad uppspelningsknapp för att skapa ett skarpare och mer stiliserat utseende, kan du välja att göra det med hjälp av fältet Bildöverlagring. Med den här kontrollen kan du antingen ladda upp din egen personliga bild eller automatiskt låta Divi skapa en från webbadressen till din video. De flesta videoleverantörer stöder detta alternativ, som Youtube och Vimeo. Klicka bara på knappen "Skapa video" och låt Divi ta hand om resten!

Admin-etikett

Som standard visas din videomodul med en "Video" -etikett i generatorn. Admin-tagg låter dig ändra denna tagg för enkel identifiering.

Designalternativ

ändra ikonfärg

Om du anger ett bildöverlägg för din videopod innehåller den visade videon en uppspelningsikon över videon. Du kan ange färgen på denna ikon här för att matcha färgerna på din sida.

Alternativ avancées

CSS-identifierare och klasser

Detta kan användas för att lägga till ett CSS-ID eller en klass i din modul. Dessa kan sedan användas i ditt formatmall eller i rutan Temainställningar Anpassad CSS för att tillämpa en anpassad stil på modulen. CSS-ID kan också riktas in med ankarlänkar för att länka till vissa delar av din sida.

Anpassad CSS

Här kan du lägga till anpassad CSS i din videomodul.

synlighet

Om du vill dölja din videomodul på vissa enheter kan du välja enheter som du vill inaktivera videomodulen 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=”platt” custom_background=”#18b69d” custom_hover_background=”#118d7a” custom_color=”#ffffff” custom_hover_color=”#ffffff” icon_right=”fa fa-download”]LADDA NED 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”]LADDA NED DEN TEMPLATES DIVI[/vcex_button][/vc_column][/vc_row]

Divi Tutorial: Hur man lägger till en videomodul till Divi

Så lägger du till en videomodul till din sida

Använd fallexempel: Lägga till en video på din målsida