-
Posts
-
I recently started using the “Mailchimp for WordPress” plugin over of the integrated Mailchimp Signup Form in the Enfold theme because I needed to add custom tracking codes to the signup form in an attempt to compile my email lists. I am trying to use custom CSS code to maintain the look of the “Dark Transparent” styling option, and I am close, but struggling to figure it out completely.
^This is my attempt at the CSS using custom code and MC4WP plugin
^I want the code to look something like this – “Dark TransparentPlease let me know if this is doable. Thanks.
This is the code I’m currently using.
.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} @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} #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} #mc4wp-form-1 input[type="text"], #mc4wp-form-1 input[type="email"] { background-color: transparent!important; border: 2px solid white; }Hi cetsolini,
https://cl.ly/195c436b7175 We don’t see the screenshots, please upload them to a service like Dropbox and give us the links here.
Could you please give us a link to your website, we need more context to be able to help you.
Best regards,
Victoriahttps://www.dropbox.com/s/q8smujj60hzlj1l/Dark%20Transparent%20.png?dl=0 – this is want I want to achieve
https://www.dropbox.com/s/karxymd8ugbg6uq/My%20Attempt.png?dl=0 – this was what I am at
Hopefully that worked! thanks.
Hi cetsolini,
Thank you, yes, we can see the screenshots now.
Could you please give us a link to your website, we need more context to be able to help you.
Best regards,
Victoria
- You must be logged in to reply to this topic.