Design of button and more shortcodes for contact form
-
Hi,
1) how can I change the design of the submit button? Is it possible simply via CSS?
2) Is it possible to have more shortcodes for contact forms? I’d like to use different MailChimp lists for this.
-
Hi Jack.
Yes, you can change the forms styles with custom CSS.
You have a few options to add CSS code:
- If you’re using WordPress 4.7 or higher, you can go to Appearance > Customize > Additional CSS and place the code there.
- If you created this theme yourself, you can just add it to your style.css file
- If you’re using a theme you downloaded or bought you can make a child theme and add the code to your child theme’s style.css file
- Your theme may have a “Custom CSS” option. If it does, then you can just pop it in there.
- You can use a plugin like Simple Custom CSS or Jetpack and enter the code in their Custom CSS area
You can also create as many forms for as many lists as you like.
Thank you,
-TracyThanks Tracy, I’m almost done with CSS. I’m just not able to change the background color and remove the border of the input field.
For
.yikes-easy-mc-form input[type=email], .yikes-easy-mc-form input[type=number], .yikes-easy-mc-form input[type=password], .yikes-easy-mc-form input[type=text], .yikes-easy-mc-form input[type=url], .yikes-easy-mc-form select, .yikes-easy-mc-form textarea
I havebackground-color: #ffffff; border: 0;
, but the background color is still #f1f1f1 and border: 2px solid rgba(51,51,51,.1). Could you please help me?What I meant by shortcodes for contact form was the integration with Contact Form 7 so I can use the tick box. But in the Integration Settings I can choose only one MailChimp list so there is only one shortcode [yikes_mailchimp_checkbox].
And it seems that mobile browser (Chrome for Android) doesn’t accept the custom CSS at all.
Oh and your other question, yes you can only make 1 form connect to one list at a time.
Thank you,
-TracyHi Tracy, it is travelsurfrepeat.com. Sorry for my CSS skills 😂
Ha ha, your CSS is fine 🙂
It just needs to be more specific, try this:
.yikes-mailchimp-container .yikes-easy-mc-form input[type="email"], .yikes-mailchimp-container .yikes-easy-mc-form input[type="number"], .yikes-mailchimp-container .yikes-easy-mc-form input[type="password"], .yikes-mailchimp-container .yikes-easy-mc-form input[type="text"], .yikes-mailchimp-container .yikes-easy-mc-form input[type="url"], .yikes-mailchimp-container .yikes-easy-mc-form select, .yikes-mailchimp-container .yikes-easy-mc-form textarea
Let me know if that works.
-TracyPerfect, that’s exactly what I was looking for.
Thank you for your help!Yay!
Glad I could help.
-Tracy
- The topic ‘Design of button and more shortcodes for contact form’ is closed to new replies.