WordPress: come creare un video pop-box Facebox

I video di Vimeo e Youtube ora offrono video ad alta definizione che possono occupare un bel po 'di spazio su un sito web o un blog. Un modo per ottimizzarlo è utilizzare un metodo chiamato Facebox. Un facebox è un bel mezzo per visualizzare una finestra all'interno della tua pagina senza una finestra popup separata.

lifeline-video-button.png

Lifeline Data Center avevano un video prodotto da Another Cool Design che volevano presentare sulla loro home page, senza dover spostare o ridisegnare il tema. Quindi, abbiamo creato una bella piccola immagine con un grande pulsante di riproduzione e un codice incorporato che genera un'elegante finestra per visualizzare il video all'interno.

lifeline-video-facebox.png

L'implementazione è stata semplice utilizzando il Plugin della galleria di WordPress Facebox da Truimage. Ho creato un file pagina esterna (video.html) nella radice del sito che contiene il video (con autoplay = 1 in modo che venga riprodotto automaticamente quando si apre), quindi aggiunto un widget di testo con lo snippet necessario.

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

I rel = facebox la designazione è ciò che avvia il codice una volta che si fa clic sul collegamento. Viene visualizzata la casella facciale video che inizia a essere riprodotta immediatamente. È un'implementazione semplice e una soluzione facile per incorporare uno o più video in una pagina. Presto utilizzeremo questo metodo su un altro sito!

NOTA: è importante acquisire il numero di visualizzazioni con il video all'interno del client analitica (Google Analytics), quindi abbiamo anche aggiunto un evento onclick all'anchor tag. Ora, quando le persone fanno clic sul video, otteniamo una visualizzazione di pagina "virtuale". Ho aggiunto il codice sopra.

Commenti

  1. 1

    Grazie per aver scritto un tutorial. Si spera che chiarirà alcune cose per l'implementazione del contenuto in linea in un pop-up di facebox. 🙂

  2. 2

Cosa ne pensi?

Questo sito utilizza Akismet per ridurre lo spam. Scopri come vengono elaborati i dati dei tuoi commenti.