The Restrict Content Pro plugin lets you easily control access to content on your site. As part of this, it allows you to add registration and login forms which let users signup and access the content. Here are a few tips on how to style these components.
Styling the Restrict Content Pro Login / Registration Form Input Fields
Here is an example of CSS for applying some basic styles to the text / password fields of Restrict Content Pro forms:
/* Restrict Content Pro - text and password form fields */
#rcp_login_form input[type=text],
#rcp_login_form input[type=password],
#rcp_registration_form input[type=text],
#rcp_registration_form input[type=password] {
color: white;
background-color: #000;
width: 100%;
padding: 12px;
border-radius: 6px;
font-family: tahoma;
}
/* Restrict Content Pro - text and password form fields (focused) */
#rcp_login_form input[type=text]:focus,
#rcp_login_form input[type=password]:focus,
#rcp_registration_form input[type=text]:focus,
#rcp_registration_form input[type=password] {
background-color: #333;
}Related Post: Adding CSS to the Divi Theme
The first block applies to the normal state of the fields. The second block is (additionally) applied to an input field when it has focus (i.e. the user is currently editing it).
Hiding the Membership Details Box on the Restrict Content Pro Registration Form
Restrict Content Pro includes a "Membership Details" box on registration forms, with details of the membership cost and renewal date. If you wish to hide this box, you can do so with the following CSS:
#rcp_registration_form .rcp_registration_total {
display: none;
}Related Post: Adding CSS to the Divi Theme
Hi, thank you for this…what about displaying the price of the respective level the user is signing up for with dynamic consideration according to the discount code they may use ?
Hey Chris, I've had a bit of a look and can't see any obvious way to achieve this with existing shortcodes, etc. I suspect it may require custom PHP code to achieve, but I'm not familiar enough with Restrict Content Pro at the moment to say for certain. I've logged it for further investigation and will reach out with an update if I'm able to figure out how to do it. Thanks!
Hello,
I used your Divi Booster tool and it was great.
And recently I have posted a comment about changing the styling of the Content Pro Login plugin. Did you see it?
Thanks
Hi sydi, I'm glad you found Divi Booster useful :) I've just replied to your other comment / updated the post with the CSS to hide the "Membership Details" box. Hope that helps!
Hi mr dan,
is it possible to give me the css code for hide the field "MEMBERSHIP DETAILS" that is in the registry page?
https://3dmaxfarsi.com/wp-content/uploads/2023/05/rcp-register.jpg
Hi sydi, I've just added a section to the post with the CSS to hide the Membership Details box. I hope it helps, but let me know if not. Thanks!
Thank you that css is perfect. I have Divi Booster and that's great too!
Great to hear they're both helping you, Dominic. Thanks!
Thanks Dan! You've just saved me from wasting hours trying to solve this CSS puzzle :)
You’re welcome, Sheila! Glad it helped :)
Where should i paste this code ?
Hi Hamid, you can paste it into the "Divi > Theme Options > General > Custom CSS" box (after anything else in there), or into the style.css of your child theme, if you're using one. I've added a link above to my post on adding CSS to Divi. Hope that helps!