Ocultar la dirección de email en WordPress para evitar spam

Es muy posible que en tu página web, tanto si es de una empresa como personal, estés mostrando en uno o varios lugares una dirección de correo de contacto.

Esto puede suponer un riesgo importante, ya que puedes recibir cantidades masivas de spam en dicha dirección de email. Aquí vamos a ver cómo evitarlo.

¿Por qué hay que ocultar la dirección de correo a los robots de spam?

Cuando ponemos una dirección de email en nuestro WordPress esta no será solo visible para los visitantes de la web, sino que también la podrán leer los cientos de robots que rastrean webs.

Dichos robots buscan direcciones de correo que guardarán para enviar a ellas correos basura o spam. Es por ello que es muy recomendable ocultar estas direcciones de email a los robots, pero que sigan siendo visibles para el resto de los usuarios.

Ten por seguro que si no haces esto tarde o temprano empezaras a recibir correos no deseados.

Ocultar dirección de correo a los robots de spam

Existen diversos métodos para proteger nuestras direcciones de email de dichos robots. Vamos a revisar algunos de ellos.

No mostrar la dirección de correo en ningún sitio

Esta sería la forma más segura de evitar riesgos: si no se muestra ninguna dirección de correo no podrán leerla nunca.

Pero claro, tú quieres que los visitantes de tu WordPress puedan contactar contigo. Para estos casos puedes utilizar un formulario de contacto. Lo puedes crear con plugins como Contact Form 7 y, en algunos casos, el propio tema que utilices puede incluir la opción de insertar formularios de contacto de forma directa.

Usar un formulario para contactar con los clientes en lugar de poner una dirección de correo puede aportar varias ventajas. Por un lado podremos especificar la información que queremos solicitar a los clientes (nombre, email, teléfono, web, etc.).

Por otra parte, podremos añadir una página de agradecimiento que se cargará cuando el usuario rellene un formulario, donde podremos mostrar información extra, como ofertas especiales.

Eso sí, es muy importante que protejamos el formulario de contacto con algún sistema antispam, como un captcha o similar. De no hacerlo, el spam nos entrará por aquí.

Ocultar la dirección de correos a robots con un plugin de WordPress

WordPress cuenta con miles de plugins con los que añadir nuevas funcionalidades y, por supuesto, también tenemos opciones para ofuscar las direcciones de email a robots.

La mejor opción sería con el plugin Email Address Enconder. Simplemente tendremos que instalar el plugin y activarlo. Si tienes dudas con el proceso te recomiendo revisar nuestro tutorial sobre cómo instalar plugins en WordPress.

Dicho plugin cuenta con un apartado de ajustes al que podremos acceder desde la administración de WordPress entrando en Ajustes > Email Encoder.

Dicha configuración la podemos dejar como está, ya que debería ser suficiente para ocultar las direcciones de correo. Algunas opciones requieren de una versión de pago de dicho plugin, pero no serían necesarias.

Una vez activado el plugin no apreciarás diferencias en la web a la hora de mostrar las direcciones de correo, pero sí que existen. La idea es que las direcciones de email se sigan mostrando igual para los visitantes de la web, pero no puedan ser leídas por robots.

Esto se aprecia cuando se revisa el código fuente. Sin el plugin activado, las direcciones de correo se verían de la siguiente forma:

Con el plugin activado, el correo se verá encriptado:

Esto será lo que verán los robots de spam, por lo que no podrán obtener nuestra dirección de correo.

Ocultar la dirección de correo a los robots mediante código

Personalmente, si puedo evitar el uso de un plugin utilizando un código lo hago. Esto me permite tener un WordPress más limpio.

En el caso que nos ocupa, podemos conseguir un funcionamiento similar al anterior añadiendo un pequeño código en el archivo functions.php del tema. Por ejemplo, si estamos usando el tema Twenty Sixteen el archivo a editar wp-content/themes/twentysixteen/functions.php.

El código, que tendremos que añadir al final de dicho archivo, será el siguiente:

function security_remove_emails($content) {
    $pattern = '/([a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4})/i';
    $fix = preg_replace_callback($pattern, "security_remove_emails_logic", $content);
    return $fix;
}
function security_remove_emails_logic($result) {
    return antispambot($result[1]);
}
add_filter( 'the_content', 'security_remove_emails', 20 ); //ocultar correo en posts
add_filter( 'comment_text', 'security_remove_emails', 20 ); //ocultar correo en comentarios
add_filter( 'widget_text', 'security_remove_emails', 20 ); //ocultar correo en widgets

Puedes hacerlo desde la administración de WordPress, entrando en Apariencia > Editor de temas y seleccionando en la parte derecha Funciones del tema, pero te recomiendo editar el archivo vía FTP o con el administrador de archivos del panel de control de la cuenta de hosting.

Recuerda que para aplicar cambios en el archivo functions.php es preferible crear un tema hijo, de forma que podamos modificar su propio functions.php. Si lo hacemos directamente sobre el tema en uso, perderemos los cambios cuando actualicemos el tema.

El funcionamiento de dicho código será similar al del plugin, es decir, encriptará las direcciones de correo para los robots de spam.

Ocultar la dirección de correo mediante un shortcode

