Created a Mailchimp pop-up subscribe form and have no idea how to install/where to put the code!

Where do I paste the code for a Mailchimp pop-up subscribe form? Tried PopUp Pro, but don't want to create a new one - want to use the nicely formatted one from Mailchimp. THanks for any ideas! I am a Wordpress toddler.

  • Vaughan

    Hi Patti,

    Hope you're well?

    You should be able to paste the code into the popup editor when you create a popup. Can you copy/paste the mailchimp code that you are wanting to use?

    I see you have granted support access, however I get an invalid token when trying to access, this does sometimes happen, if you could revoke access & then grant access again, this usually fixes the invalid token so we can then login.

    Thanks

  • Patti

    thanks, vaughan!

    i've reset the support access and here's the mailchimp code:

    <script type="text/javascript" src="//s3.amazonaws.com/downloads.mailchimp.com/js/signup-forms/popup/embed.js" data-dojo-config="usePlainJson: true, isDebug: false"></script><script type="text/javascript">require(["mojo/signup-forms/Loader"], function(L) { L.start({"baseUrl":"mc.us2.list-manage.com","uuid":"c7c484cc38a433a8b3c4cb744","lid":"f33e919b4f"}) })</script>

  • Vaughan

    Hi Patti,

    Sorry for the delay here.

    That code doesn't look complete.

    Here's how my mailchimp form code looks like.

    <!-- Begin MailChimp Signup Form -->
    <link href="//cdn-images.mailchimp.com/embedcode/classic-081711.css" rel="stylesheet" type="text/css">
    <style type="text/css">
    	#mc_embed_signup{background:#fff; clear:left; font:14px Helvetica,Arial,sans-serif; }
    	/* Add your own MailChimp form style overrides in your site stylesheet or in this style block.
    	   We recommend moving this block and the preceding CSS link to the HEAD of your HTML file. */
    </style>
    <div id="mc_embed_signup">
    <form action="//removed-for-security&id=43ef5bb6a4" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
        <div id="mc_embed_signup_scroll">
    	<h2>Subscribe to our mailing list</h2>
    <div class="indicates-required"><span class="asterisk">*</span> indicates required</div>
    <div class="mc-field-group">
    	<label for="mce-EMAIL">Email Address  <span class="asterisk">*</span>
    </label>
    	<input type="email" value="" name="EMAIL" class="required email" id="mce-EMAIL">
    </div>
    <div class="mc-field-group">
    	<label for="mce-FNAME">First Name </label>
    	<input type="text" value="" name="FNAME" class="" id="mce-FNAME">
    </div>
    <div class="mc-field-group">
    	<label for="mce-LNAME">Last Name </label>
    	<input type="text" value="" name="LNAME" class="" id="mce-LNAME">
    </div>
    	<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>    <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
        <div style="position: absolute; left: -5000px;"><input type="text" name="b_e5d40e175a73a431cffc572c0_43ef5bb6a4" tabindex="-1" value=""></div>
        <div class="clear"><input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button"></div>
        </div>
    </form>
    </div>
    <script type='text/javascript' src='//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js'></script><script type='text/javascript'>(function($) {window.fnames = new Array(); window.ftypes = new Array();fnames[0]='EMAIL';ftypes[0]='email';fnames[1]='FNAME';ftypes[1]='text';fnames[2]='LNAME';ftypes[2]='text';}(jQuery));var $mcj = jQuery.noConflict(true);</script>
    <!--End mc_embed_signup-->

    you should be able to get the embed code from your mailchimp account.

    Login to mailchimp.com

    - click Lists
    - click the list you require from the selection.
    - click sign up forms
    - click embedded forms

    Then copy/paste the code for that form into your popup editor.

    Hope this helps

  • Steven

    That's the embedded form, Vaughan. Patti is using the MC popup form as am I Patti, I use a theme that allows me to place code like this into the header. As I am not a coder I don't wish to second guess where you should place it, and will leave it to the experts. It does work for my site and looks good. My problem is that even after deleting cookies/cache etc the form never reappears which is annoying if you want to check it again. I read somewhere it reappears after one year. I wonder where these settings are?

  • calvinrogercanas

    Hey there guys,

    Hope you guys are having a great weekend!

    @Patti

    Insert this code to your functions.php

    function add_mailchimp_popup_form() {
    	?>
    	<script type="text/javascript" src="//s3.amazonaws.com/downloads.mailchimp.com/js/signup-forms/popup/embed.js" data-dojo-config="usePlainJson: true, isDebug: false"></script><script type="text/javascript">require(["mojo/signup-forms/Loader"], function(L) { L.start({"baseUrl":"mc.us2.list-manage.com","uuid":"c7c484cc38a433a8b3c4cb744","lid":"f33e919b4f"}) })</script>
    	<?php
    }
    
    add_action( 'wp_footer', 'add_mailchimp_popup_form' );

    Let me know if it helps!

    Best Regards,
    Calvin