S
steven77
Invitado
Buenos noches a todxs lxs compañerxs del foro. Este será mi primer tema, y bueno no sé si ya antes han creado uno igual.
Lo que les traigo son unas cuantas líneas de código de CSS y JQuery, que nos permitirán bloquear un vídeo en youtube en nuestra web, y para desbloquearlo tendremos que compartirlo por Facebook. Esto nos ayudará si queremos obtener más tráfico en nuestros vídeos y de que esa manera puedan hacerse virales.
Sin más rollo, aquí les va:
CSS
JQuery/Javascript
Si desean lo guardan en archivos diferentes y luego los llaman, en mi caso lo tengo dentro de mi etiqueta head.
Terminado esto, dentro la entrada que vayamos a crear, o donde nos parezca más conveniente poner el vídeo lo llamamos de la siguiente manera:
Lo que está dentro de la función youtube es tan sólo es el ID del vídeo de Youtube.
Y con eso ya puedes tener un vídeo en tu web que para que lo vean deben compartirlo.
Espero les haya servido por si es que aún no existe una entrada creada similar. Y a ver si quedo entre los primeros del ranking de temas.
Saludos y hasta la próxima.
Lo que les traigo son unas cuantas líneas de código de CSS y JQuery, que nos permitirán bloquear un vídeo en youtube en nuestra web, y para desbloquearlo tendremos que compartirlo por Facebook. Esto nos ayudará si queremos obtener más tráfico en nuestros vídeos y de que esa manera puedan hacerse virales.
Sin más rollo, aquí les va:
CSS
Código:
<style>
#video {
margin:0px auto;
max-width:480px;
height: 360px;
position: relative;
display: block;
}
#videolock {
position: absolute;
cursor: pointer;
z-index: 2;
background: url(http://2.bp.blogspot.com/-Rj5c1lmEM9g/UtniLGoigVI/AAAAAAAAAbI/fdgI60C_P0M/s1600/videolock.png) no-repeat;
width:480px;
height: 360px;
display: block;
}
</style>
JQuery/Javascript
Código:
<script type='text/javascript'>
//<![CDATA[
window.fbAsyncInit = function() {
FB.init({
appId: '834376999908196',
status: false,
xfbml: false
});
// Additional initialization code such as adding Event Listeners goes here
};
jQuery(document).ready(function(){
jQuery('#videolock').click(function () {
FB.ui({
method: '../sharer/sharer.php?u=' +document.URL+ '',
link : document.URL
},
function (response) {
if( response) {
jQuery("#videolock").hide();
}
});
});
});
function youtube (IDyoutube) {
var output = '<div id="video"><div id="videolock"></div><iframe frameborder="0" allowfullscreen="" height="360" width="480" src="http://www.youtube.com/embed/'+IDyoutube+'"></iframe></div>';
document.write (output);
}
//]]>
</script>
Si desean lo guardan en archivos diferentes y luego los llaman, en mi caso lo tengo dentro de mi etiqueta head.
Terminado esto, dentro la entrada que vayamos a crear, o donde nos parezca más conveniente poner el vídeo lo llamamos de la siguiente manera:
Código:
<script> youtube("7-4NOBBpen0")</script>
Lo que está dentro de la función youtube es tan sólo es el ID del vídeo de Youtube.
Y con eso ya puedes tener un vídeo en tu web que para que lo vean deben compartirlo.
Espero les haya servido por si es que aún no existe una entrada creada similar. Y a ver si quedo entre los primeros del ranking de temas.
Saludos y hasta la próxima.
Última edición: