Mailchimp / Newsletter sign up envelope icon and colour

Hi,

Looking for assistance in producing a mailchimp signup form like the demo version on the website here http://demo.xtemos.com/basel/home-flowers/?head8

Prior to “your email address” it shows an envelope icon that does not generate when creating a default mailchimp signup form.

Also looking for assistance in changing the colour from white or grey to black. See attached screenshot.

Hello,

Thank you for your question.

To place the icon for mailchimp form as per our demo you need to go to admin panel -> Mailchimp -> Forms -> edit your base form and place the following code there

<p class="mailchimp-input-icon">
	<label>Email address: </label>
	<input type="email" name="EMAIL" placeholder="Your email address" required />
</p>
<p>
	<input type="submit" value="Sign up" />
</p>

And here is a code snippet to change newsletter form placeholder color. Place it into the Custom CSS section in Theme Settings

.mc4wp-form .mc4wp-form-fields ::-webkit-input-placeholder {color:rgba(0,0,0,0.7)}
.mc4wp-form .mc4wp-form-fields ::-moz-placeholder          {color:rgba(0,0,0,0.7)}/* Firefox 19+ */
.mc4wp-form .mc4wp-form-fields :-moz-placeholder           {color:rgba(0,0,0,0.7)}/* Firefox 18- */
.mc4wp-form .mc4wp-form-fields :-ms-input-placeholder      {color:rgba(0,0,0,0.7)}

Regards

Hey,

Not Relevant, I managed to do it. Thanks.
How did you make the ‘Sign Up’ button on the same line with the email address like you did here: http://demo.xtemos.com/basel/watch-demo/ ?

Thanks,
Yuval.

Hi,

Try to add this code snippet to the Custom CSS section in Theme Settings to make this form inline

.mc4wp-form div {
    max-width: none;
}

Regards

[Author]

Posts