WordPress: Como facer unha ventá emerxente de Facebox de vídeo

Os vídeos de Vimeo e Youtube agora ofrecen vídeos de alta definición que poden ocupar bastante inmobiliario nun sitio web ou blog. Unha forma de optimizar isto é empregar un método chamado Facebox. Un Facebox é un bo medio para amosar unha xanela dentro da súa páxina sen unha xanela emerxente separada.

lifeline-video-button.png

Centros de datos Lifeline tiña un vídeo producido por Another Cool Design que querían presentar na súa páxina de inicio, sen ter que recolocar ou redeseñar o tema. Entón, fixemos unha pequena imaxe agradable cun gran botón de reprodución e incorporamos código que xera unha fiestra elegante para amosar o vídeo dentro.

lifeline-video-facebox.png

A implementación foi sinxela empregando o Complemento de galería Facebox de WordPress de Truimaxe. Creei un páxina externa (video.html) na raíz do sitio que ten o vídeo (con reprodución automática = 1 para que se reproduza automaticamente cando se abre) e despois engadiu un widget de texto co fragmento necesario.

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

o rel = facebox a designación é a que inicia o código unha vez que se fai clic na ligazón. Aparece a caixa de vídeo do vídeo que comeza a reproducirse de inmediato. É unha implementación sinxela e unha solución sinxela para inserir un ou máis vídeos nunha páxina. Usaremos este método noutro sitio moi pronto.

NOTA: É importante capturar o número de visualizacións co vídeo dentro do cliente analítica (Google Analytics), polo que tamén engadimos un evento onclick na etiqueta de áncora. Agora, cando a xente fai clic no vídeo, obtemos unha páxina vista "virtual". Engadín o código anterior.

3 Comentarios

  1. 1

    Grazas por escribir un tutorial. Esperemos que aclare algunhas cousas para implementar contido en liña nunha ventá emerxente de caixa de cara. 🙂

  2. 2

¿Que pensas?

Este sitio usa Akismet para reducir o spam. Aprende a procesar os teus datos de comentarios.