Tutorial: How to COMPLETELY change main site colour (Customizer isn't enough)

[plxs00]

This is a simple tutorial on how to completely get rid of the default main colour if you decide to use a different one

1- Change the main colour using Customizer – General – Styling – Primary colour

/* Also, a good idea would be to design a logo to match your new colour */

2- You may think you have completely changed the main colour, however, there are some pages which will mix between the old colour and the new one (see attachment)

THE PAGES ARE:
– Landing page (included courses section)
– Home page, the mobile app section (on e-learning II demo)
– Course Archive Pages

/* if you find any other pages on this demo or other demos, please comment it below :) */
______________________________________________________________________________________________
THE SOLUTION:
For the landing page and home page, On your WordPress Dashboard menu, click pages. Click Edit or edit with WP Bakery editor on the page you want to edit (landing or home). If you are editing on the front-end, click “Backend editor” on the top bar.

***For the landing page: you need to edit the ROW background colour, you should see a little circle with the default colour anywhere. Edit that row – go to design options – change background colour to your primary colour.

****For the home page: look for where the Play Store and App store images are, go to the element ABOVE them. Click edit row settings. ADVANCED settings – Overlay colour: choose your primary colour

Now for the course archive page. Go to Appearance — Widgets — Courses: Widget area top — Open Thim Layout Builder — Edit the first row — Design options — Choose your background colour

This should make all of your website have one unique primary colour :)

P.S. I tested using e-learning II demo, comment if you have solutions for other demos

Happy creating!

[Author]

Posts