Accentsconagua

Consejo rápido tu propio código corto de video

Código
Share

Probablemente utilice un complemento de inserción de video o simplemente utilice los códigos de inserción de los sitios de video. Pero hay una tercera forma más fácil de incrustar videos en su sitio de WordPress: un código corto de video simple (pero útil).

¿Por qué debería usar un video??

  • Porque los complementos de inserción de video son solo otra pequeña carga para tu blog. Ocupan algo de espacio en su disco (concedido, no más de 1 MB), siempre consultan su base de datos para conocer sus opciones y usted necesita aprender como usar los plugins.
  • Debido a que la incrustación de los códigos de los sitios de video puede estar dañada, especialmente cuando se cambia entre el editor WYSIWYG y el editor HTML.
  • Y lo más importante: ¡porque los códigos cortos son impresionantes! Son fáciles de usar, pueden tener la funcionalidad de muchos complementos y su código no se interrumpe en tus publicaciones.!

Explorando los sitios de video

Vamos a trabajar con 7 sitios de alojamiento de videos:

  1. YouTube (obviamente!)
  2. Vimeo
  3. Dailymotion
  4. Yahoo! Pantalla
  5. Blip.tv
  6. Veoh
  7. Viddler

Veamos cómo se ven sus códigos de inserción:

Youtube

El código de inserción predeterminado se ve así:

 / * Video original: youtube.com/watch?v=dQw4w9WgXcQ * /

Pero hay una opción, el "modo mejorado de privacidad" que agrega "-nocookie" al dominio y lo usaremos en nuestro código corto.

Vimeo

 / * Video original: vimeo.com/36804448 * /

Sencillo y elegante. Por eso la gente ama a Vimeo..

Dailymotion

 / * Video original: dailymotion.com/video/xhwpbg_bridgestone-15-sec-spot_auto * / 
BridgeStone 15 seg lugar por DailymotionUSA

Creo que agregar un enlace debajo del código de inserción es simplemente no es genial, así que no estamos agregando eso a nuestro código corto.

Yahoo! Pantalla

 / * Video original: screen.yahoo.com/mysterious-death-of-500-fish-in-german-lake-blamed-on-urinating-swimmers-29322943.html * /

El código de inserción es un poco raro en Yahoo! Pantalla, pero encontré una forma de acortarlo que será más fácil de usar en nuestro código corto.

Blip.tv

 / * Video original: blip.tv/mister-glasses/episode-7-5600357 * /

Esto es difícil: no tiene la ID del video (de la URL del video) en el código de inserción. Pero gracias a algunas investigaciones, ¡descubrí cómo usar la identificación! :)

Veoh

 / * Video original: veoh.com/watch/v27458670er62wkCt * / 
Mira gato intenso en los animales | Ver más videos gratis en línea en Veoh.com

Ah, la Etiqueta ... No te preocupes, no la vamos a usar.!

Viddler

 / * Video original: viddler.com/v/978c9ba2 * /

Eso es todo. Ahora, vamos a la parte divertida!

El código corto: [vid]

Crearemos 4 atributos para este código abreviado: el nombre del sitio, la ID del video y el ancho y la altura del video. Puede establecer algunos valores por defecto para los atributos:

 function vid_sc ($ atts, $ content = null) extract (shortcode_atts (array ('site' => 'youtube', 'id' => ", 'w' => '400', 'h' => '250 '), $ atts)); add_shortcode (' vid ',' vid_sc ');

Luego viene la parte donde la función genera el $ src variable que genera el src atributo para el iframe:

 // YouTube con "modo mejorado con la privacidad": if ($ site == "youtube") $ src = 'http://www.youtube-nocookie.com/embed/'.$id;  // Vimeo: else if ($ site == "vimeo") $ src = 'http://player.vimeo.com/video/'.$id;  // Dailymotion: else if ($ site == "dailymotion") $ src = 'http://www.dailymotion.com/embed/video/'.$id;  // Yahoo! Pantalla con algunos cortes en el URI: else if ($ site == "yahoo") $ src = 'http://d.yimg.com/nl/vyc/site/player.html#vid='.$id ;  // Blip.tv con algunos "hacks" en el URI: else if ($ site == "bliptv") $ src = 'http://a.blip.tv/scripts/shoggplayer.html#file=http : //blip.tv/rss/flash/'.$id;  // El URI de Veoh también tiene algunos hacks: else if ($ site == "veoh") $ src = 'http://www.veoh.com/static/swf/veoh/SPL.swf?videoAutoPlay= 0 & permalinkId = '. $ Id;  // Viddler: else if ($ site == "viddler") $ src = 'http://www.viddler.com/simple/'.$id;

Y por supuesto, nosotros regreso La salida. Aquí está el código completo de nuestro nuevo código corto de video:

 function vid_sc ($ atts, $ content = null) extract (shortcode_atts (array ('site' => 'youtube', 'id' => ", 'w' => '600', 'h' => '370 '), $ atts)); if ($ site == "youtube") $ src =' http://www.youtube-nocookie.com/embed/'.$id; else if ($ site == "vimeo") $ src = 'http://player.vimeo.com/video/'.$id; else if ($ site == "dailymotion") $ src =' http: //www.dailymotion .com / embed / video /'.$ id; else if ($ site == "yahoo") $ src = 'http://d.yimg.com/nl/vyc/site/player.html#vid = '. $ id; else if ($ site == "bliptv") $ src =' http://a.blip.tv/scripts/shoggplayer.html#file=http://blip.tv/rss /flash/'.$id; else if ($ site == "veoh") $ src = 'http://www.veoh.com/static/swf/veoh/SPL.swf?videoAutoPlay=0&permalinkId=' . $ id; else if ($ site == "viddler") $ src = 'http://www.viddler.com/simple/'.$id; if ($ id! = ") return'';  add_shortcode ('vid', 'vid_sc');

Consejo dentro del consejo rápido: tome nota de que iframe tiene dos clases de CSS: vid y iframe- $ site (p.ej. iframe-youtube). Usted debe agregar vid border: 0; a su archivo CSS ya que no definimos la Frontera del marco atribuir en nuestro iframe etiqueta.

Ejemplos de uso

El uso predeterminado es bastante simple:

[vid site = "youtube" w = "600" h = "340"]

Pero para que sea parejo mas simple, establecemos valores por defecto para sitio, w y h. Por lo tanto, si desea incrustar un video de YouTube, puede usarlo así:

[vid]

Debes cambiar el ancho y la altura para que coincida con tu blog. Además, si usa Vimeo más que YouTube, puede cambiar el valor predeterminado sitio valor a "vimeo".

¡Eso es! Agrega esto a tu funciones.php Archivo y puedes empezar a usar el shortcode. Disfrutar!

Actualización: hemos agregado una sección de ejemplo de uso al artículo ahora para aclarar las cosas.

Código
×