Changing colour of the site title

  • Unknown's avatar
    justjonahsite · Member ·

    I’m using a theme, which automatically makes the site title grey. How do I change the site title so that it is white, while leaving the colour of the background and everything else the same?

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar
    mariahpierson · Member ·

    Hi there,

    If you go to My Sites>Customize>Colors & Backgrounds, you should be able to make some changes to the color. It is limited on what you’re able to change, though.

    With a paid upgrade with Premium or Business, you have more options:
    https://en.support.wordpress.com/custom-css/
    https://en.support.wordpress.com/custom-design/

    Hope that helps.

  • Unknown's avatar
    gifconference · Member ·

    Hi jonah, I actually had this problem and after a LOT of searching managed to work it out. By the way I use Chrome so these instructions are specifically for that browser (I assume it’s pretty much the same for the other browsers, though)

    1] First off you want to install the CSS plugin for WordPress: https://wordpress.org/plugins/advanced-css-editor/

    put that in a folder on your desktop, right-click the file and click ‘extract here’

    2] Next, go to the ‘Customize’ section of Themes

    3] On the left-hand side of your screen should be the list of options (Site Identity, Colors and Backgrounds, etc.). Look down and click on CSS

    4] This opens up a little tab on the left with numbers down the side and info on a help website. You can delete that info.

    5] Right-click on the Title words that you need to change. In the right-click menu should be the option ‘Inspect’ or ‘Inspect Element.’ Click it.

    6] Now then. This will open up some crazy-looking boxes. Which is fine. On the right should be three boxes; one above and two below. In the bottom-left box should be a series of tabs labelled ‘Styles’, ‘Event Listeners’, ‘DOM Breakpoints’ and ‘Properties’. Make sure that ‘Styles’ is clicked

    7] you are now looking for the following lines of code:

    .site-title a, .site-title a:visited, .site-description {
    color: #000000;
    }

    8] Select and copy that. Then paste it into the box on the left-hand side of your screen (The CSS box we opened earlier).

    9] You now want to change ‘#000000’ to ‘#FFFFFF’, leaving the code on the left looking like this:

    .site-title a, .site-title a:visited, .site-description {
    color: #FFFFFF;
    }

    10] Click ‘Save and Publish’. Hopefully your site title should now be readable against your background

    11] By the way, if you want any other colour at all then go here: http://htmlcolorcodes.com/
    Use the colour picker, find the the HEX # code at the top and then copy/paste it as we did earlier

    Hope that helped

  • The topic ‘Changing colour of the site title’ is closed to new replies.