Openen video in Lightbox deel 2

In een vorige blogpost heb ik aandacht gegeven aan een succesvolle poging om een video binnen een WordPress website te openen via een Lightbox applicatie. Klik hier om dat artikel te lezen. Dat verhaal heeft een vervolg via een andere klant die hetzelfde lijkt te willen. In het vorige artikel wilde de klant de video openen vanuit een Slider op de voorpagina en deze klant wil de video openen vanuit een grid pagina template in WordPress. De template toont op de pagina allemaal foto-s die vervolgens linken naar een post waarbinnen de video bekeken kan worden. Kortom: de pagina zelf bevat geen video-s.

Plaatsen video via Post titel in WordPress

Door de YouTube video te laten embedden in een iframe en deze code te plaatsen in de titel van de post, wordt in plaats van de titel de video getoond. Dit is de gebruikte code:

<iframe width="150" height="90" src="http://www.youtube.com/embed/UI92ohtn1rM" frameborder="0" 
allowfullscreen>http://www.youtube.com/watch?v=UI92ohtn1rM</iframe>

De video wordt nu in een klein vakje getoond.

Toevoegen van de lightbox relatie

Dat lukt met niet via een iframe. Code die ik plaats in de titel waarmee wel een Lightbox geopend wordt is de volgende:

<a rel="wp-video-lightbox" href="http://www.youtube.com/embed/UI92ohtn1rM">Click here</a>

Maar foutmelding is dan:

Image cannot be loaded. Make sure the path is correct and image exist.

Probleem is hier (alleen) dat ik de verkeerde YouTube code heb gebruikt. Hier mag ik niet EMBED gebruiken maar WATCH en code is dan:

<a rel="wp-video-lightbox" href="https://www.youtube.com/watch?v=UI92ohtn1rM">Click here</a>

Resultaat? De video wordt geopend in een mooie Lightbox. Het grote voordeel van deze ontdekkingstocht is dat ik heb aangetoond hoe de post titel van een WordPress post gebruikt kan worden om bijvoorbeeld een video te tonen in plaats van een titel. Dat is handig bij WordPress thema-s waarbij op de voorpagina (alleen) de titel van de verschillende posts getoond worden. Een lijst met post titels kan nu een lijst met video-s worden.

Video-in-lightbox-youtube

Geef een reactie

Het e-mailadres wordt niet gepubliceerd. Vereiste velden zijn gemarkeerd met *