Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #245002

    Hi,

    I want to include a horizontal mailchimp subscribe form (input fields and button in one line) on my homepage. I got the form code and css. But when I embed the form code into a text block in the avia editor, the fields and subscribe button appear in separate lines.

    Here’s the embed code:

    <!-- Begin MailChimp Signup Form -->
    <div id="mc_embed_signup"><form class="validate" id="mc-embedded-subscribe-form" action="http://infotropic.us1.list-manage.com/subscribe/post?u=e42fcc81087eaa43b62733e2e&id=bec036a757" method="post" name="mc-embedded-subscribe-form" novalidate="" target="_blank"><div class="mc-field-group"><strong>Never miss an update</strong> <input class="required email" id="mce-EMAIL" type="email" name="EMAIL" placeholder="Email" value="" /><input class="required" id="mce-FNAME" type="text" name="FNAME" placeholder="Name" value="" /><input class="button" id="mc-embedded-subscribe" type="submit" name="subscribe" value="Subscribe" /></div>
    </form></div>
    <!--End mc_embed_signup-->

    Here’s the CSS I added in the “Quick CSS” section:

    .mc-field-group{
    	background-color: #ffffff; 
    	padding: 0px;
    }
    
    #mce-email {
    	float: left;
    	margin:10px;
    }
    
    #mce-FNAME{
    	margin:10px;
    }

    Looks like the avia editor breaks the code.

    #245006

    Hey!

    So it doesn’t happen if you don’t use ALB? can you post a link to the page?

    Best regards,
    Josue

    #245025

    Josue, haven’t thought of that. Tried it out with the traditional editor – same result. I set up a test page (since the site is live) with only the form on it: http://infotropic.ru/?page_id=607. In the visual editor the form shows in one line as it is supposed to show. But on the page it is still in several lines.

    Best regards,
    Holger

    #245511

    Hey!

    Please add following code to Quick CSS in Enfold theme options under Styling tab

    #mce-EMAIL, #mce-FNAME {
    float: left;
    margin-right: 15px!important;
    }
    #mc-embedded-subscribe { margin: 0; }

    Cheers!
    Yigit

    #245554

    Works! Thanks a lot. Problem solved.

    #245566

    Hi!

    You are welcome, glad we could help! Let us know if you have any other questions or issues

    Regards,
    Yigit

Viewing 6 posts - 1 through 6 (of 6 total)
  • The topic ‘Horizontal Mailchimp subscribe form’ is closed to new replies.