There are many plugins out there to customise your website, but you can edit a lot of things by using CSS code. So, let’s see some examples on what you can do and used to improve your website, without installing half a dozen plugins.
Why are these codes used?
Can't I just download that cool plugin what can do it?
Well, no one is stopping you, go right ahead, but plugins can weigh your site down with unnecessary bloat, and you’re not learning. Using a plugin for one small change is not worth the performance drop, so instead just use CSS codes.
Also, the feature you want may not have been made into a plugin, so you have no choice to learn CSS to accomplish these for your unique website design. You could learn how to make a plugin for your needs and share it with others either a free or paid plugin.
Hide Header
header{
display:none;}
Hide Add to Cart Button in Woocommerce
.single_add_to_cart_button.button{
display:none;}
Hide Breadcrubs
.woocommerce-breadcrub{
display:none;}
Remove navigation buttons
.single .post-navigation { display: none;}
Remove Powered by WordPress
.site-info { display: none;}
Remove reCAPTCHA Logo (Bottom Right)
.grecaptcha-badge{display:none;}
Remove Back to the top button / arrow
#toTop {
display: none !important;}
A few ways to add CSS to your website.
I’ve provided you with some examples you can use CSS for, but you will need to know how to apply them to your website.
1. Theme Customiser
Go to Appearance > Customize > Additional CSS to open the style editor. Then paste your CSS scripts here.
2. Child Theme CSS file
This can only be done if you have a child theme. Although, it won’t stop you putting it into your main theme style.css file, but when it updates by the developer, it probably will over-right that file, losing your customisation.
Go to Appearance > Theme Files Editor. Now, open the Stylesheet or the style.css file of the child theme.
