Inserir vídeos do YouTube deixa o blog lento?

juancho259 · 25/05/2014

Como dije anterior quiero colocar vídeos de youtube en un blog, pero no se que tan beneficioso sea con respecto a la velocidad de carga del blog y sobre todo y a los usuarios les vaya a gustar.

Colocar vídeos de youtube ponen lento el blog?

kanikase · 25/05/2014

Si pero aquí tengo un tutorial para ponerlos mediante un script y solo carguen al hacerles clic :encouragement:

Cargar videos cuando el usuario lo desee - Ayudar Bloggers

juancho259 · 25/05/2014

kanikase disse:
Si pero aquí tengo un tutorial para ponerlos mediante un script y solo carguen al hacerles clic :encouragement:

Cargar videos cuando el usuario lo desee - Ayudar Bloggers

Bien tio! , ahora mismo lo reviso gracias

---------- Post agregado el 26-may-2014 hora: 03:37 ----------

juancho259 disse:
Bien tio! , ahora mismo lo reviso gracias

Amigo vi tu código esta muy bueno , quiero insertarlo en mi blog, el problema es que ahí dice como insertar en blogger y yo tengo wordpress:s

Como hago

También vi que tu tienes insertado el código en tu blog, y cuando abri tu blog, senti una velocidad en cargar la pagina.:encouragement:

kanikase · 29/05/2014

juancho259 disse:
Bien tio! , ahora mismo lo reviso gracias

---------- Post agregado el 26-may-2014 hora: 03:37 ----------

Amigo vi tu código esta muy bueno , quiero insertarlo en mi blog, el problema es que ahí dice como insertar en blogger y yo tengo wordpress:s

Como hago

También vi que tu tienes insertado el código en tu blog, y cuando abri tu blog, senti una velocidad en cargar la pagina.:encouragement:

Ve a header.php, ahi busca </head> y justo arriba de eso, agrega el script:

HTML:

<script>
// YouTube iFrames
 var i,c,y,v,s,n;v=document.getElementsByClassName("youtube");if(v.length>0){s=document.createElement("style");s.type="text/css";s.innerHTML='.youtube{background-color:#000;max-width:100%;overflow:hidden;position:relative;cursor:hand;cursor:pointer}.youtube .ythumb{bottom:0;display:block;left:0;margin:auto;padding:0;max-width:100%;position:absolute;right:0;top:0;width:100%;height:auto}.youtube .play{filter:alpha(opacity=80);opacity:.8;left:50%;margin-left:-38px;margin-top:-38px;position:absolute;top:50%;width:77px;height:77px;background:url(//lh6.googleusercontent.com/-KM0uGaLlhKc/UznnNWfT-wI/AAAAAAAAKS0/Nnz3WwdoLxk/s77/play.png) no-repeat}';document.body.appendChild(s)}for(n=0;n<v.length;n++){y=v[n];i=document.createElement("img");i.setAttribute("src","http://i.ytimg.com/vi/"+y.id+"/hqdefault.jpg");i.setAttribute("class","ythumb");c=document.createElement("div");c.setAttribute("class","play");y.appendChild(i);y.appendChild(c);y.onclick=function(){var a=document.createElement("iframe");a.setAttribute("src","https://www.youtube.com/embed/"+this.id+"?autoplay=1&autohide=1&border=0&wmode=opaque&enablejsapi=1");a.style.width=this.style.width;a.style.height=this.style.height;a.style.margin=this.style.margin;a.style.border=this.style.border;a.style.display=this.style.display;this.parentNode.replaceChild(a,this)}};
</script>

Y para insertar el video, en la entrada agregas el codigo

HTML:

<div class="youtube" id="ID-VIDEO" style="width:560px; height:315px; margin:0 auto; display:block; border:none"></div>

Y listo, ya lo tendras :encouragement:

pepolini · 29/05/2014

Una pregunta, no se supone que si el vídeo se carga en un iframe, no afecta a la velocidad de carga del sitio?

juancho259 · 29/05/2014

kanikase disse:

Ve a header.php, ahi busca </head> y justo arriba de eso, agrega el script:

HTML:

<script>
// YouTube iFrames
 var i,c,y,v,s,n;v=document.getElementsByClassName("youtube");if(v.length>0){s=document.createElement("style");s.type="text/css";s.innerHTML='.youtube{background-color:#000;max-width:100%;overflow:hidden;position:relative;cursor:hand;cursor:pointer}.youtube .ythumb{bottom:0;display:block;left:0;margin:auto;padding:0;max-width:100%;position:absolute;right:0;top:0;width:100%;height:auto}.youtube .play{filter:alpha(opacity=80);opacity:.8;left:50%;margin-left:-38px;margin-top:-38px;position:absolute;top:50%;width:77px;height:77px;background:url(//lh6.googleusercontent.com/-KM0uGaLlhKc/UznnNWfT-wI/AAAAAAAAKS0/Nnz3WwdoLxk/s77/play.png) no-repeat}';document.body.appendChild(s)}for(n=0;n<v.length;n++){y=v[n];i=document.createElement("img");i.setAttribute("src","http://i.ytimg.com/vi/"+y.id+"/hqdefault.jpg");i.setAttribute("class","ythumb");c=document.createElement("div");c.setAttribute("class","play");y.appendChild(i);y.appendChild(c);y.onclick=function(){var a=document.createElement("iframe");a.setAttribute("src","https://www.youtube.com/embed/"+this.id+"?autoplay=1&autohide=1&border=0&wmode=opaque&enablejsapi=1");a.style.width=this.style.width;a.style.height=this.style.height;a.style.margin=this.style.margin;a.style.border=this.style.border;a.style.display=this.style.display;this.parentNode.replaceChild(a,this)}};
