
laider91
Beta
Verificación en dos pasos activada
Verificado por Whatsapp
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Hola chicos,
Quiero comentaros una forma que me imagino que alguien ya posteo, pero por si alguien lo necesita, paso a explicar como adaptar el script que obliga a compartir en facebook, para acceder a un "Vídeo"
Aquí os dejo en enlace por si no lo tienen: https://mega.co.nz/#!v5BmjBYI!uF_n5WpP73VO1xVtqyd2YlCKX0p4I5GOg050aXpCW78
Bueno, la forma que yo tuve para adaptarlo a mi web, ya que mi web no es de vídeos fue la siguiente, pongo código y después explico:
Bueno, el código anterior, lo que hace si alguno no lo sabéis, es posicionar un div encima de otro, básicamente lo que hago con esto es hacer que el "Vídeo" aparezca encima del contenido que queremos bloquear en cierta manera, ahora bien lo único que debemos hacer ahora, es modificar las imágenes que vienen en este script así, como también su tamaño, no os preocupéis, no hace falta que el tamaño sea igual de grande que el del div que queremos bloquear, si por ejemplo, el div que queremos bloquear es muy grande, o queremos hacer que el div, que bloquea el contenido sea de un tamaño menor solo debemos hacer lo siguiente:
Lo que he hecho ahora, es hacer que el div donde aparece el script, este dentro a su vez de una mas mayor, que es el que realmente bloqueara el contenido de la pagina, así podemos jugar con el tamaño de las imágenes de el div que bloquea la pagina.
Ahora, para que no carge ningun video, debemos dirigirnos a "blocker.js" y debemos eliminar esta parte:
Lo siguiente que vamos a hacer, es modificar el iframe que aparece por nuestra propia pagina, exactamente este:
Os lo he puesto ya en el ejemplo, para evitar que salgan scroll, margenes y demás... aunque si queréis scroll por ejemplo solo debéis quitar el noresize scrolling.
Ahora bien, podéis pensar... menuda mierda, tanto trabajo y cuando la persona comparte, se queda el recuadro transparente del div, y no deja acceder al contenido, bueno para eso existe varias opciones, pero yo la que voy a poner en este tutorial va a ser el colocar un botón en la pagina que hemos creado para el iframe con el siguiente código:
Con esto lo que hacemos es que cuando pulsemos dicho botón, desaparezca el div que nosotros digamos ya sea directamente el div que contiene directamente las imágenes para compartir, o el div que tiene enjaulado a los divs del script.
Podéis, pensar... pero valla mierda compartirá un vídeo, pues no, compartirá los metatags de la pagina donde se encuentre, ya sea el index o alguna extensión.
También deciros, que currándose el diseño, queda bonito y hace aumentar las visitas considerablemente.
Es un tutorial cutre lo se, si existe podéis eliminarlo, o si me confundí de sitio podéis mover lo, en definitiva no me importa :welcoming:
Os puedo segurar que hasta el momento que lo he hecho funciona perfectamente, y quizás a alguien le haga falta o lo quiera.
Así que bueno, un saludo.
Importante que se me paso, en "Codigo de un video de youtube" debéis poner uno cualquiera, tranquilos que no se vera, ni cogerá la imagen ni nada, pero ya que este script esta hecho para viralizar vídeos en facebook, no funcionara si no ponéis un código.
Un saludo.
Quiero comentaros una forma que me imagino que alguien ya posteo, pero por si alguien lo necesita, paso a explicar como adaptar el script que obliga a compartir en facebook, para acceder a un "Vídeo"
Aquí os dejo en enlace por si no lo tienen: https://mega.co.nz/#!v5BmjBYI!uF_n5WpP73VO1xVtqyd2YlCKX0p4I5GOg050aXpCW78
Bueno, la forma que yo tuve para adaptarlo a mi web, ya que mi web no es de vídeos fue la siguiente, pongo código y después explico:
HTML:
<div style="position:relative">El contenido que quieres bloquear, ya puede ser la web entera si lo deseas.</div>
<div style="position:absolute; top:0px; left:0px; width:ancho que cubra el contenidopx; height:alto que cubra el contenidopx; z-index:2">
<script>
youtube("GNF3KI7Po_o"); Codigo de un video de youtube
</script>
</div>
Bueno, el código anterior, lo que hace si alguno no lo sabéis, es posicionar un div encima de otro, básicamente lo que hago con esto es hacer que el "Vídeo" aparezca encima del contenido que queremos bloquear en cierta manera, ahora bien lo único que debemos hacer ahora, es modificar las imágenes que vienen en este script así, como también su tamaño, no os preocupéis, no hace falta que el tamaño sea igual de grande que el del div que queremos bloquear, si por ejemplo, el div que queremos bloquear es muy grande, o queremos hacer que el div, que bloquea el contenido sea de un tamaño menor solo debemos hacer lo siguiente:
HTML:
<div style="position:absolute; top:0px; left:0px; width:ancho que cubra el contenidopx; height:alto que cubra el contenidopx; z-index:2;text-align:center">
<div style=" width:ancho que queramospx; height:alto que queramospx">
<script>
youtube("GNF3KI7Po_o"); Codigo de un video de youtube
</script>
</div>
</div>
Lo que he hecho ahora, es hacer que el div donde aparece el script, este dentro a su vez de una mas mayor, que es el que realmente bloqueara el contenido de la pagina, así podemos jugar con el tamaño de las imágenes de el div que bloquea la pagina.
Ahora, para que no carge ningun video, debemos dirigirnos a "blocker.js" y debemos eliminar esta parte:
HTML:
style="background-image: url(http://img.youtube.com/vi/' + IDyoutube + '/0.jpg)"
Lo siguiente que vamos a hacer, es modificar el iframe que aparece por nuestra propia pagina, exactamente este:
HTML:
<iframe width="480" height="360" src="http://www.youtube.com/embed/'+IDyoutube+'?autoplay=0" frameborder="0" allowfullscreen></iframe>
Debe quedar algo asi:
<iframe noresize scrolling="No" frameborder="0" marginwidth="0" marginheight="0" border="0" width="480" height="360" src="aquitupagina.html" frameborder="0" allowfullscreen></iframe>
Os lo he puesto ya en el ejemplo, para evitar que salgan scroll, margenes y demás... aunque si queréis scroll por ejemplo solo debéis quitar el noresize scrolling.
Ahora bien, podéis pensar... menuda mierda, tanto trabajo y cuando la persona comparte, se queda el recuadro transparente del div, y no deja acceder al contenido, bueno para eso existe varias opciones, pero yo la que voy a poner en este tutorial va a ser el colocar un botón en la pagina que hemos creado para el iframe con el siguiente código:
HTML:
<button id="BUTTON" class="button" onclick="window.parent.document.getElementById('nombre del div).style.display='none';">CERRAR</button>
Con esto lo que hacemos es que cuando pulsemos dicho botón, desaparezca el div que nosotros digamos ya sea directamente el div que contiene directamente las imágenes para compartir, o el div que tiene enjaulado a los divs del script.
Podéis, pensar... pero valla mierda compartirá un vídeo, pues no, compartirá los metatags de la pagina donde se encuentre, ya sea el index o alguna extensión.
También deciros, que currándose el diseño, queda bonito y hace aumentar las visitas considerablemente.
Es un tutorial cutre lo se, si existe podéis eliminarlo, o si me confundí de sitio podéis mover lo, en definitiva no me importa :welcoming:
Os puedo segurar que hasta el momento que lo he hecho funciona perfectamente, y quizás a alguien le haga falta o lo quiera.
Así que bueno, un saludo.
HTML:
<div style="position:relative">El contenido que quieres bloquear, ya puede ser la web entera si lo deseas.</div>
<div style="position:absolute; top:0px; left:0px; width:ancho que cubra el contenidopx; height:alto que cubra el contenidopx; z-index:2">
<script>
youtube("GNF3KI7Po_o"); Codigo de un video de youtube
</script>
</div>
Importante que se me paso, en "Codigo de un video de youtube" debéis poner uno cualquiera, tranquilos que no se vera, ni cogerá la imagen ni nada, pero ya que este script esta hecho para viralizar vídeos en facebook, no funcionara si no ponéis un código.
Un saludo.
Última edición: