Widget change individually

Home › Forums › Automattic › Funki › Widget change individually

Tagged: 

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • September 16, 2013 at 6:16 am #108416 Resolve

    Steve Holmes
    Member

    Hi,
    Is it possible to change each widget individually?
    ie.
    1. the colour of the background of the title box (ours are all black) ?
    2. the colour of the title (ours are all white) ?
    3. the font to italics ? (just maybe one or two that we want to highlight) ?
    If so, could you please send me the css codes.

    Thanks heaps,
    Claire
    cyclelike.com

    The blog I need help with is cyclelike.com
    September 16, 2013 at 5:28 pm #140278

    Kathryn P.
    Happiness Engineer

    Hi there, each widget has the class widget and each widget title has the class widget-title.

    1. the colour of the background of the title box (ours are all black) ?

    This would make the widget title backgrounds a charcoal grey:

    .widget-title {
    
background-color: #666666 !important;
    
}

    2. the colour of the title (ours are all white)?

    If you wanted to change all the widget titles to light blue, let’s say, you could use:

    .widget-title, .widget-title a {
    
color: #b2dfee !important;
    
}

    You can adjust the colours to whatever you like, of course. Adding .widget-title a accounts for the widget titles that are clickable links, like the one on the Facebook box.

    3. the font to italics ? (just maybe one or two that we want to highlight) ?

    To do that you’ll need to find the unique ID that applies to the individual widget. You can do that by using this guide to finding CSS selectors or by viewing the page’s source code in your browser.

    For example, the first widget has the unique ID text-3. To make the title for that widget italicized, you would add:

    #text-3 .widget-title {
    
font-style: italic;
    
}

    October 15, 2013 at 6:20 pm #141626

    Kathryn P.
    Happiness Engineer

    Hi there, did you need further help with the questions above, or were you able to get it sorted out? Thanks for letting me know.

    October 17, 2013 at 12:07 am #141776

    Steve Holmes
    Member

    Thanks Kathryn all done.

    Cheers,

    Claire

    October 17, 2013 at 1:48 pm #141798

    Kathryn P.
    Happiness Engineer

    Great, thanks for letting me know.

    I’m going to close this thread now but feel free to start a new one if you need anything else.

  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)

The topic ‘Widget change individually’ is closed to new replies.