JustinBBC

You paste in the code (like the first one) into your webpage just like you did your code, then use the contact form and see if you get a pop-up.

But, you can do it now w/o changing your page. Open the webpage, press F12 to open the dev tools, select the “Conosle” tab.
on the input line, paste this code and press Enter:

document.addEventListener( 'wpcf7mailsent', function( event ) {
  console.log("mailsent event fired");
}, false );

Now (without closing the console pane/dev tools), fill out the form and send it. Did you get a message in the console that says “mailsent event fired” ?

After looking at that page, I’m thinking you don’t even have a Contact Form 7 form. Are you sure you have the Contact From 7 plugin installed and configured? Are you sure the shortcode is on this contact page? Are you using your theme’s built-in contact form?

It looks to me like there is a disconnect between the form and mail data.
Your mail has tags (I think they are called) like “your-name” but your form has something like “cf7s-name”. Make them the same.
Also, you might want to try putting an asterisk (*) after each field in the form. I’m no expert on this plugin, but mine has it.

As an example for you, here is my form:

<div id="contactForm">
<div id="name"><p>
    [text* your-name id:name  placeholder "Your Name"]</p>
</div>
<div id="email"><p>
    [email* your-email id:email placeholder "Your E-mail Address"]</p>
</div>
<div id="message"><p>
      [textarea* your-message x15 id:message placeholder "Message"]</p>
</div>

<div id="send"><p>[submit "Send"]</p>
</div>
</div>

My mail message body:

From: [your-name] <[your-email]>

Message:
[your-message]

See how the two have corresponding tags?

• This reply was modified 3 years, 7 months ago by JustinBBC.
• This reply was modified 3 years, 7 months ago by JustinBBC.