Change MailChimp's success/error message

user1406440 picture user1406440 · Dec 13, 2017 · Viewed 12.7k times · Source

I can't find this anywhere. Can anyone who's familiar with MailChimp advise?

I've embed my form/input and there's some empty div's (below) which have error/success messages injected.

<div id="mce-responses" class="clear">
    <div class="response" id="mce-error-response" style="display:none"></div>
    <div class="response" id="mce-success-response" style="display:none"></div>
</div>

When I add custom text to the empty div's it just gets overwritten when the form is submitted so it's obviously getting the content from MailChimp somehow/where!

Any ideas?

Answer

jaredwolff picture jaredwolff · Apr 1, 2019

A programatic way to do it is with some javascript:

// select the target node
var target = document.getElementById('mce-success-response');

// create an observer instance
var observer = new MutationObserver(function(mutations) {
  mutations.forEach(function(mutation) {
    if (target.innerHTML === "Thank you for subscribing!") {
      target.innerHTML = "Check your email!";
    }
  });
});

// configuration of the observer:
var config = { attributes: true, childList: true, characterData: true };

// pass in the target node, as well as the observer options
observer.observe(target, config);

Got that code from here.