Imagen y Vídeo en los Comentarios de tu Blog

Aquí te explico cómo visualizar la imagen y vídeo en los comentarios de tu blog. Ya sea si usas Blogger o WordPress y sin plugin. Fácil y rápido de aplicar.

¡Hola! soy Gabriela de peengler.com. En esta entrada quiero que sepas que es posible mostrar imágenes y videos en los comentarios sin necesidad de usar un plugin ni de programar, solo necesitas ver mi vídeo tutorial para que sepas como aplicarlo correctamente.

Sin más que decir ¡Empecemos!

Clic en la imagen para ver el vídeo ↑ en YouTube

Código para visualizar imagen y vídeo en los comentarios en el blog

Copia y pega el siguiente código:

<script>//<![CDATA[
!function(){for(var a=/(\[img\])?((http:|https:)?\/\/\S*?\.(jpg|gif|png|bmp|jpeg]))(\[\/img\])?/gi,b=/(\[vid\])?http(?:s?):\/\/(?:www\.)?youtu(?:be\.com\/watch\?v=|\.be\/)([\w\-\_]*)(&(amp;)?‌​[\w\?‌​=]*)?(\[\/vid\])?/gi,c=/(\[vid\])?(http:|https:)?\/\/(vimeo.com)\/([0-9]*)(\[\/vid\])?/gi,d=document.querySelectorAll(".comment-content"),e=0;e<d.length;e++){for(var f=d[e].getElementsByTagName("a"),g=0;g<f.length;g++)if(f[g].href.match(a)||f[g].href.match(b)||f[g].href.match(c)){var h=document.createElement("span");h.innerHTML=f[g].href;var i=f[g];i.parentNode.insertBefore(h,i),f[g].href="",f[g].innerHTML=""}var j=d[e].innerHTML;j=j.replace(a,'<img style="max-width: 100%; height: auto;display: blocK;margin: 10px auto;" src="$2"" alt=""/>'),j=j.replace(b,'<div style="position:relative;width:100%;height:0;padding-bottom:56.25%;overflow:hidden;margin:20px auto;"><iframe style="position: absolute;width: 100%;height: 100%;top: 0;left: 0;" src="https://www.youtube.com/embed/$2" frameborder="0" allowfullscreen></iframe></div>'),j=j.replace(c,'<div style="position:relative;width:100%;height:0;padding-bottom:56.25%;overflow:hidden;margin:20px auto;"><iframe style="position: absolute;width: 100%;height: 100%;top: 0;left: 0;" src="https://player.vimeo.com/video/$4" frameborder="0" allowfullscreen></iframe></div>'),d[e].innerHTML=j}}();
//]]></script>

Luego guardas los cambios.

Te en cuenta, que con este código solo se aceptan imágenes con formato:

• Jpg.
• Gif.
• Png.
• Bmp.
• Jpeg.

Además, puedes publicar vídeos de las siguientes páginas: YouTube y Vimeo.

¿Cómo evitar los comentarios de SPAM en el blog?

Si permites mostrar estos archivos en tus comentarios, lo más seguro es que te lleguen comentarios spam (no deseados) en tu blog. Para evitarlo, te recomiendo que actives la Moderación de comentarios.

En Blogger te ubicas en: Configuración > Comentarios > Moderación de comentarios: seleccionas siempre.

En WordPress te vas a: Ajustes > Comentarios > Seleccionar: El comentario debe aprobarse manualmente.

Con esto mantienes un control del SPAM y recuerda ir a la sección de comentarios para aprobar o eliminarlo.

Si quieres saber más sobre los comentarios en Blogger: Clic Aquí

En conclusión

Vez que, si es posible mostrar imagen y vídeo en los comentarios 😀 y sin plugin, que es lo mejor.  La verdad es que se ven geniales, ya es cuestión de decidir si aplicarlo o no.

Personalmente no lo voy a colocar, porque no quiero que mi página se ralentice más, pero si tu sitio es educativo, personal o hobbies. Creo que te puede interesar.

Si tienes alguna duda o pregunta, déjamelo en los comentarios.