Login/Registration Design messes up my CSS

Hi there,

first of all: brilliant plugin. I really enjoy it and think it’s a very good plugin.

One thing that bugs me though is the fact that s2Member adds some CSS to my site which messes up my theme. I use the plugin Theme-My-Login to have front facing login/registration pages and profiles and thus don’t need that feature from s2Member and I deactivated everything relating to this.

The problem is that the options set in “Login/Registration Design” in “General Options” are always added as inline CSS in the registration and login page (which is my profile page as well) and the messes up my CSS. I tried to save the “General Options” with empty values for “Overall Font Size:” and “Overall Font Family:” but as they are “required” fields it keeps the default values there.

I already tried the MU plugin described in http://www.s2member.com/faqs/#s2-faqs-stop-loading-css but the inline CSS is still being loaded.

This is the block that disappears when I disable s2Member and I want it gone permantely:

<style type="text/css">
html, body { border:0 !important; background:none !important; }
html { background-color:#FDFAF8 !important; }
html { background-image:url() !important; }
html { background-repeat:repeat !important; }
body, body * { font-size:12px !important; }
body, body * { font-family:'Verdana', 'Arial', sans-serif !important; }
div#login { width:550px !important; }
div#login h1 a { background:url(http://127.0.0.1/cmonitor/wp-content/plugins/s2member/images/logo.png) no-repeat top center !important; background-size:auto !important; }
div#login h1 a { display:block !important; width:100% !important; height:100px !important; }
div#login form { -moz-box-shadow:1px 1px 5px #EEEEEE, -1px -1px 5px #EEEEEE !important; -webkit-box-shadow:1px 1px 5px #EEEEEE, -1px -1px 5px #EEEEEE !important; box-shadow:1px 1px 5px #EEEEEE, -1px -1px 5px #EEEEEE !important; }
div#login p#nav, div#login p#nav a, div#login p#nav a:hover, div#login p#nav a:active, div#login p#nav a:focus { color:#000000 !important; text-shadow:1px 1px 3px #EEEEEE !important; }
div#login p#backtoblog, div#login p#backtoblog a, div#login p#backtoblog a:hover, div#login p#backtoblog a:active, div#login p#backtoblog a:focus { color:#000000 !important; text-shadow:1px 1px 3px #EEEEEE !important; }
div#login form p { margin:2px 0 16px 0 !important; }
div#login form input[type="text"], div#login form input[type="email"], div#login form input[type="password"], div#login form textarea, div#login form select { font-weight:normal !important; color:#333333 !important; background:none repeat scroll 0 0 #FBFBFB !important; border:1px solid #E5E5E5 !important; font-size:18px !important; margin:0 !important; padding:3px !important; -moz-border-radius:3px !important; -webkit-border-radius:3px !important; border-radius:3px !important; width:100% !important; width:98% !important !ie<8; margin-right:2% !important !ie<8; box-sizing:border-box !important; -ms-box-sizing:border-box !important; -moz-box-sizing:border-box !important; -webkit-box-sizing:border-box !important; }
div#login form select { width:99.5% !important !ie<8; } div#login form select > option { font-size:18px !important; }
div#login form label { cursor:pointer !important; } div#login form label.ws-plugin--s2member-custom-reg-field-op-l { opacity:0.7 !important; font-size:90% !important; vertical-align:middle !important; }
div#login form input[type="checkbox"], div#login form input[type="radio"] { margin:0 3px 0 0 !important; vertical-align:middle !important; }
div#login form input#ws-plugin--s2member-custom-reg-field-user-pass2[type="password"] { margin-top:5px !important; }
div#login form div.ws-plugin--s2member-custom-reg-field-divider-section { margin:2px 0 16px 0 !important; border:0 !important; height:1px !important; line-height:1px !important; background:#CCCCCC !important; }
div#login form div.ws-plugin--s2member-custom-reg-field-divider-section-title { margin:2px 0 16px 0 !important; border:0 solid #CCCCCC !important; border-width:0 0 1px 0 !important; padding:0 0 10px 0 !important; font-size:110% !important; }
div#login form input[type="submit"], div#login form input[type="submit"]:hover, div#login form input[type="submit"]:active, div#login form input[type="submit"]:focus { color:#666666 !important; text-shadow:2px 2px 5px #EEEEEE !important; border:1px solid #999999 !important; background:#FBFBFB !important; padding:5px !important; -moz-border-radius:3px !important; -webkit-border-radius:3px !important; border-radius:3px !important; }
div#login form input[type="submit"]:hover, div#login form input[type="submit"]:active, div#login form input[type="submit"]:focus { color:#000000 !important; text-shadow:2px 2px 5px #CCCCCC !important; border-color:#000000 !important; }
div#login form#registerform { padding-bottom:16px !important; } div#login form#registerform p.submit { float:none !important; margin-top:-10px !important; } div#login form#registerform input[type="submit"] { float:none !important; width:100% !important; width:98% !important !ie<8; margin-right:2% !important !ie<8; box-sizing:border-box !important; -ms-box-sizing:border-box !important; -moz-box-sizing:border-box !important; -webkit-box-sizing:border-box !important; }
div#login form#lostpasswordform { padding-bottom:16px !important; } div#login form#lostpasswordform p.submit { float:none !important; } div#login form#lostpasswordform input[type="submit"] { float:none !important; width:100% !important; width:98% !important !ie<8; margin-right:2% !important !ie<8; box-sizing:border-box !important; -ms-box-sizing:border-box !important; -moz-box-sizing:border-box !important; -webkit-box-sizing:border-box !important; }
div.ws-plugin--s2member-password-strength { margin-top:3px !important; font-color:#000000 !important; background-color:#EEEEEE !important; padding:3px !important; -moz-border-radius:3px !important; -webkit-border-radius:3px !important; border-radius:3px !important; } div.ws-plugin--s2member-password-strength-short { background-color:#FFA0A0 !important; } div.ws-plugin--s2member-password-strength-bad { background-color:#FFB78C !important; } div.ws-plugin--s2member-password-strength-good { background-color:#FFEC8B !important; } div.ws-plugin--s2member-password-strength-strong { background-color:#C3FF88 !important; } div.ws-plugin--s2member-password-strength-mismatch { background-color:#D6C1AB !important; }
div#login form#registerform p#reg_passmail { font-style:italic !important; }
</style>

How can I achieve this?

Cheers

Hi Robert.

You can try editing the file s2member\includes\classes\login-customizations.inc.php to remove them. Copy the file to the /wp-content/mu-plugins/ folder and edit that, so it doesn’t get overwritten on update.

I hope that helps. :)