WordPress: Com fer una finestra emergent de Facebox de vídeo

Els vídeos de Vimeo i Youtube ara ofereixen vídeos de definició més alta que poden ocupar bastants béns immobles en un lloc web o bloc. Una manera d’optimitzar-ho és utilitzar un mètode anomenat Facebox. Una caixa frontal és un bon mitjà per mostrar una finestra a la pàgina sense una finestra emergent separada.

lifeline-video-button.png

Centres de dades Lifeline tenien un vídeo produït per Another Cool Design que volien presentar a la seva pàgina principal, sense haver de canviar de lloc ni redissenyar el tema. Per tant, hem creat una imatge petita amb un gran botó de reproducció i hem incorporat un codi que genera una finestra elegant per mostrar el vídeo.

lifeline-video-facebox.png

La implementació va ser senzilla mitjançant Complement de la galeria Facebox de WordPress de Truimatge. Vaig crear un pàgina externa (video.html) a l'arrel del lloc que conté el vídeo (amb reproducció automàtica = 1 perquè es reprodueixi automàticament quan s'obre) i, a continuació, afegiu un widget de text amb el fragment necessari.

<a href="video.html" rel = "caixa frontal" onclick = "javascript: pageTracker._trackPageview ('/ special / mypage');"> 

L' rel = facebox la designació és la que inicia el codi un cop es fa clic a l'enllaç. Apareix la caixa frontal del vídeo que comença a reproduir-se immediatament. És una implementació senzilla i una solució fàcil per incrustar un o més vídeos en una pàgina. Utilitzarem aquest mètode en un altre lloc ben aviat.

NOTA: És important capturar el nombre de visualitzacions del vídeo dins del client analítica (Google Analytics), de manera que també hem afegit un esdeveniment onclick a l'etiqueta d'ancoratge. Ara, quan la gent fa clic al vídeo, obtenim una pàgina vista "virtual". He afegit el codi anterior.

3 Comentaris

  1. 1

    Gràcies per escriure un tutorial. Esperem que s’aclareixin algunes coses per implementar contingut en línia en una finestra emergent de la caixa frontal. 🙂

  2. 2

Què et sembla?

Aquest lloc utilitza Akismet per reduir el correu no desitjat. Esbrineu com es processa el vostre comentari.