Poner imágenes o videos en los comentarios del blog

Existe una manera muy sencilla para que nuestros lectores puedan poner una imagen o video en los comentarios de nuestro blog.

Claro que para ello nosotros debemos insertar un código dentro de nuestra plantilla para que este truco de resultado y así nuestros lectores puedan hacerlo.

Este truco lo hizo el potro y me pareció baste útil y fácil de realizar.

Lo primero que deben tener en cuenta es que este truco se tiene que utilizar con moderación o nuestro blog se resentirá por el exceso de carga y tardará en mostrarse la entrada en cuestión. Recuerden que este truco solo funciona en las entradas individuales.

Dicho esto, sigamos con el truco. Primero entren en plantilla, edición html, y antes de  </body> peguen este script:

<script>
//<![CDATA[
// Insertar imágenes y videos en los comentarios (ciudadblogger.com)
function InsertarImagenVideo(id) { 
var IDelemento = document.getElementById(id),
sustituir = IDelemento.innerHTML;
sustituir = sustituir.replace(/\[img\](.[^\]]*)\[\/img\]/ig, "<img class='img-comentarios' src='$1'\/>");
sustituir = sustituir.replace(/\[video\]https:\/\/www\.youtube\.com\/embed\/(.*?)\[\/video\]/ig, "<iframe class='vid-comentarios' src='https://www.youtube.com/embed/$1'><\/iframe>");
sustituir = sustituir.replace(/\[video\](https:\/\/youtu\.be\/|https:\/\/www\.youtube\.com\/watch\?v\=)(.*?)\[\/video\]/ig, "<iframe class='vid-comentarios' src='https://www.youtube.com/embed/$2'><\/iframe>");
sustituir = sustituir.replace(/\[video\](http:\/\/youtu\.be\/|http:\/\/www\.youtube\.com\/watch\?v\=)(.*?)\[\/video\]/ig, "<iframe class='vid-comentarios' src='https://www.youtube.com/embed/$2'><\/iframe>");
sustituir = sustituir.replace(/\[video\](http:\/\/player\.vimeo\.com\/video\/)(.*?)\[\/video\]/ig, "<iframe class='vid-comentarios' src='http://player.vimeo.com/video/$2'><\/iframe>");
document.getElementById(id).innerHTML = sustituir;} InsertarImagenVideo('comment-holder');
//]]>
</script>
<style>
<!--
#comment-holder .img-comentarios, #comment-holder i[rel="image"] {
max-width: 450px;
width: auto;
height: auto;
display: block;
border: 5px solid #FFF;
margin: 0 auto;
padding: 0;
box-shadow: 1px 1px 5px rgba(0, 0, 0, .1); 
}
#comment-holder .vid-comentarios {
width: 450px; 
height: 253px; 
display: block;
margin: 0 auto;
padding: 0;
border: 5px solid #FFF; 
box-shadow: 1px 1px 5px rgba(0, 0, 0, .1); 
}
-->
</style>

Con esto, los que comenten podrán insertar un video o una imagen con tal solo poner la url del video o la imagen en sus comentarios, poniendo tan solo este código:

[img]URL de la imagen[/img] para imagen, y

[video]URL del video[/video] para video.

Lógicamente deberán reemplazar la url del video o la imagen por la url del video o imagen que deseen.

Poner aviso de políticas de uso de cookies en el blog

Aunque solo es obligatorio cuando se utiliza google analytics, el uso del aviso de políticas del uso de cookies en la web ya se ha generalizado por casi toda la red. Y esto en parte se debe a que al principio una ley obligaba a que toda página web advierta a los visitantes que están siendo monitoreados y que el "rastro" que dejaban al navegar por la web iba a ser usada por google  para conocer más sobre gustos y preferencias del visitante y de acuerdo a esa información, google podría ofrecerle información "más relevante", lo que a ciertos "defensores de la privacidad" les pareció que vulneraba derechos.

En fin, que, so pena de recibir una multa que no es para nada tranquilizadora (algunos dicen que se trata de muchos miles de dólares) nos veremos en la imperiosa necesidad de poner nuestro aviso de cookies para alertar a nuestros visitantes.

La buena noticia es que poner este gadget no es complicado. Solo debes ir a diseño, agregar un gadget html y pegar allí este código:

<div id="barritaloca" style="display:none;position:fixed;left:0px;right:0px;bottom:0px;width:100%;min-height:40px;background: #f3f3f3;color:#000000;z-index: 99999;">
<div style="width:100%;position:absolute;padding-left:5px;font-family:verdana;font-size:12px;top:30%;">
 Estamos obligados a avisarte que esta web utiliza cookies de todos lados para fastidiarte, asi que si continúas navegando aceptas esta política absurda de cookies.
 <a href="javascript:void(0);" style="padding:4px;background:#000;text-decoration:none;color:#f1f1f1;" onclick="PonerCookie();"><b>Acepto</b></a>
 <a href="http://www.google.com/intl/es-419/policies/technologies/cookies/" target="_blank" style="padding-left:5px;text-decoration:none;color:#666666;">Conoce más</a>
</div>
</div>
<script>
function getCookie(c_name){
 var c_value = document.cookie;
 var c_start = c_value.indexOf(" " + c_name + "=");
 if (c_start == -1){
  c_start = c_value.indexOf(c_name + "=");
 }
 if (c_start == -1){
  c_value = null;
 }else{
  c_start = c_value.indexOf("=", c_start) + 1;
  var c_end = c_value.indexOf(";", c_start);
  if (c_end == -1){
   c_end = c_value.length;
  }
  c_value = unescape(c_value.substring(c_start,c_end));
 }
 return c_value;
}
function setCookie(c_name,value,exdays){
 var exdate=new Date();
 exdate.setDate(exdate.getDate() + exdays);
 var c_value=escape(value) + ((exdays==null) ? "" : "; expires="+exdate.toUTCString());
 document.cookie=c_name + "=" + c_value;
}
if(getCookie('aviso')!="1"){
 document.getElementById("barritaloca").style.display="block";
}
function PonerCookie(){
 setCookie('aviso','1',365);
 document.getElementById("barritaloca").style.display="none";
}
</script>

Lo que puedes personalizar para que el aviso te quede chido. El aviso Estamosobligados..., que puedes poner la lectura que se te ocurra siempre recuerda hacer alusión a la política de cookies; en background: #f3f3f3 que es el color de fondo del aviso y color:#000000 que es el color de las letras. También puedes cambiar  background:#000;text-decoration:none;color:#f1f1f1 que es el color de fondo y de la palabra acepto.

Aunque a mi me gusta tal como muestra la imagen, ustedes pueden personalizarla de acuerdo a su gusto.

Sácale partido al enlace "leer más"

La mayoría de los blogs traen por defecto el enlace de "leer más" en su plantilla,  pero así mismo, la mayoría ignora el verdadero valor de éste enlace y sus ventajas...

Si bien es cierto que para todos es sabido que éste truco tan solo se limita a acortar una entrada extensa, su utilidad va un poco más allá de simplemente minimizar una entrada bastante larga.

Todos queremos que nuestro blog sea rápido al cargar nuestras entradas, y más aún si en él hemos puesto algunas imágenes o videos. Y si nuestro blog se demora en mostrar esas imágenes, o videos, corremos el riesgo de que nuestro visitante pierda la paciencia y opte por abandonar nuestro blog a medio cargar. Es que en esto de velocidad en la web, los segundos son cruciales. Unos cuántos segundos de más y pasamos al olvido. Es así de simple.

Pero, precisamente es allí donde el enlace de "leer más" entra en acción. A todos nos gusta que nuestro blog muestre la mayor cantidad de entradas posibles, en un tiempo récord, y este enlace nos ayuda a que nuestras entradas extensas se "compriman", dejando que las imágenes o videos que están dentro de las entradas se muestren únicamente cuando se pinche en una entrada específica, ganando segundos que pueden marcar la diferencia entre seguir o abandonar nuestro blog...

Sí, es sencillo, pero muchos pasamos por alto este detalle que, usándolo de manera apropiada, nos puede ayudar a optener muchos más visitantes. La idea es hacer efectivo nuestro propósito: que nuestro visitante permanezca en el blog y se interese por nuestra entrada. 

No se trata de eliminar imágenes sino que, situándolas de manera estratégica darle mayor soltura a la carga del blog... Y con  ello ganamos mucho más de lo que de manera habitual no podríamos. Y si nuestro blog esta repleto de scripts o artilugios, el tiempo de carga será un verdadero suplicio.

Así que si quieres ganar segundos que hagan la diferencia, empieza a ordenar las entradas del blog de manera estratégica y sácale ventaja al enlace, que, aunque no lo creas, es de mucha utilidad.