</script>

Y para insertar el video, en la entrada agregas el codigo

HTML:

<div class="youtube" id="ID-VIDEO" style="width:560px; height:315px; margin:0 auto; display:block; border:none"></div>

Y listo, ya lo tendras :encouragement:

Bien tio gracias, voy a probarlo, :encouragement:

---------- Post agregado el 29-may-2014 hora: 15:37 ----------

pepolini disse:
Una pregunta, no se supone que si el vídeo se carga en un iframe, no afecta a la velocidad de carga del sitio?

Me uno a la pregunta 🙂

IngresosWeb · 29/05/2014

kanikase disse:

Ve a header.php, ahi busca </head> y justo arriba de eso, agrega el script:

HTML:

<script>
// YouTube iFrames
 var i,c,y,v,s,n;v=document.getElementsByClassName("youtube");if(v.length>0){s=document.createElement("style");s.type="text/css";s.innerHTML='.youtube{background-color:#000;max-width:100%;overflow:hidden;position:relative;cursor:hand;cursor:pointer}.youtube .ythumb{bottom:0;display:block;left:0;margin:auto;padding:0;max-width:100%;position:absolute;right:0;top:0;width:100%;height:auto}.youtube .play{filter:alpha(opacity=80);opacity:.8;left:50%;margin-left:-38px;margin-top:-38px;position:absolute;top:50%;width:77px;height:77px;background:url(//lh6.googleusercontent.com/-KM0uGaLlhKc/UznnNWfT-wI/AAAAAAAAKS0/Nnz3WwdoLxk/s77/play.png) no-repeat}';document.body.appendChild(s)}for(n=0;n<v.length;n++){y=v[n];i=document.createElement("img");i.setAttribute("src","http://i.ytimg.com/vi/"+y.id+"/hqdefault.jpg");i.setAttribute("class","ythumb");c=document.createElement("div");c.setAttribute("class","play");y.appendChild(i);y.appendChild(c);y.onclick=function(){var a=document.createElement("iframe");a.setAttribute("src","https://www.youtube.com/embed/"+this.id+"?autoplay=1&autohide=1&border=0&wmode=opaque&enablejsapi=1");a.style.width=this.style.width;a.style.height=this.style.height;a.style.margin=this.style.margin;a.style.border=this.style.border;a.style.display=this.style.display;this.parentNode.replaceChild(a,this)}};
</script>

Y para insertar el video, en la entrada agregas el codigo

HTML:

<div class="youtube" id="ID-VIDEO" style="width:560px; height:315px; margin:0 auto; display:block; border:none"></div>

Y listo, ya lo tendras :encouragement:

Hola, esta muy buena la idea.. pero en Wordpress no me funciona..

lo he instalado tal cual, de diferente maneras pero no me funciona en el post aparece un espacio en blanco donde debería ir el video.. :grumpy:

kanikase · 29/05/2014

IngresosWeb disse:
Hola, esta muy buena la idea.. pero en Wordpress no me funciona..

lo he instalado tal cual, de diferente maneras pero no me funciona en el post aparece un espacio en blanco donde debería ir el video.. :grumpy:

Intenta creando un archivo .js y en el, metes:

HTML:

var i,c,y,v,s,n;v=document.getElementsByClassName("youtube");if(v.length>0){s=document.createElement("style");s.type="text/css";s.innerHTML='.youtube{background-color:#000;max-width:100%;overflow:hidden;position:relative;cursor:hand;cursor:pointer}.youtube .ythumb{bottom:0;display:block;left:0;margin:auto;padding:0;max-width:100%;position:absolute;right:0;top:0;width:100%;height:auto}.youtube .play{filter:alpha(opacity=80);opacity:.8;left:50%;margin-left:-38px;margin-top:-38px;position:absolute;top:50%;width:77px;height:77px;background:url(//lh6.googleusercontent.com/-KM0uGaLlhKc/UznnNWfT-wI/AAAAAAAAKS0/Nnz3WwdoLxk/s77/play.png) no-repeat}';document.body.appendChild(s)}for(n=0;n<v.length;n++){y=v[n];i=document.createElement("img");i.setAttribute("src","http://i.ytimg.com/vi/"+y.id+"/hqdefault.jpg");i.setAttribute("class","ythumb");c=document.createElement("div");c.setAttribute("class","play");y.appendChild(i);y.appendChild(c);y.onclick=function(){var a=document.createElement("iframe");a.setAttribute("src","https://www.youtube.com/embed/"+this.id+"?autoplay=1&autohide=1&border=0&wmode=opaque&enablejsapi=1");a.style.width=this.style.width;a.style.height=this.style.height;a.style.margin=this.style.margin;a.style.border=this.style.border;a.style.display=this.style.display;this.parentNode.replaceChild(a,this)}};

y lo subes a tu host, y antes de </head> lo agregas desde el archivo externo:

HTML:

<script type='text/javascript' src='NOMBRE-ARCHIVO.JS'></script>

:encouragement:

Inserir vídeos do YouTube deixa o blog lento?

juancho259

kanikase

juancho259

kanikase

pepolini

juancho259

IngresosWeb

kanikase

Tópicos similares