Registration page CSS

Would like to know if anyone has done modifications to the PRO forms CSS for registration, and if so how you went about it?
Thanks!

Yes, I’ve done that. I created a separate CSS file, called it s2member.css, put it in my active theme’s css folder, and then enqueued it from my active theme’s functions.php file with this code:

function kts_scripts_and_styles() {
	if ( is_page( array( 'register', 'subscribe' ) ) ) {
		# s2Member
		wp_enqueue_style( 's2member-css', get_stylesheet_directory_uri() . '/css/s2member.css' );
	}
}
add_action( 'wp_enqueue_scripts', 'kts_scripts_and_styles', 999 );
1 Like

Many thanks! Would you be willing to share the CSS file? If not, no problem!

Sure, I’ll share the part that relates specifically to s2Member. But it’s really quite simple:


#s2member-pro-paypal-checkout-form-description-section,
#s2member-pro-stripe-checkout-form-description-section {
	margin: 1em 0 !important;
	font-weight: bold;
}
#s2member-pro-paypal-checkout-form-submission-section-title,
#s2member-pro-stripe-checkout-form-submission-section-title,
#s2member-pro-paypal-registration-form-submission-section-title,
#s2member-pro-stripe-registration-form-submission-section-title {
	margin-top: 1em !important;
	font-weight: bold;
}
#s2member-pro-paypal-checkout-form-first-name-div,
#s2member-pro-paypal-checkout-form-last-name-div,
#s2member-pro-paypal-checkout-form-email-div,
#s2member-pro-paypal-checkout-form-username-div,
#s2member-pro-stripe-checkout-form-first-name-div,
#s2member-pro-stripe-checkout-form-last-name-div,
#s2member-pro-stripe-checkout-form-email-div,
#s2member-pro-stripe-checkout-form-username-div,
#s2member-pro-stripe-checkout-form-state-div,
#s2member-pro-stripe-checkout-form-zip-div,
#s2member-pro-stripe-checkout-form-country-div,
#s2member-pro-paypal-registration-form-first-name-div,
#s2member-pro-paypal-registration-form-last-name-div,
#s2member-pro-paypal-registration-form-email-div,
#s2member-pro-paypal-registration-form-username-div,
#s2member-pro-stripe-registration-form-first-name-div,
#s2member-pro-stripe-registration-form-last-name-div,
#s2member-pro-stripe-registration-form-email-div,
#s2member-pro-stripe-registration-form-username-div,
#s2member-pro-stripe-registration-form-state-div,
#s2member-pro-stripe-registration-form-zip-div,
#s2member-pro-stripe-registration-form-country-div {
	margin: 1em 0 !important;
}
#s2member-pro-paypal-checkout-form-registration-section-title,
#s2member-pro-paypal-checkout-form-custom-fields-section-title,
#s2member-pro-stripe-checkout-form-registration-section-title,
#s2member-pro-stripe-checkout-form-custom-fields-section-title,
#s2member-pro-stripe-checkout-form-options-section,
#s2member-pro-stripe-checkout-form-coupon-div,
#s2member-pro-stripe-checkout-form-billing-address-section-title {
	display: none;
}
#s2member-pro-paypal-checkout-form-custom-reg-field-terms---conditions-label,
#s2member-pro-stripe-checkout-form-custom-reg-field-terms---conditions-label {
	font-weight: bold;
}
#s2member-pro-paypal-checkout-form-password-strength,
#s2member-pro-stripe-checkout-form-password-strength,
#s2member-pro-paypal-registration-form-password-strength,
#s2member-pro-stripe-registration-form-password-strength {
	margin-bottom: 1em !important;
}
#s2member-pro-paypal-checkout-form-billing-method-section-title,
#s2member-pro-stripe-checkout-form-billing-method-section-title {
	margin-top: 1em;
}
#s2member-pro-stripe-checkout-submit {
	margin-bottom: 2em;
}
.s2member-pro-stripe-form-card-token-button i {
	display: none;
}
.s2member-pro-stripe-form-response-error,
.s2member-pro-paypal-form-response-error {
	color: red;
}
1 Like