Una alternativa que se podría usar para encriptar las direcciones de correo sería mediante un shortcode. Los shortcodes son pequeños códigos que permiten ejecutar ciertas funcionalidades.

En este caso habría que añadir al final del archivo functions.php (el mismo que comentábamos antes) el siguiente código:

function ocultar_email_addresses_sc($atts, $content = null) {
    $emailaddress_fields = shortcode_atts(array('email' => ''),$atts);
    $e_mail = $emailaddress_fields['email'];
    if ($e_mail !=='') {
        return '<a href="mailto:'.antispambot($e_mail).'">'.antispambot($e_mail).'</a>';
    }
    else {
        return '';
    }
}
add_shortcode('ocultar_email','ocultar_email_addresses_sc');

Veamos como se usa. Supongamos que queremos añadir en una página de nuestro WordPress la dirección email@ejemplo.com. En lugar de ponerla directamente, pondremos esto otro:

[ocultar_email email="email@ejemplo.com"]

De esta forma, los visitantes de la web verán la dirección email@ejemplo.com, pero los robots obtendrán una dirección encriptada.

En el caso de que queramos añadir la dirección de correo en un widget, siguiendo un sistema similar al explicado, tendremos que añadir esta línea adicional en el archivo functions.php, que permitirá usar shortcodes dentro de los widgets:

add_filter( 'widget_text', 'do_shortcode' );

Ocultar una dirección de correo modificando el código del tema

En ocasiones algunos temas de WordPress disponen de un campo en su configuración para guardar la dirección de correo asociada con la web. Dicha dirección de correo se puede mostrar en alguna zona de la web, como la cabecera.

Si localizamos el lugar donde se carga podremos aplicar un pequeño cambio en el código para ofuscar la dirección de correo a los robots.

Para ello utilizaremos la función antispambot que integra el propio WordPress. Dicha función se encarga de enmascarar la dirección de correo, y ya la hemos usado en el código que indicaba en los métodos anteriores.

Pongo un ejemplo para verlo más claro. En el tema Divi la dirección de correo se puede cargar en la cabecera de la web. Para ello, en el archivo header.php del tema se usa el siguiente código:

<a href="<?php echo esc_attr( 'mailto:' . $et_email ); ?>"><span id="et-info-email"><?php echo $et_email ; ?></span></a>

En él, la variable $et_email es la que carga la dirección de correo. Para protegerla contra la robots de spam simplemente le aplicamos la función antispambot a la variable, es decir, se sustituye $et_email por antispambot( $et_email ). El código anterior quedaría así:

<a href="<?php echo esc_attr( 'mailto:' . antispambot($et_email) ); ?>"><span id="et-info-email"><?php echo antispambot( $et_email ); ?></span></a>

Este método se puede aplicar para cualquier dirección de correo que carguemos mediante código.

Ocultar a los robots una dirección de correo mediante CSS

Utilizando estilos CSS podremos ocultar la dirección de email a los robots a través de diversos métodos que permiten mostrar la dirección en el frontal, pero no en el código fuente.

No soy muy partidario de estos sistemas, ya que obligan a poner código para cada dirección de correo que añadamos. Además, por regla general no se podrá añadir el enlace a nuestro gestor de correo.

Supongamos que queremos ocultar a los robots la dirección email@ejemplo.com. Una forma sería añadiendo un código como el siguiente en lugar de poner directamente este email:

email@<span style="display:none">novale</span>ejemplo.com

Lo que se hace es colocar en medio de la dirección de correo un código HTML que ocultamos en el frontal de la web mediante un display:none.

Otra opción sería colocar la dirección de correo al revés e invertir el orden mediante CSS:

<span style="unicode-bidi:bidi-override; direction: rtl;">moc.olpmeje@liame</span>

Existen más métodos, pero no los vamos a repasar aquí. Como te decía, te recomiendo utilizar cualquiera de los otros métodos, ya que son más sencillos de aplicar.

Utilizar una imagen para cargar la dirección de email

Este método es muy rudimentario, pero perfectamente válido. Consiste en crear una imagen donde se vea la dirección de correo. De esta forma, en el lugar donde queramos mostrar el email tan solo tendremos que subir la imagen que hayamos preparado.

Tiene la desventaja de que no podremos poner un enlace para escribir un correo a esa dirección (si lo hacemos la dirección de correo vendría en el propio enlace).

Por otro lado, a nivel de diseño puede quedar mal, especialmente si queremos poner la dirección en medio de un párrafo de texto.

Verificar si tenemos direcciones de correo visibles para robots de spam

Una vez que hemos repasado los diversos métodos para ocultar la dirección de correo a los bots, quedaría comprobar si realmente ha sido así, o nos hemos dejado algo.

Para ello, podemos utilizar la siguiente página: https://encoder.till.im/scanner

Simplemente tendremos que poner la dirección de la página de nuestro WordPress que queramos comprobar y rápidamente nos dirá si ha encontrado en ella alguna dirección de correo visible para los robots.

En caso afirmativo, tendrías que utilizar alguno de los sistemas explicados aquí y, en caso de que ya lo hayas hecho, verificar que lo has aplicado de forma correcta.

Espero que esto te sirva de ayuda para proteger tu direcciones de correo en WordPress y evitar la entrada de spam en las bandejas de entrada.