Comment inclure le titre de l’article / de la page dans le corps de l’e-mail du formulaire de contact

Vous utilisez Divi comme builder de votre site ? Moi aussi 🙂

Je viens d’apprendre comment ajouter le titre de l’article / de la page / du produit / etc… actuel au corps de l’e-mail du formulaire de contact.

Par défaut, il n’est pas possible d’ajouter du contenu dynamique dans un champ de formulaire de contact. De ce fait, le titre de la publication ou de la page à partir de laquelle le formulaire de contact a été soumis ne peut pas s’afficher.

Cet article décrit toutes les étapes de personnalisation pour intégrer le titre de la publication / page dans le corps de l’e-mail du module Formulaire de contact.

1. Pour chaque module de formulaire de contact dont vous souhaitez inclure le titre de l’article/de la page dans le corps de l’e-mail, ouvrez ses paramètres en cliquant sur l’icône d’engrenage.

2. Insérez un nouveau champ et définissez les options suivantes :

ID du champ : dt-custom-title
Titre : Titre du message

• Type : Champ de saisie
• Champ obligatoire : Non

3. Accédez à l’onglet Avancé → CSS personnalisé → CSS en forme libre

Ajoutez ce code CSS :

selector {
  display: none;
}

selector {
  display: none;
}

Le code CSS masquera le champ côté client, car nous n’avons pas besoin de l’afficher.

4. Modifiez le modèle de message et assurez-vous que le champ est inclus en utilisant %%dt-custom-title%%

Si vous utilisez un thème enfant , modifiez le fichier functions.php et placez ce code PHP après le code existant :

// Add current post title to a contact form hidden field
function add_post_title_to_cf_field(){
  // Get post title
  global $post;
  $title = get_the_title($post->ID); ?>

  <!-- Script for adding the retrieved title into the hidden field -->
  <script>
    (function($){
      $(document).ready(function(){
        if ($('p[data-id="dt-custom-title"] input').length) {
          $('p[data-id="dt-custom-title"] input').attr('value','<?php echo $title; ?>');
        }
      });
    })(jQuery);
  </script>
<?php }
add_action('wp_footer', 'add_post_title_to_cf_field');

// Add current post title to a contact form hidden field
function add_post_title_to_cf_field(){
  // Get post title
  global $post;
  $title = get_the_title($post->ID); ?>

  <!-- Script for adding the retrieved title into the hidden field -->
  <script>
    (function($){
      $(document).ready(function(){
        if ($('p[data-id="dt-custom-title"] input').length) {
          $('p[data-id="dt-custom-title"] input').attr('value','<?php echo $title; ?>');
        }
      });
    })(jQuery);
  </script>
<?php }
add_action('wp_footer', 'add_post_title_to_cf_field');

Et voici le résultat dans l’email :

J’espère que ce petit tuto que j’ai trouvé ici vous plaira car j’ai mis pas mal de temps à trouver cette astuce !

Pour ma part, j’ai amélioré le code :
– création d’un shortcode bouton pour capter l’ID de la page et le transmettre au formulaire
– récupération de l’ID et affichage du Titre et URL correspondant

A bientôt