Un poco de moderación en los comentarios

Últimamente no hago más que mostrar cosas que parece que sirven para algo, pero que en el fondo no resuelven del todo los problemas para los que se les supone la utilidad. Pero no me lo toméis a mal. Lo hago sólo para practicar cosillas, aprender cómo funcionan algunos códigos y de paso, como contraejemplo de lo que no funciona del todo bien.

En este caso vamos a ver un script muy sencillo que nos permite reemplazar palabras situadas dentro de cualquier tipo de DIV que tenga asociada una ID. Lo vimos en Simplex Design gracias a un graznido de @pizcos. Tranquilos si no entendéis del todo el funcionamiento, porque no he entrado demasiado en detalle y sólo he pretendido explicar a grandes rasgos qué hace cada cosa.

En este ejemplo lo vamos a utilizar como forma de moderación de comentarios, de manera que determinadas palabras sean eliminadas o mejor dicho, sobreescritas con asteriscos. Esta es la parte JavaScript y habrá que insertarla antes de </head>:

<script type='text/javascript'>
//<![CDATA[
function filtropalabras(ID){
var comm = document.getElementById(ID);
var comment = comm.innerHTML;
var palabras = /palabra1|palabra2|Palabra3/gi;

var comment1 = comment.replace(palabras, "****");
comm.innerHTML = comment1;
comm.style.display = "block";
}
//]]>
</script>

Se trata sólo de una función. Para los más novatos, una función es una rutina que toma unos datos de entrada, los procesa de determinada manera y devuelve otros. Lo más práctico de las funciones es que sirven para ejecutar tareas repetitivas desde un mismo trozo de código. Esta en concreto la usaremos en el bucle que va escribiendo los distintos comentarios que tienen las entradas, por lo que se repetirá el proceso con cada uno de ellos.

La función que hemos llamado filtropalabras recibe el dato de la ID a tratar (lo que hay entre paréntesis) y en primer lugar captura la capa correspondiente (getElementById), que es guardada temporalmente en comm. Con innerHTML se guarda en un variable (comment) el contenido de dicha capa, para que después pueda ser tratado sin alterar el contenido original. En la variable palabras, es dónde tenemos que introducir a mano la lista de palabras que queremos eliminar.

La siguiente línea es la principal. El comando replace comprueba en todo el contenido que tenemos guardado (comment), la existencia de palabras coincidentes con las de nuestra lista (palabras). Cuando encuentra una la sustituye por lo entrecomillado, cuatro asteriscos. Todo el resultado se va guardando en comment1.

Lo último que hacemos es colocar todo este resultado con innerHTML, de nuevo en la capa que antes extrajimos de su sitio y luego darle una visibilidad de bloque.


Ya podemos Guardar y ya tenemos nuestra función preparada, pero ninguna hace nada si no se le llama antes desde algún sitio y se le pasan los valores que necesita. Eso lo vamos a hacer desde la parte HTML del blog.

Siguiendo con el ejemplo, con Expandir plantillas de artilugios marcado, localizamos la parte que imprime los comentarios. Tiene este aspecto:

<p><data:comment.body/></p>

Bien, pues eso lo sustituimos por todo esto:

<p>
<div expr:id='data:comment.id' style='display:none;'>
<data:comment.body/>
</div></p>
<script type='text/javascript'>
filtropalabras(&quot;<data:comment.id/>&quot;);
</script>

Las DATA son variables específicas de Blogger que guardan datos de nuestro blog. data:comment.body es la que contiene el texto de cada comentario. Lo que le hemos añadido ha sido una capa no visible (div style="display:none;") con un ID que también hemos aprovechado de las variables Blogger. A continuación es cuando se coloca la llamada a la función que antes situamos antes del </head> y como parámetro, le pasamos la ID que hemos insertado.

Para incluir más palabras sólo hay que respetar los símbolos y letras al principio y al final de var palabras e incluir una barra vertical ( | ) entre cada dos. Los asteriscos también pueden ser sustituidos por cualquier cosa que os apetezca.

Ahora ya sí que está todo completo y tenemos una lista negra de palabras que no podrán usar en los comentarios de nuestro blog. Podéis probar a escribir caca, culo, pedo o pis en un comentario de este blog de pruebas y observaréis que cuando guardáis, aparecen en su lugar los susodichos asteriscos


¿Y dónde está el pero...? El pero está en la lista en sí misma, pues tendría que ser muy completa para que cumpliera realmente su función. Lo más normal es que tengamos que ir añadiendo bastantes palabras al principio y aún así, siempre se nos escaparía alguna.

El script no hace diferencia entre mayúsculas y minúsculas (gracias al modificador gi de replace). Sin embargo, no es capaz de hacer iguales una letra con o sin acento. Para el sistema son cosas distintas y eso obligaría a redactar todas las combinaciones. Lo mismo ocurre si se intercalan espacios en blanco, guiones, etc.

No obstante, esto puede tener otras utilidades, como cambiar ciertas palabras por otras, eliminar en una cadena los espacios en blanco, saltos de línea, caracteres especiales, etc. Y sobre todo la más importante, que es saber que se pueden hacer este tipo de cosas.

Por ejemplo, para cambiar adicionalmente una palabra concreta por otra, sólo habría que añadir líneas extra tras var palabras = /palabra1|palabra2|Palabra3/gi; pero con este otro formato:

comment1 = comment1.replace(/hola/gi, "Un saludo");

¿Vemos otro post al azar por si le encuentras utilidad o quizás prefieres ser más metódico y suscribirte a nuestras entradas por correo? También puedes imprimir este artículo y por supuesto compartirlo en redes sociales si fue de tu agrado.

Compartir

Twitter

Pinterest

Facebook

Linkedin

Copy URL

Compartir

Twitter

Pinterest

Facebook

Linkedin

Y muchos más artículos interesantes si nos sigues en...

• Google
• Facebook
• Twitter