Hoe laat je een video als popup weergeven in WordPress?

Hoe laat je een video als popup weergeven in WordPress?

Iedereen kan wel een video op zijn of haar WordPress site zetten. Maar in plaats van een video te embedden, kun je er ook voor kiezen om de video weer te geven in een mooi popup venster. Dit geeft een echt wow effect en zorgt tevens dat de layout van je webpagina netjes blijft. Hieronder vertellen we hoe je dat kunt doen.

Stap 1

Download en installeer de WP Video Lightbox plugin.

WP Video Lightbox plugin

Stap 2

Embed de video op de gewenste pagina met behulp van deze shortcode:

Voor Vimeo:

[video_lightbox_vimeo5 video_id=”13562192″ width=”640″ height=”480″ anchor=”click here to open vimeo video”]

Voor YouTube:

[video_lightbox_youtube video_id=”G7z74BvLWUg” width=”640″ height=”480″ anchor=”click here to open YouTube video”]

Je moet de waarde van “video_id” vervangen met de video ID van de video die je wil laten zien.

De waarde van anchor kan zowel een tekst als een afbeelding zijn. Wanneer de gebruiker hierop klik, zal de lightbox pop-up met de betreffende video worden weergegeven.

Stap 3

In plaats van een klikbare tekst of een afbeelding kun je ook een mooie button gebruiken. Dit kun je doen door onderstaande CSS code in het style.css bestand van je thema te kopiëren:

 

/* Button */

button,
input[type=”button”],
input[type=”reset”],
input[type=”submit”],
.button {
background-color: #333;
border: none;
color: #fff;
cursor: pointer;
font-size: 16px;
padding: 14px 22px;
text-transform: uppercase;
width: auto;
}

button:hover,
input:hover[type=”button”],
input:hover[type=”reset”],
input:hover[type=”submit”],
.button:hover {
background-color: #e5554e;
color: #fff;
}

Wil jij meer leren over Wordpress?

In de kennisbank vertellen we je alles over de belangrijkste onderwerpen

  • Snel en gemakkelijk contact met een WordPress expert
  • Ontvang als eerste nieuwtjes & leuke acties
  • Overleg met andere WordPress fans

Je WordPress vraag of probleem razendsnel opgelost met de hulp van een echte WordPress developer!

Join de grootste WordPress community van Nederland & stel je vraag via ons WordPress ticketsysteem.

Medaille-buddy

Blijf op de hoogte van het laatste WordPress nieuws.

Schrijf je in voor onze wekelijkse nieuwsbrief.