Vill du ta reda på hur man öppnar en YouTube-video i en popup på WordPress?
La ljuslåda eller modal fönster (pop up) är en mycket vanlig funktion på nätet. Det används dock vanligtvis för att visa bilder, e-postformulär, kampanjer eller till och med registreringsformulär.
Men visste du att det också är möjligt att använda den för att visa videor på Wordpress ? Nej?
Inga bekymmer, i denna handledning kommer jag att visa dig hur du visar en video (YouTube – Vimeo – etc.) i en ljuslåda.
Men tidigare, om du aldrig har installerat WordPress-upptäckt Hur man installerar en Wordpress-blogg 7 steg et Hur man hittar, installera och aktivera en Wordpress tema på din blogg
Tillbaka till varför vi är här.
Skälen till att du bör använda a lightbox för att visa dina videor
den ljuslåda är modala fönster, men vad du inte vet är att inte alla bilder som visas i dem laddas alla under « charge« sida.
Le Navigateur laddning les bilder när ljuslåda öppnas, detta är också fallet för videor. Kort sagt, det är en funktion som låter dina sidor öppnas snabbare. Det gör att du också kan minska storleken (longueur) På sidaneftersom en del av innehållet på denna sida kommer att finnas tillgängligt i detta modalfönster.
Skräck av prat, låt oss komma igång.
Hur man installerar och konfigurera plugin WP Video Lightbox
WP Video Lightbox är en plugin tillgänglig på WordPress.org. Vilket innebär att du kan installera det direkt från din WordPress-instrumentpanel, eller ladda ner den som en .zip-fil.
För mer information, Kolla in vår steg-för-steg-guide för hur du installerar ett WordPress-plugin.
Efter att ha aktiverat plugin, gå till inställningssidan från den här platsen " inställningar >> Vidéo ljuslåda ".
Vi går direkt till " prettyPhoto ".
I verkligheten detta plugin använd en annan plugin, som främst är avsedd för visning av ett fotogalleri. Men du kan ändra en del av informationen som kommer att tillämpas på videor.
För det förklarar jag några alternativ (Obligatoriskt)Så att det är som du vill.
Redan bokhandeln prettyPhoto måste aktiveras (kontrollera « aktivera prettyPhoto »). För att låta användarna veta att de är på samma sida kan du göra fönstret transparent (définir ett värde från 0 till 1. Kommavärden accepteras).
Upptäck Egenskaperna hos en effektiv popup för WordPress
Alla dina ljuslådor kan ha en titel som kan visas (Show rubricerade). Ibland måste du ändra storlek på stora modala fönster (Tillåt ändra storlek). Och för längre videor kan användarna förstora dem (Tillåt Bygga ut), för att bättre titta på dem.
För bredden och höjden på ljuslåda, kan du redigera fälten " standard bredd "Och" standard höjd ".
Att välja tema för ljuslåda, ändra rullgardinsmenyn tema ". Det är också möjligt att aktivera autoplay (kryssa i rutan " Auto »).
Hur visas en ljuslåda i en artikel
Le plugin föreslår en lista över kortkoder som gör att du kan visa ljuslåda i artiklar. Jag glömde att berätta att du också kan se de videor som finns tillgängliga på Vimeo.
För att se en video Youtube ou Vimeodu måste använda kortkoder suivant:
[video_lightbox_youtube] (pour YouTube)
[video_lightbox_vimeo5] (pour Vimeo)
Var och en av dessa kortkoder accepterar parametrar, som gör att du kan:
- Definiera identifieraren (video_id) av en video, vanligtvis i det här formatet " YzqKMmQ_3Sg ". Exemple [video_lightbox_youtub video_id = "YzqKMmQ_3Sg"]
- Ställ in höjden på videon (höjd)
- Ställ in videoklippets bredd (bredd)
- Lägg till en beskrivning (beskrivning)
- Lägg till ett HTML-ankare (ankare) eller texten till länken som öppnar fönstret
- Lägg till en miniatyrbild (auto_thumb)
Om du ställer in ett HTML-ankare ignoreras miniatyren. annars auto_thumb tar värdet " 1 ".
Gå längre genom att upptäcka också Hur man använder och hanterar kortkoder Wordpress
Demo om en användning
Med det jag just gav dig information kan du visa en video med en kod som liknar den här:
[video_lightbox_youtube video_id="YzqKMmQ_3Sg&rel=0" width="640" height="480" anchor="Une simple vidéo" description="Par Dr WP"]
För ett liknande resultat
Du kan se en miniatyrbild som visas ovan med en kod som liknar den här.
[video_lightbox_youtube video_id="YzqKMmQ_3Sg&rel=0" width="640" height="480" auto_thumb="1" description="Par Dr WP"]
För ett resultat som är identiskt med det här
innan du lämnar
Det bör noteras att vissa parametrar i kortkoder kommer att skriva över de som definierats i inställningarna.
Upptäck också några premium WordPress-plugins
Du kan använda andra Wordpress plugins för att ge ett modernt utseende och för att optimera hanteringen av din blogg eller hemsida.
Vi erbjuder dig här några premium WordPress-plugins som hjälper dig att göra det.
1. FileBird
Har du någonsin kämpat för att hantera tusentals bild-, video- eller dokumentfiler som du laddat upp till din WordPress FTP? ja eller nej, det spelar ingen roll, det viktiga är att veta att Wordpress plugin FileBird hjälper dig att hantera dina mediefiler med lätthet och ge mer kraft till ditt bibliotek.
Dess sömlösa användargränssnitt och snabbmeny gör det möjligt för användare att dra och släppa filer till mappar eller har de nödvändiga rättigheterna för att snabbt skapa, byta namn på eller ta bort mappar på samma sätt som du gör på din dator. Med detta plugin i handen organiseras dina mediefiler systematiskt och du kan enkelt välja en bild som du vill infoga på en sida eller publicera den.
Upptäck också vår 6 WordPress-plugins för att blåsa nytt liv i dina artiklar
Dessutom är detta plugin helt kompatibelt med de mest populära plugins, särskilt med WooCommerce, och stöder även ett stort antal språk. Så om du vill ge ditt mediebibliotekshantering ett lyft, Wordpress plugin FileBird kan vara ditt hemliga vapen.
Ladda ner | demo | webbhotell
2. Social Share & Locker Pro
Pluggen Social Share & Locker Pro har utformats för att hjälpa din webbplats att bli mer synlig på sociala nätverk. Med bara några få klick kan du antingen ställa in positionen för dina sociala ikoner eller låsa ditt innehåll genom att kräva delning på ett av de sociala nätverk som erbjuds av dig.
Du har tio mallar som ska täcka de vanligaste önskemålen. Alla dess modeller är perfekta och fungerar underbart. Dessutom kan du med Social Share & Locker Pro visa hela namnet på sociala nätverk eller bara ikonen. Det beror på din design, tillgängligt utrymme eller din smak.
Ladda ner | demo | webbhotell
3. Kontaktformulär 7 Verktygstips
Cette WordPress plugin av Contact Form 7-pluginet ger en enkel verktygstipsfunktion till din Contact Form 7-plugin. Dess verktygstips visas när målelementet hålls över. På mobila enheter visar verktygstips när målelementet är aktiverat.
Dess huvudfunktioner är: användarvänlighet, stöd för alla versioner av kontaktformulär 7, anpassning av bakgrundsfärgen på verktygstips, stöd för HTML-kod, fullständig layout lyhörd och mer.
Ladda ner | demo | webbhotell
Andra rekommenderade resurser
Vi inbjuder dig också att konsultera resurserna nedan för att gå vidare i greppet och kontrollen av din webbplats och blogg.
- Elementor: Hur man öppnar en popup från en url eller meny
- Hur man nedgraderar en version av ett WordPress-plugin
- Hur hittar jag en sponsor och tjänar pengar på din blogg? : Guiden
- Hur man anpassa Wordpress instrumentbrädan för en klient
- Hur man skapar en lyhörd meny för mobil Wordpress
Slutsats
Där! Det är det för denna handledning, hoppas att det hjälper dig att visa Youtube eller Vimeo-videor i en lightbox på din WordPress-webbplats. Känn dig fri att dela med dina vänner på dina favorit sociala nätverk.
Du kommer dock också att kunna konsultera vår medel, om du behöver fler element för att genomföra dina projekt för att skapa webbplatser, genom att konsultera vår guide om WordPress blogg skapande.
Men under tiden berätta om din commentaires och förslag i det dedikerade avsnittet.
.
Hej!
Jag letar efter ett sätt att visa en video popup efter ett klick av en knapp. Är det möjligt att göra det med WP Video Lightbox?
tack,
Hälsningar,
Hej!
Ja i princip.
jag hade glömt
tack
Hej och grattis för handledning.
är det möjligt att förstora videominiatyren när jag använder "auto_thumb"?
I princip använder "auto_thumb" en fördefinierad bild med fasta storlekar.
Hej!
Tack så mycket för denna välkonstruerade handledning, jag ville veta om det var möjligt att lägga till videor från andra plattformar än You Tube och Vimeo (Openload-exempel) eller om det skulle finnas en gräns.
er
Hej!
Ja i princip. Vi har inte testat än.