Saber desde cual URL se envía un mensaje en WordPress, a través del formulario de contacto de Divi Theme

Si tu sitio web montado con Divi Theme y cuenta con varios formularios de contacto, tal vez te interese saber desde cual URL se te envía el mensaje exactamente. Aprende a incluir la URL de la página desde donde fue enviado el mensaje, desde el módulo de Formulario de Contacto de Divi.

¿Por qué necesitarías incluir la URL desde donde fue enviado el mensaje en Divi?

Puede ser que utilices el formulario de Divi en algunas de estas situaciones o espacios:

• Usás formularios en varias páginas de tu sitio web como un recurso de captación rápido.
• Dispones de un formulario en el pie de página.
• Tenés un formulario que se abre en un modal.
• Contás con una o más páginas para captación de leads.
• Utilizás formularios para inscripción a cursos o eventos.

En todos estos casos, si necesitás recibir una copia del mensaje en tu bandeja de entrada, te resultará cómodo saber exactamente desde qué URL te escribieron. Así, tendrás el contexto de esa comunicación.

Nota: Quiero agradecer al lector Jorge, que me dejó esta inquietud en los comentarios de una entrada similar del blog: Saber desde que URL se envía un mensaje en WordPress, a través de Caldera Forms y Contact Form 7.

Así que veamos cómo lograr esto en Divi en 3 simples pasos.

1. Configurar el módulo de Formulario de Contacto en Divi

Lo primero es añadir este módulo a tu página y configurarlo con todo lo que necesites.

Cuando tengas el formulario listo, agregarás un campo más que estará oculto para el usuario y que será el que te indique la URL desde donde fue enviado.

A este campo extra, tenés que configurarle el ID o Identificación de campo “page_url”, como te muestro en la siguiente captura de pantalla:

Luego en la pestaña de Avanzado, en la sección Main Element o Elemento principal, vas a escribir este código para que el campo no sea visible dentro del formulario.

display: none !important;

2. Agrega jQuery a tu Child Theme

Doy por hecho que tienes instalado tu Divi Child Theme. Si no es así, puedes descargarlo aquí.

En el archivo functions.php del tema hijo, agregarás este código:

function divi_add_page_name_id() {
	$page_name = get_the_title(); // obtiene el nombre o título de la página
	$page_url = get_permalink(); // obtiene la URL de la página
	?>
	<script>
		jQuery(document).ready(function($) {
			$('input[data-original_id="page_name"]').val('<?php echo esc_html( $page_name ) ?>'); // inserta el nombre de la página en el campo de nombre de la página | cambia "page_name" para que sea la identificación que agregues en el módulo de contacto Divi para el nombre de la página
			$('input[data-original_id="page_name"]').prop('readonly', true); // evita que el llenado automático cambie el valor
			$('input[data-original_id="page_url"]').val('<?php echo esc_html( $page_url ) ?>'); // inserta la URL de la página en el campo URL de la página | cambia el "page_url" para que sea la identificación que agregue en el módulo de contacto Divi para la URL
			$('input[data-original_id="page_url"]').prop('readonly', true); // evita que el llenado automático cambie el valor
		});
	</script>
	<?php
}
add_action('wp_footer', 'divi_add_page_name_id'); // acción de WordPress para insertar código en el pie de página de su sitio web

Este código, además de permitirte saber la URL desde donde te enviaron el mensaje, puede también incluir el nombre de la página.

Para este tutorial, yo no apliqué, pues no suelo utilizarlo de esta manera. Pero si te interesa ver esta información, tenés que crear otro campo extra en el formulario (también oculto) y en el campo del ID o Identificación de campo escribir “page_name” (sin las comillas).

Luego en la configuración del mensaje que te llegará a tu correo, agregar:

“Desde la Página: %%page_name%%” (sin las comillas).

3. Configurar el mensaje que se enviará a tu correo desde el formulario de Divi

El último paso es configurar correctamente el mensaje que el formulario de contacto de Divi enviará a tu correo.

Como ya sabés, para que puedas visualizar la información escrita por el usuario en los campos del formulario, hay que usar etiquetas.

Así que en la pestaña Contenido del formulario, en la sección Message Patern o Patrón de mensaje, vas a agregar la URL tal cual te muestro en la imagen:

A continuación, probá el formulario enviándote un mensaje. El correo que te llegará se verá como este:

Y eso es todo.

Si te sirvió este tutorial para saber desde que URL te han escrito en tu página con Divi, te leo en los comentarios.