• Hi there,

    I am trying to change the widget headers/titles. I would like them to be all the same font and would like them to be there same colour as well.

    I’ve been looking at other threads and this seems to be the coding that they’ve used but it hasn’t worked on my Simple Custom CSS plugin.

    }
    .widget-title {
    background: url(“images/border.png”) repeat-x 0 11px;
    font-size: 24px;
    line-height: 1.75em;
    margin: 0 0 1em 0;
    font-family: ‘Niconne’, serif;
    text-transform: uppercase;
    font-weight: normal;
    text-align: center;

    Can someone help explain to me how to move forward or going about making the font and color changes?

    I am also trying to figure out how to make the main bar’s text bigger?

    My website is whereeverthewindtakesher.com

Viewing 7 replies - 1 through 7 (of 7 total)
  • You’ve got a stray closing bracket on line 44 of your custom CSS plugin. If you remove that bracket, you should be good to go.

    Thread Starter joella9751

    (@joella9751)

    Thank you stephencottontail! It worked.

    The only trouble now is how do I keep the line breaks between all the widgets after changing the font. Its the little lines that go through the titles of the widgets.

    Remove this line from your custom CSS:

    background: url("images/border.png") repeat-x 0 11px;

    You’ve already got that line in your theme’s stylesheet, so it’s redundant.

    Thread Starter joella9751

    (@joella9751)

    stephencottontail your a rockstar!

    Now lastly, do you see how it says “follow me” and the me is in a different font and its in that mint colour? How do I change the font and colour for the word ‘me’?

    In theme options I have ‘the colour of the ribbon and various accents’ set to baby blue (and I have disabled the ribbons) and the ‘general colour scheme’ also set to baby blue.

    The color of the “me” can be set in Dashboard > Theme Options > Basic Settings > Accent Color, but if you don’t like any of those colors you could use some more custom CSS. Try replacing the code you’ve been using with this:

    .widget-title {
    	font-size: 17px;
    	font-family: 'Caviar Dreams', sans-serif;
    	text-transform: lowercase;
    }
    
    .widget-title em {
    	color: #404040 !important;
    	font-size: 17px;
    	font-family: 'Caviar Dreams', sans-serif;
    	padding: 0;
    }
    Thread Starter joella9751

    (@joella9751)

    Once again stephencottontail you rock. Fixed my problem.

    I’m going to keep asking questions related to font and colour since your so helpful!

    So now I would like to change the font and increase the size of the lettering in the navigation bar. Is there a code that I can put into my custom CSS editor to do so? The ‘Home’ button within the navigation bar still has that mint colour from the basic settings accent colour options that I would also like to change to be black.

    Is that possible or is that something that I can’t tamper with?

    Try this CSS:

    nav#main-nav > ul > li > a {
    	color: #ffc0fe !important;
    	font-size: 1.2em;
    	font-family: "Palatino", serif;
    }
    nav#main-nav > ul > li > a:hover {
    	color: #ffc0fe !important;
    }

    This will work for “web safe” fonts (fonts like Times, Arial, Helvetica, etc., that are installed on many computers by default). If you’re trying to use a more exotic font, it’s a bit more complicated.

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘How to change widget colour and font titles.’ is closed to new replies.