Incrustar un vídeo de YouTube o una presentación de SlideShare sin contenidos relacionados (y con un código válido)

Alguno de nuestros clientes ha querido aprovechar los canales de YouTube o SlideShare para distibuir contenidos, y nos ha pedido que los incrustáramos en su página web. Sin embargo, con buen criterio, nos piden que eliminemos los contenidos relacionados que aparecen al final de la reproducción, al carecer de control sobre los mismos.

Contenidos relacionados al final de un vídeo de YouTube

Afortunadamente, no es en absoluto complicado. En el marcado que ofrece YouTube, vemos en el value del primer param la dirección del vídeo que se quiere incrustar:

<object width="600" height="360">
  <param name="movie" value="http://www.youtube.com/v/u6XAPnuFjJc&amp;hl=es_ES&amp;fs=1"></param> 
  <param name="allowFullScreen" value="true"></param>
  <param name="allowscriptaccess" value="always"></param>
  <embed src="http://www.youtube.com/v/u6XAPnuFjJc&amp;hl=es_ES&amp;fs=1"
    type="application/x-shockwave-flash"
    allowscriptaccess="always"
    allowfullscreen="true"
    width="600" height="360">
  </embed>
</object>
 

Basta con añadir un parámetro final al URL, rel=0, para que no aparezcan los vídeos relacionados, con lo que esa línea quedaría así:

<param name="movie" value="http://www.youtube.com/v/u6XAPnuFjJc&amp;hl=es_ES&amp;fs=1&amp;rel=0"></param> 
 

Habría que hacer lo mismo para embed, pero pensamos que, ya que estamos, vamos a eliminar ese elemento que es una reliquia del pasado —aunque parece que se quiere resucitar—, y vamos a proporcionar el código válido para XHTML:

<object type="application/x-shockwave-flash" data="http://www.youtube.com/v/u6XAPnuFjJc&amp;hl=es_ES&amp;fs=1&amp;rel=0" height="360" width="600">
  <p><strong>Nota:</strong> Para reproducir este contenido necesita tener instalado <a href="http://www.adobe.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash&amp;Lang=Spanish">Adobe Flash Player</a>.</p> 
  <param name="movie" value="http://www.youtube.com/v/u6XAPnuFjJc&amp;rel=0" />
  <param name="allowFullScreen" value="true" />
  <param name="allowscriptaccess" value="always" />
  <param name="rel" value="false" />
</object>
 

Vamos a ilustrarlo con uno de los vídeos de Cognitive Media para RSA:

Drive: The surprising truth about what motivates us RSA/Cognitive Media

El mismo código se puede emplear para incluir la presentación de SlideShare, quienes han adoptado la misma solución de YouTube, el parámetro rel=0.

Etiquetas: contenidos multimedia.

Esta entrada se publicó el 27 de Julio de 2010 a las 16:33, y se archivó en (X)HTML. Autor: Saúl González. Puede seguir los comentarios de esta entrada a través de RSS 2.0. Puede dejar un comentario o hacer un trackback desde su propio sitio.