Página 1 de 1
BBCode YOUTUBE solo imagen y luego video Tema Solucionado
Publicado: 06 May 2012, 02:53
por vargasmolina
Hola
La idea es que aparezca solo la imagen del vídeo youtube y al realizar el clic este muestre el vídeo espero que les ayude en sus proyectos
NOTA : ideal para hacer los foros mas rápidos ya que no carga el flash player de youutube al momento de ver el tema .
-Uso de BBCode-
Código: Seleccionar todo
[youtube]http://www.youtube.com/watch?v={IDENTIFIER}[/youtube]
-Reemplazo HTML-
Código: Seleccionar todo
<center>
<a href="javascript:void(0);" id="{IDENTIFIER}">
<img class="youtube" src="./images/youtube_play.png"
style="background: transparent url(http://img.youtube.com/vi/{IDENTIFIER}/0.jpg) no-repeat center; height: 76px; margin: 0; padding: 142px 202px; width: 76px;border: 3px solid #FFFFFF ;"
/>
</a>
</center>
<script>
$("#{IDENTIFIER}").click(function () {
$(this).replaceWith( $( '<iframe width="480" height="360" style="border: 3px solid #FFFFFF ;" src="https://www.youtube-nocookie.com/embed/{IDENTIFIER}?rel=0&loop=1&controls=1&showinfo=0&autoplay=1&border=0" frameborder="0" allowfullscreen></iframe>' ) );
});
</script>
(ejemplo de uso)
subir esta imagen a la carpeta root/images
- youtube_play.png (4.99 KiB) Visto 4957 veces
NOTA:Solamente Si todavia no tienes ninguna libreria jquery no olviden instalar el en el header .
abre
root/styles/tu estilo/template/overall_header.html
añade antes de
</head>
Código: Seleccionar todo
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.js"></script>
* Espero sirva de ayuda y haga mas rápido sus foros .
Re: BBCode YOUTUBE solo imagen y luego video
Publicado: 07 May 2012, 20:28
por zyxer
disculpen mi novatada, pero como se instala el jquery? con la función INCLUDE?
Re: BBCode YOUTUBE solo imagen y luego video
Publicado: 08 May 2012, 14:22
por vargasmolina
zyxer escribió:disculpen mi novatada, pero como se instala el jquery? con la función INCLUDE?
si necesitas instalar el jquery ve administrador -> estilos -> plantillas luego presiona el enlace editar de tu plantilla que estas usando para el foro te sale un combox con los nombre de los archivos ve al que dice overall_header.html y pega el codigo asi
Código: Seleccionar todo
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.js"></script>
después de la siguiente linea
borra el cache del sitio y listo debería funcionar .
Re: BBCode YOUTUBE solo imagen y luego video
Publicado: 08 May 2012, 17:56
por zyxer
Oh, gracias, ya había puesto el primer código, pero no sabía del segundo.. es necesario? porque a mi me va funcionando bien..
Re: BBCode YOUTUBE solo imagen y luego video
Publicado: 10 May 2012, 02:14
por vargasmolina
zyxer escribió:Oh, gracias, ya había puesto el primer código, pero no sabía del segundo.. es necesario? porque a mi me va funcionando bien..
Si esta funcionando no es necesario .
Re: BBCode YOUTUBE solo imagen y luego video
Publicado: 23 Jun 2012, 13:03
por zyxer
Saludos, me gustaría saber si habrá una manera de hacer que al hacer clic sobre la imagen, si estás en el tema, te funcione normal; pero si estás en el portal te redireccione al tema. Se podrá?
Re: BBCode YOUTUBE solo imagen y luego video
Publicado: 23 Jun 2012, 18:29
por vargasmolina
para lo que tu pides tendría que hacerse un nuevo BBCODE el cual incluya un enlace del post mas el enlace del video .
Re: BBCode YOUTUBE solo imagen y luego video
Publicado: 23 Jun 2012, 20:34
por zyxer
Pero crees que puedes hacerlo?
Re: BBCode YOUTUBE solo imagen y luego video
Publicado: 28 Ago 2012, 01:26
por onrushtw
Hola se que hace tiempo no se toca este hilo, pero es el que se adapta más a mi problema.
Seguí los pasos que están arriba, para poder ver vídeos de youtube en mi foro, hasta instale el jquery y borre las cookies. Pero no funciona muestra el texto como si no lo reconociera, en concreto, muestra esto:
Espero me puedan ayudar, soy nuevo en esto de crear foros asique voy andar seguido por acá.
Saludos y el foro esta de lujo!
Re: BBCode YOUTUBE solo imagen y luego video
Publicado: 28 Ago 2012, 01:30
por leviatan21
onrushtw escribió: en concreto, muestra esto:
observa como debe colocarse :
Código: Seleccionar todo
[youtube]http://www.youtube.com/watch?v={IDENTIFIER}[/youtube]
en el tuyo sobra todo o que dice
&feature=g-vrec