[Plugin: MailChimp List Subscribe Form] Request: Add Placeholder text for Mailchimp Widget

Actually, you can add it, but you need to edit the plugin file.

If you open mailchimp_widget.php find this block of code:

<input type="text" size="4" maxlength="4" value="" name="'.esc_attr($opt.'[detail2]').'" id="'.esc_attr($opt.'-detail2').'" class="mc_input mc_phone" />
			';
				break;
			case 'email':
			case 'url':
			case 'imageurl':
			case 'text':
			case 'number':
			default:
				$html .= '
	<input type="text" size="18" value="'.esc_html($var['default']).'" name="'.esc_attr($opt).'" id="'.esc_attr($opt).'" class="mc_input" />';

At the end, just after class=”mc_input” add this:

placeholder="Your best email...."

Or whatever you want your placeholder to be. I’ve added it to the email field in this example, but if you search “mc_input” you’ll find options for address, name, etc.

Just keep in mind that if you update the plugin, you’ll have to go back and redo your edits.

Fellow-Wordpress users to the rescue!

Good looking out, Kaelin!

No problem- I love mailchimp! Just gotta bribe it with bananas sometimes. ??

I really like how the widget looks with the placeholder text. I was wondering if (1) you know how to remove the label “Email Address” from before the input box and (2) how I can have it so that the input box and submit button are on the same line.

Here is the temp site I am currently working on, so you can see what I am talking about.

https://treksinthewild2.netfirms.com/canoe-rentals/

Thanks!

Hey there, Beama!

In order to do something like what you’re describing, it’ll take a little CSS tinkering. You’ll want to set the field names to “display:none” and then float the input to the left to have it look something like this:

https://cl.ly/3a1K1Q073j3X2K293x2H

#mc_signup_form .mc_input {
float:left;}
#mc_signup_form .mc_var_label {
display:none;}

From there, you can adjust the margins/padding to get the submit but exactly where you want it.

If we can help with anything else, give us a shout!

Cheers

Beautiful! that’s perfect!

Thanks!

Glad to help!

Cheers

hi all, hope you may be able to help

as you can see on my site i’ve taken some of the advice from this post, but i’m not a fan of the submit button. I’d love to be able to have a button like the one on Beama’s site

I am using the mailchimp Widget, so any idea how i can replace the default button with a more attractive one???

any help would be great

Matt

Hi Matt,

here is the CSS formatting for button from my template. You can add this to your CSS style sheet and customize from there.

#mc_signup_submit.button:hover {
background: #690;
color: white;
border: 1px solid #690;
}

#mc_signup_submit.button {
background: #EEE;
color: #666;
font-family: Georgia, “Times New Roman”, Times, serif;
font-size: 12px;
font-style: italic;
font-weight: normal;
text-decoration: none;
margin: 0px 15px 0px 0px;
padding: 4px 8px 4px 8px;
border: 1px solid #DDD;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
cursor: pointer;
}

Huge thanks, that has worked perfectly ??

Slowly but surly i’m getting there

thanks again

Matt (Turndog Millionaire)

So I inserted the placeholder code at the end, just after class=”mc_input” as you described at the beginning of this topic, and what I get in all three of input boxes;
email
last name
first name
is each input box placeholder reads with the same text.

How does one have distinct and individual placeholders?
Email for email
First name for first name
Last name for last name

Thanks a bunch!

Hey there, guys.

There is a way to pull in some value for that field, automatically from your MailChimp list. What you’d want to do is set a “Default Value” in your forms in MailChimp, first:

How do I set default merge values (like Dear Customer)?: https://eepurl.com/hcDC

Then, after setting the value for each field, you’d want to update your list settings in WordPress by going to “Settings” -> “MailChimp Setup” -> “Update List”.

Cheers

Hi there, i am also trying to get rid of the labels and create a placeholder. I am having 2 issues at my site https://www.paula.clicksold.com :

1) i added the css display: none float:left to get rid of the labels and that worked on Internet Explorer. In Firefox and on my iphone I still see the labels and all of the formatting disappears because the lines become too long.

2) I followed the instructions above to enter placeholder text and I cannot see the placeholder. Here is the code and hopefully you can help me:

break;
case ’email’:
case ‘url’:
case ‘imageurl’:
case ‘text’:
case ‘number’:
default:
$html .= ‘
<input type=”text” size=”18″ value=”‘.esc_html($var[‘default’]).'” name=”‘.esc_attr($opt).'” id=”‘.esc_attr($opt).'” class=”mc_input” placeholder=”Email Address” />’;
break;

I’m having the exact same problem as ‘paulaa’. I’ve entered the placeholder tag and cannot get the placeholder text to show up in the email input field. Any ideas?

I got the first name to show up by setting the “default value” on the mailchimp site. The email input does not have a “default value” on the mailchimp site.

https://www.taxgems.com

Hey thanks KaelinDesign, This worked like a charm ??