Intercepter les données des formulaires Contact Form 7

Vous développez sous WordPress ? Vous appréciez Contact Form 7 pour sa simplicité d’utilisation et sa flexibilité ? Mais vous souhaitez également pouvoir récupérer les données d’un formulaire envoyé par CF7, d’une manière ou d’une autre, pour en faire quelque chose qui sort du cadre de cette extension ? Parfait, vous êtes au bon endroit !

Les formulaires WordPress, ça nous connait : nous avons déjà abordé ici-même la création d’un formulaire WordPress sur-mesure ou encore l’utilisation de Gravity Forms pour créer des formulaires WordPress du tonnerre. Cette fois, analysons un peu le moteur du célèbre — et très bon — plugin Contact Form 7 et essayons d’étendre ses fonctionnalités de base afin d’intercepter les données lors de la soumission d’un formulaire.

Un peu de développement WordPress Contact Form 7

Créer un formulaire de contact avec Contact Form 7

Dans un premier temps, il est nécessaire de mettre en place un formulaire de contact avec l’extension Contact Form 7. Si ce plugin vous est encore inconnu, voire insurmontable, je vous incite à vous diriger vers l’excellent article de WP Marmite qui passe au crible les fonctionnalités de ce célèbre plugin.

Notez tout de même que les valeurs name de vos champs sont à retenir : ils nous serviront un peu plus tard dans ce tutoriel pour récupérer les données des champs remplis par l’utilisateur. J’utilise ici le formulaire livré par défaut avec l’extension, je dispose donc de 4 champs :

1. un champ « Votre nom » dont l’attribut name a la valeur your-name
2. un champ « Votre email » dont l’attribut name a la valeur your-email
3. un champ « Sujet » dont l’attribut name a la valeur your-subject
4. et enfin un champ « Votre message » dont l’attribut name a la valeur your-message

Créer un type de contenu pour stocker nos messages de formulaire

function msk_create_message_post_type() {
	register_post_type( 'form_msg',
		array(
			'labels' => array(
				'name'          => __( 'Messages' ),
				'singular_name' => __( 'Message' ),
				'add_new'       => __( 'Add New'  ),
				'add_new_item'  => __( 'Add new message' ),
				'edit'          => __( 'Edit'  ),
			),
			'menu_position' => 86,
			'show_ui'       => true,
			'show_in_menu'  => true,
			'public'        => false,
			'supports'      => array(
				'title',
				'editor',
			),
		)
	);
}
add_action('init', 'msk_create_message_post_type');

A chaque envoi de formulaire, Contact Form 7 envoie un e-mail à ou aux adresse(s) que vous avez configurée(s) dans les paramètres du formulaire. En parallèle, nous souhaiterions enregistrer un post de type « Message » contenant les données du formulaire.

On enregistre donc un nouveau type de contenu avec la fonction register_post_type qui s’appellera form_msg. N’hésitez pas à découvrir nos tutoriels sur les types de contenu personnalisé et les champs custom meta de WordPress si vous ne comprenez pas bien l’intérêt de cette fonction !

Hooker à l’envoi d’email de Contact Form 7

function msk_create_message_after_wpcf7_submission() {
	$submission = WPCF7_Submission::get_instance();

	if ($submission) {

		// On récupère les données du formulaire
		$posted_data = $submission->get_posted_data();

	}
}
add_action('wpcf7_mail_sent', 'msk_create_message_after_wpcf7_submission');

CF7 dispose de nombreux hooks pour nous permettre de filtrer des valeurs ou d’exécuter notre propre code à divers moments dans le plugin. L’action wpcf7_mail_sent est exécutée lorsque l’email a bien été envoyé.

On insère donc dans cette action une fonction maison qui va nous permettre d’exécuter la logique que l’on cherche. L’intérêt étant d’avoir accès aux données du formulaire, il nous faut :

1. obtenir l’instance de l’objet formulaire WPCF7_Submission via WPCF7_Submission::get_instance()
2. et récupérer les données envoyées de ce formulaire via la méthode get_posted_data()

Créer un post pour stocker le message

function msk_create_message_after_wpcf7_submission() {
	$submission = WPCF7_Submission::get_instance();

	if ($submission) {

		// On récupère les données du formulaire
		$posted_data = $submission->get_posted_data();

		// On stocke ce qu'on veut dans des variables, tout en assanissant les données
		$name = sanitize_text_field($posted_data['your-name']);
		$email = sanitize_email($posted_data['your-email']);
		$subject = sanitize_text_field($posted_data['your-subject']);
		$message = implode('n', array_map('sanitize_text_field', explode('n', $posted_data['your-message'])));

		// On rédige le contenu de notre post ...
		$post_body = sprintf(__('<h6>Message from %1$s <%2$s></h6>', 'twentyfifteen'), $name, $email);
		$post_body .= '<hr>';
		$post_body .= $message;

		// ... puis on insère un post de type 'form_msg' dans WordPress
		wp_insert_post(
		   array(
				'post_type' => 'form_msg',
				'post_title' => $subject,
				'post_content' => $post_body
			)
		);

	}
}
add_action('wpcf7_mail_sent', 'msk_create_message_after_wpcf7_submission');

Une fois nos données stockées dans une variable tableau $posted_data, il ne nous reste plus qu’à accéder aux informations que l’on souhaite, les traiter et les insérer dans un custom post de type form_msg.

Vous remarquerez ici les noms des clefs du tableau $post_data : ce sont les valeurs name que nous mentionnons plus haut lors de la création du formulaire CF7.

On utilise donc les fonctions d’assainissement de formulaire fournies par WordPress pour traiter proprement le nom, l’email, le sujet et le message du formulaire. Les fonctions de la variable $message permettent de nettoyer le contenu du message sans perdre les sauts de ligne (cf StackOverflow).

Ensuite, on génère une variable $post_body qui formera le contenu du post que nous allons insérer dans notre WordPress.

Et enfin, on enregistre un nouveau post de type form_msg au format brouillon (par défaut), ayant pour titre le champ « Votre sujet » du formulaire et pour contenu la variable $post_body que nous venons de créer.

Bonus : afficher une infobulle dans le menu d’administration WordPress

function msk_add_menu_msgform_bubble($menu) {
    $pending_count = wp_count_posts('form_msg')->draft;

    foreach($menu as $menu_key => $menu_data) {
        if ('edit.php?post_type=form_msg' != $menu_data[2])
    		continue;

        $menu[$menu_key][0] .= ' <span class='update-plugins count-$pending_count'><span class='plugin-count'>' . number_format_i18n($pending_count) . '</span></span>';
    }

    return $menu;
}
add_filter( 'add_menu_classes', 'msk_add_menu_msgform_bubble');

En bonus extra, ce code va nous permettre d’afficher une infobulle dans le menu d’administration « Messages » du type de contenu que nous avons créé. Ainsi, une petite notification numérique nous indique le nombre de nouveaux messages au format « brouillon » directement dans le menu.

Après lecture d’un message, il suffit de passer le post créé en statut « publié » afin de faire disparaître cette notification.

C’est ainsi que ce termine notre article de développement WordPress sur l’extension du comportement du plugin Contact Form 7 : vous pouvez désormais très facilement intercepter les données utilisateurs de vos formulaires afin de les traiter à votre goût.

N’hésitez pas à nous faire part en commentaire des utilisations que vous avez pu faire de cette action wpcf7_mail_sent !