Progress Indicator CF7

Hi,

I have a CF7 form on my site when clicking the button submit, you can check here as it doesn’t show up any progress that’s being in the process to be sent. So the users are clicking on that button more than once as they don’t know that was submitted and I’m getting more submissions as many click user does.

Could you help me to resolve this as I’m getting more emails and the users are also getting more copies of email as it doesn’t show up indicator?

Thanks in advance!

@abdurrehman

Your form shows the response when sending the email or if there are issues. But it does take time to show.

You can change the template to show the response higher on the form by editing your CF7 template. Click here for example on doing this.

But basically you are adding in the [response] tag into the template instead of it being at the end by default.

Example:

[response]

Your Name (required)
[text* your-name]

Subject
[text your-subject]

Your Message
[textarea your-message]

[response]

[submit "Send"]

@designerken

Thanks for your reply.

Yeah, it does show the message response where placing that short but I really want to add an indicator that could show the user that wait it’s in the process to be sent as Avada has.

I didn’t see the indicator on any of the examples you linked.

Look at your code there is this:

<span class="ajax-loader"></span>

After your submit button, the JS makes it active when submitting. Watch your inspector as it is sending you will see it change its class.

Just define the loader in css and you will see it. Currently there is nothing defining it. Even copy the CSS from Avada if you want.

Hi there,

There is a usability issue in the theme that the loader icon is not showing. We already have this in our issue tracker and it will be fixed in the upcoming release.

At the moment you can temporarily add the code below to the functions.php file of your Child Theme:

add_action('wp_head', 'add_loader_gif');

function add_loader_gif() {
  echo '<style>.wpcf7 .ajax-loader{background-image: url('. plugins_url() .'/contact-form-7/images/ajax-loader.gif);visibility:hidden;display:inline-block;width:16px;height:16px;border:none;padding:0;margin:0 0 0 4px;vertical-align:middle}.wpcf7 .ajax-loader.is-active{visibility:visible}</style>';
}

Thank you.

Hi there,

Looks like the thread got bumped, I wonder if you have recent reply, does it work now?

Thanks!

@christopher.amirian Thank you so much. Is there any public tracker for them?

The code worked like great as I was looking for. Thanks

@Rad Sorry, I don’t know what you mean by your reply. :confused:

@christopher.amirian

In my CF7 in the additional header, I’ve got shortcode the email of the person who submits the form to reply him directly e.g: “Reply-To” [your-email] but it doesn’t work it just reply to the email which I’ve set to come from. Could this be an issue with CF7 or just mystie? Could you test this on your end, please? Thanks in advance!

@designerken thanks for your reply. :thumbsup:

Hi there,

Please ignore my last reply, I just wondered if you have reply since the thread got bumped.

About the email, could you provide a sample email being sent? The [your-email] is the visitor’s email in which a return-to address once you got his message. And the your-email field should also present in your form to make it work. I checked your form and you should change [your-email] with [contact-email] since you changed it in your form.

Thanks!

Yes, [your-email] is the visitor emails so in the reply to email have a look here

But when I reply I’m replying to that message I’m replying to the email which is set to get emails from. See here

Settings seems find not sure though why it desn’t work.

Hello There,

Thanks for updating in! You have used “Reply To” incorrectly. It is supposedly the alternate email of the admin and not the email which came from the users. To know more about Reply To in Contact form 7, please check this out:


Hope this helps.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.