Can't get newsletter signup right in footer

Hey. I tried to always use the widget to get the signup form for mailchimp in my footer. I used all the online manuals from Mailchimp. But it never gets to a good position.

I want a box to enter the email address on the right side of the social icons.
Just on top the words "subscribe to .... here" and below that a blank box to enter email address with a "submit button". But I cant seem to get it right.

Any help is greatly appreciated!

  • Predrag Dubajic

    Hi Tobias,

    I was unable to find a solution other than adding the form directly inside the theme files.

    I tested this with our Mailchimp Integration plugin since I'm not much familiar with the other plugin you're using so note that below instructions are specific for that plugin.

    First thing you need to do is create a child theme of your Soledad theme, this is required as we're going to change theme file and with child theme your changes will not be overwritten after theme update is released.

    After you have created child theme go to your parent theme, copy footer.php file and then paste it in your child theme root folder.

    Now we need to edit footer.php so make sure you're editing the one inside your child theme.
    What you need to do is place below code somewhere around line 100 of the code, just before closing tag, it would look something like this:

    This is the code you need to add:
    <?php echo do_shortcode( '[mailchimp-form title="Subscribe to our MailChimp list." success_text="Thank you, your email has been added to the list." button_text="Submit" firstname="0" lastname="0"]' ); ?>

    Now there's a bit of styling to be added to make it look nicer and remove unnecessary fields, so edit style.css of your child theme and add this code in there:

    .incsub-mailchimp-form .incsub-mailchimp-field-wrap .ncsub-mailchimp-label-email,
    .incsub-mailchimp-form .incsub-mailchimp-field-wrap:first-of-type,
    .incsub-mailchimp-form .incsub-mailchimp-field-wrap:nth-of-type(2) {
        display: none;
    }
    
    .incsub-mailchimp-field {
        padding: 5px;
    }

    Save the changes in both files and that should be it, let us know how it goes. :slight_smile:

    Best regards,
    Predrag

  • Adam Czajczyk

    Hello Tobias!

    I checked your site and this additional CSS should place the form on the right to the icons:

    #incsub-mailchimp-shortcode-form-1 {clear:none;float:right;}
    #incsub-mailchimp-shortcode-form-1 div {float:left;clear:none;}
    #incsub-mailchimp-shortcode-form-1 .incsub-mailchimp-submit {clear:none;float:right;padding:3px 10px;}

    Give it a try please and let me know if it worked for you :slight_smile:

    Best regards,
    Adam