Ir al contenido principal
Todas las coleccionesDiseño y Desarrollo
Cómo integrar un Captcha en los formularios de tu Wordpress o Joomla
Cómo integrar un Captcha en los formularios de tu Wordpress o Joomla
Christian avatar
Escrito por Christian
Actualizado hace más de 5 años

Un captcha es un campo, que normalmente aparece al final de un formulario, y que ayuda a demostrar que la persona que está ingresando los datos es un humano, suena algo descabellado pero es necesaria esta verificación, ya que existen muchos bots en Internet que constantemente están enviando Spam o generando ataques a las páginas web que no poseen esta medida de seguridad.

¿Por qué debo instalar un captcha?

Es importante instalar un captcha para evitar que exploten un formulario desde internet con bots, envíen SPAM y dañe la reputación del dominio.

Si su sitio web está implementado sobre Wordpress la forma más sencilla de integrar un captcha es por medio de un plugin, en esta ocasión trabajaremos con el plugin reCAPTCHA, uno de los más populares que encontraras.

Para la implementación del captcha se trabajara con dos de los plugins más utilizados para crear formularios, Contact Form 7 y Ninja Forms. Luego de tener el plugin de los formularios instalado y con el formulario creado, se procede a instalar el plugin reCAPTCHA. En el panel de administración de Wordpress se hace clic en la opción plugins del menú lateral izquierdo, luego clic en añadir nuevo y se busca reCAPTCHA.

Imagen del plugin a instalar

Una vez instalado y activado el plugin, se debe obtener la Site key (Clave del sitio) y la Secret key (Clave secreta), para obtenerlas se debe dirigir a la opción Google Captcha del menú lateral izquierdo y luego hacer clic en Get the Api keys.

Imagen que muestra por donde ingresar para obtener las claves

Una nueva página se abrirá, en ella se solicita completar un formulario con datos del sitio en el cual se utilizara el captcha. En el campo label se escribe la pagina de contacto, se selecciona el tipo de captcha, que en este caso es reCAPTCHA V2, luego los dominios en los que se integrara el captcha, se aceptan los términos y clic en register.

Pantalla de registro para obtener las claves

Después de ingresar la información solicitada, se abre una nueva página en la cual se muestran las dos claves que se necesitan.

Pantalla donde se muestran las claves de registro

Para integrar el captcha al formulario de Contact Form 7, diríjase al menu de la parte lateral izquierda y ubique el cursor sobre Contacto, luego haga clic en integración, a continuación cargará una página como se ve en la imagen siguiente, allí debe pegar en cada campo las claves que obtuvo en el paso anterior.

Formulario para agregar las claves

Teniendo ya las claves guardadas, se procede a incluir el captcha al formulario, para hacerlo, debe tener el formulario creado. Ubique el cursor sobre la opción Contacto del menú lateral izquierdo y seleccione formularios de contacto, al realizar esta acción le mostrara el listado de los formularios creados, seleccione el que desea editar.

Lista de formularios creados

Cuando haga clic sobre el formulario en el cual va a trabajar, se abrirá la pagina de edición, allí se muestran los campos que tiene ese formulario. Para agregar el captcha debe posicionar el cursor arriba del botón del formulario y luego hacer clic en la opción que dice reCAPTCHA.

Formulario en Contact form 7

A continuación se abrirá una ventana en la cual puede configurar algunas propiedades del captcha como el tamaño, el tema y los atributos Id y clase. Cuando este completa la configuración de acuerdo a sus preferencias, haga clic en insertar y luego guardar, de esta forma el captcha ya quedará insertado en el formulario.

Opciones de configuración del captcha

Abra la pagina donde se muestra el formulario y valide que este funcionando de forma correcta con el captcha.

Formulario con el captcha integrado

Integración del captcha a un formulario creado con Ninja Forms Asumiendo que se tiene el formulario de Ninja Forms creado y las claves de reCAPTCHA (las mismas que se obtuvieron en uno de los pasos anteriores), debe ubicar el cursor del mouse sobre la opción Ninja Forms del menú lateral izquierdo y hacer clic en ajustes. En la pantalla que se muestra diríjase hacia ajustes de reCaPTCHA y pegue las claves en las casillas correspondientes, seleccione el idioma, el tema y luego guarde los cambios.

Área de ajustes de Ninja Forms

En las opciones de Ninja Forms del menú lateral izquierdo, haga clic en Escritorio y luego seleccione el formulario al que desea agregar el captcha. A continuación se desplegara la pantalla para editar el formulario, haga clic en el botón + y seleccione Recaptcha, luego arrastre el módulo de Recaptcha y ubíquelo arriba del botón del formulario, por último haga clic en publicar.

formulario creado con Ninja Forms

Opciones para agregar al formulario

Por último abra la pagina donde se debe de mostrar el formulario y valide que este funcionando correctamente con el captcha.

Formulario con el captcha integrado

Nota: Si su sitio web esta sobre Joomla los pasos para integrar reCAPTCHA cambian, puede ingresar aquí y ver los pasos para hacerlo.

Recuerde que puede encontrar en Dongee planes de hosting Wordpress que se adaptan a los requerimientos de su sitio web.

¿Ha quedado contestada tu pregunta?