Last active
July 22, 2024 18:24
-
-
Save DmitriyRF/34f659dbbc02637cf7465e2efdd37ef5 to your computer and use it in GitHub Desktop.
Remove or don't redirect “thank you” page Mailchimp
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* To use this example: | |
| 1. Download this html file | |
| 2. Replace the form action url with your own from the MailChimp supplied embed code | |
| 3. Within the action url, replace "subscribe/post" with "subscribe/post-json" | |
| 4. Be sure the action url starts with http://. If it doesn't, the form will hang when testing the html as a local file in your browser. | |
| 5. Open this file in a browser on your local machine | |
| */ | |
| $("#mc-embedded-subscribe-form").submit(function(e){ | |
| e.preventDefault(); | |
| submitSubscribeForm($("#mc-embedded-subscribe-form"), $("#subscribe-result")); | |
| }); | |
| //$("#mc-embedded-subscribe-form") id form | |
| //$("#subscribe-result") after form <div id="subscribe-result"></div> | |
| function submitSubscribeForm($form, $resultElement) { | |
| $.ajax({ | |
| type: "GET", | |
| url: $form.attr("action"), | |
| data: $form.serialize(), | |
| cache: false, | |
| dataType: "jsonp", | |
| jsonp: "c", | |
| contentType: "application/json; charset=utf-8", | |
| error: function(error){}, | |
| success: function(data){ | |
| if (data.result != "success") { | |
| var message = data.msg || "Sorry. Unable to subscribe. Please try again later."; | |
| if (data.msg && data.msg.indexOf("already subscribed") >= 0) { | |
| message = "You're already subscribed. Thank you."; | |
| } | |
| $resultElement.html(message); | |
| } else { | |
| $resultElement.html("Thank you!<br>You must confirm the subscription in your inbox."); | |
| $form.css({ | |
| display: 'none' | |
| }); | |
| } | |
| } | |
| }); | |
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <title>Example ajax/jsonp MailChimp subscribe form</title> | |
| </head> | |
| <body> | |
| <!-- To use this example: | |
| 1. Download this html file | |
| 2. Replace the form action url with your own from the MailChimp supplied embed code | |
| 3. Within the action url, replace "subscribe/post" with "subscribe/post-json" | |
| 4. Be sure the action url starts with http://. If it doesn't, the form will hang when testing the html as a local file in your browser. | |
| 5. Open this file in a browser on your local machine | |
| --> | |
| <form | |
| id="subscribe-form" | |
| action="http://yourlist.us6.list-manage.com/subscribe/post-json?u=bbbaafd1d12345c57b712345&id=123456789e" | |
| method="get"> | |
| <h3>Want more great content delivered to your inbox?</h3> | |
| <p>(no spam ever, unsubscribe at any time)</p> | |
| <div> | |
| <input type="email" placeholder="email *" value="" name="EMAIL" > | |
| <input type="text" placeholder="first name" value="" name="FNAME"> | |
| </div> | |
| <div> | |
| <input type="submit" value="Keep Me Updated" name="subscribe"> | |
| </div> | |
| <div id="subscribe-result"> | |
| </div> | |
| </form> | |
| <script src="http://code.jquery.com/jquery-1.11.3.min.js"></script> | |
| <script type="text/javascript"> | |
| $(document).ready(function(){ | |
| ajaxMailChimpForm($("#subscribe-form"), $("#subscribe-result")); | |
| // Turn the given MailChimp form into an ajax version of it. | |
| // If resultElement is given, the subscribe result is set as html to | |
| // that element. | |
| function ajaxMailChimpForm($form, $resultElement){ | |
| // Hijack the submission. We'll submit the form manually. | |
| $form.submit(function(e) { | |
| e.preventDefault(); | |
| if (!isValidEmail($form)) { | |
| var error = "A valid email address must be provided."; | |
| $resultElement.html(error); | |
| $resultElement.css("color", "red"); | |
| } else { | |
| $resultElement.css("color", "black"); | |
| $resultElement.html("Subscribing..."); | |
| submitSubscribeForm($form, $resultElement); | |
| } | |
| }); | |
| } | |
| // Validate the email address in the form | |
| function isValidEmail($form) { | |
| // If email is empty, show error message. | |
| // contains just one @ | |
| var email = $form.find("input[type='email']").val(); | |
| if (!email || !email.length) { | |
| return false; | |
| } else if (email.indexOf("@") == -1) { | |
| return false; | |
| } | |
| return true; | |
| } | |
| // Submit the form with an ajax/jsonp request. | |
| // Based on http://stackoverflow.com/a/15120409/215821 | |
| function submitSubscribeForm($form, $resultElement) { | |
| $.ajax({ | |
| type: "GET", | |
| url: $form.attr("action"), | |
| data: $form.serialize(), | |
| cache: false, | |
| dataType: "jsonp", | |
| jsonp: "c", // trigger MailChimp to return a JSONP response | |
| contentType: "application/json; charset=utf-8", | |
| error: function(error){ | |
| // According to jquery docs, this is never called for cross-domain JSONP requests | |
| }, | |
| success: function(data){ | |
| if (data.result != "success") { | |
| var message = data.msg || "Sorry. Unable to subscribe. Please try again later."; | |
| $resultElement.css("color", "red"); | |
| if (data.msg && data.msg.indexOf("already subscribed") >= 0) { | |
| message = "You're already subscribed. Thank you."; | |
| $resultElement.css("color", "black"); | |
| } | |
| $resultElement.html(message); | |
| } else { | |
| $resultElement.css("color", "black"); | |
| $resultElement.html("Thank you!<br>You must confirm the subscription in your inbox."); | |
| } | |
| } | |
| }); | |
| } | |
| }); | |
| </script> | |
| </body> | |
| </html> |
Me too, don't know what goes wrong here.
I'm also having the same issues as above!
Changed http back to https and it worked for me live. Thanks for the code snippet.
This is working for me. Thanks!
Works Great! Thanks
You are an actual hero 3 weeks of mailchimp basically telling me to sort it myself as they had no idea thank you omg!
Thanks for this! When I tested locally it worked however when I put the exact same file online it redirected to Mailchimp who then complained that there's no such file. Any idea?
You need to add your u and id values as input fields before the e-mail field. Insert this:
<input type="hidden" name="u" value="xxxxxxxxxxxxxxxxxx"/> <input type="hidden" name="id" value="xxxxxxxxx"/> <input type="hidden" name="c" value="?"/>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Thanks for this!
When I tested locally it worked however when I put the exact same file online it redirected to Mailchimp who then complained that there's no such file. Any idea?