Tagged: horizontal, MailChimp, optin
-
AuthorPosts
-
December 28, 2015 at 6:34 pm #557786
Hey guys,
Accidentally erased my wp-content folder while I was updating to WP 4.4. So… I’m having to do a lot of configuration over again.
One thing I want to get back into place is a horizontal optin for mailchimp. Similar to this:
Previously I was using the Mailchimp 4 WordPress plugin to do this, but I can’t seem to get it to work again.
I’ve been frantically going through the forums trying to find anything in regards to how to make it work, but to no success.
Is there a step by step procedure to get this to work?
Thanks!
- This topic was modified 8 years, 12 months ago by JC.
December 28, 2015 at 7:27 pm #557806Also, I wanted to add what I believe is my old Quick CSS code for this.
The result that it’s giving me is this:
Here’s that code (don’t know if it’s 100% complete):
.mc4wp-form form{margin:0!important;clear:both}
.mc4wp-form p br{display:none}
.mc4wp-form label{display:block;visibility:visible;position:relative;margin-bottom:7px;font-weight:600}
.mc4wp-form p{position:relative;clear:both;float:left;width:100%}
.mc4wp-form p.hidden{position:absolute;width:0;left:0;top:0}
.mc4wp-form .form_element_half{width:49.5%;float:left;margin-left:1%;clear:none}
.mc4wp-form .form_element_third{width:32.6%;float:left;margin-left:1%;clear:none}
.mc4wp-form .form_element_two_third{width:66.4%;float:left;margin-left:1%;clear:none}
.mc4wp-form .form_element_fourth{width:24.2%;float:left;margin-left:1%;clear:none}
.mc4wp-form .form_element_three_fourth{width:74.8%;float:left;margin-left:1%;clear:none}
.mc4wp-form .first_form{clear:both;margin-left:0}#top .mc4wp-form select{-webkit-appearance:none;border-radius:0;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAANCAYAAAC+ct6XAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBNYWNpbnRvc2giIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RjBBRUQ1QTQ1QzkxMTFFMDlDNDdEQzgyNUE1RjI4MTEiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RjBBRUQ1QTU1QzkxMTFFMDlDNDdEQzgyNUE1RjI4MTEiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpGMEFFRDVBMjVDOTExMUUwOUM0N0RDODI1QTVGMjgxMSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpGMEFFRDVBMzVDOTExMUUwOUM0N0RDODI1QTVGMjgxMSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pk5mU4QAAACUSURBVHjaYmRgYJD6////MwY6AyaGAQIspCieM2cOjKkIxCFA3A0TSElJoZ3FUCANxAeAWA6IOYG4iR5BjWwpCDQCcSnNgxoIVJCDFwnwA/FHWlp8EIpHSKoGgiggLkITewrEcbQO6mVAbAbE+VD+a3IsJTc7FQAxDxD7AbEzEF+jR1DDywtoCr9DbhwzDlRZDRBgACYqHJO9bkklAAAAAElFTkSuQmCC);background-position:center right;background-repeat:no-repeat;border-radius:2px}
.mc4wp-form .button{margin:0;padding:16px 20px;border-radius:2px;border-bottom-width:1px;border-bottom-style:solid;font-weight:400;font-size:12px;min-width:142px;outline:none}
.mc4wp-form .modified_width .button{width:100%;padding:13px 10px 14px;min-width:0}
.mc4wp-form p input,.mc4wp-form p textarea,.mc4wp-form p select{-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;transition:all .3s ease-in-out}@media only screen and (max-width: 479px) { .responsive .mc4wp-form .form_element{width:100%;clear:both;margin-right:0;margin-left:0;float:none} }
#top .mc4wp-form input[type=’text’],#top .mc4wp-form input[type=’email’],#top .mc4wp-form select,#top .mc4wp-form textarea{width:100%;margin-bottom:0;display:inline;min-width:50px;padding:13px;border-radius:2px}December 28, 2015 at 10:45 pm #557874Hi!
can we please give a look on a live access of your web site?
Regards,
BasilisDecember 28, 2015 at 10:50 pm #557878Sure.
December 30, 2015 at 11:05 am #558398Hey!
Here’s the old tutorial on how to integrate MC4WP with Enfold:
http://kriesi.at/documentation/enfold/mailchimp-4-wordpress-integration/Refer to this thread on how to make it transparent:
https://kriesi.at/support/topic/single-line-mailchimp-sign-up-form/#post-487077Cheers!
JosueJanuary 4, 2016 at 8:39 pm #559456Thanks, Josue. That’s what I was looking for.
Also, just for anyone who finds this in the future (or myself for reference):
If you’re wanting to make your submit button the same size as the text boxes, here’s the post for that:
https://kriesi.at/support/topic/mailchimp-intregration-button-size-and-alignment/
However, that only works for the main section.
Josue, (or anyone else) If I’m using the “Opt-in box at the end of each Post” the code doesn’t fix the submit button there. What do I need to add to the following to make it to work?
/* av-sub-box */ .av-sub-box{ padding: 20px; background: #F4F4F4; width:100%; clear:both; float:left; margin-top: 80px; border: 1px solid #e1e1e1; margin-bottom: -40px; border-radius: 3px; }
- This reply was modified 8 years, 11 months ago by JC.
January 4, 2016 at 10:48 pm #559548Hey!
Try with this:
.av-sub-box .mc4wp-form .modified_width .button { padding: 8px; }
Regards,
JosueJanuary 4, 2016 at 10:51 pm #559553Awesome. That did it. :)
Thanks a bunch, Josue! You da man!
(Now we can close this thread.)
January 4, 2016 at 11:35 pm #559574You are welcome, glad to help :)
Regards,
Josue -
AuthorPosts
- The topic ‘Getting Mailchimp Optin on a single line (Horizontal)’ is closed to new replies.