MailChimp List Subscribe Form
Page jumps when submit button is pressed (5 posts)

  1. shumdesign
    Posted 3 years ago #

    http://dev.uwba.org/mainsite/wp/ is the development url for my form design. I used the plugin php code and then added some custom css and jquery.

    I like the plugin better than the embed code that sends the user to another page. However the page jumps down whenever the submit button is pressed and you have to scroll up to see the error messages.

    Is there a way to fix it that so the page doesn't move when the submit button is pressed?

    After processing the form I see this url which looks like an anchor tag: http://dev.uwba.org/mainsite/wp/#mc_signup

    Thanks in advance for any help!


  2. mc_nate
    Posted 3 years ago #

    Hey there, shum!

    Because the expected behavior is to have the form jump to the anchor that shows the error/success message, the only real way to stop it from doing that is to "sabotage" it. It's definitely not pretty and would need to be tested pretty thoroughly just to make sure everything works as expected, but what we did on our end to kill that was to edit the actual "mailchimp_widget.php" file and then edit the div that it's looking at:

    <div id="mc_signup">
    	<form method="post"  action="#mc_signup" id="mc_signup_form">
    		<input type="hidden" id="mc_submit_type" name="mc_submit_type" value="html" />
    		<input type="hidden" name="mcsf_action" value="mc_submit_signup_form" />.....

    Instead of having that opening div id point to "mc_signup", you can have it point anywhere else. In our test WP install, we used:

    <div id="test">

    That worked preliminarily, however it is VERY important to note that by no means is that saying everything is home free. It's essentially causing that HTML to become invalid as it's looking for an anchor that doesn't exist. Additionally, when the plugin is updated, any changes made to the PHP will be overwritten which means you'll have to do it over again after the upgrade.

    Let us know if we can help with anything else! We're always happy to lend a hand.


  3. shumdesign
    Posted 3 years ago #

    Thank you, MC_Nate!!, your code worked very well!! I decided to use JQuery to change the id so I didn't need to edit the plugin and if it gets updated it won't break. Thank you so much! It looks and works so much better now.

  4. shumdesign
    Posted 3 years ago #

    Hey MC_Nate,

    My team loves the mailchimp signup form that I styled on the home page of my dev site http://dev.uwba.org/mainsite/wp/ but they don't like the way the resulting message is styled once you submit your email address. It is just a box with some text and we would like to change the content of the resulting message to make it clear to go to their email to double-opt in.

    Where are the styles for that so I can change the look and feel of the messages?

    Or even better, I think that my team would like it to be a little box with a close button so that people will read it and realize that they have to activate the link in their email inbox.


  5. mc_nate
    Posted 3 years ago #

    Hey again!

    In this case, the BEST thing to do would be to create your own translation as per this page:


    Essentially, you could create your own success/error messages and have them displayed when someone submits the form. You'll just want to make sure that your pointing to the correct translation file within your setup.

    Let us know if we can help with anything else!


Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic