How do I change the colour of my widgets?

• 

  aefountain · Member · Dec 6, 2011 at 12:08 am

  • Copy link
  • Add topic to favorites

  I truly have spent time trying to locate this answer and cannot seem to find it.

  Thank you for taking the time to view!

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

• 

  thesacredpath · Member · Dec 6, 2011 at 12:13 am

  • Copy link

  It would require the Custom Design Upgrade in order to change colors (font or background) in the widgets.

• 

  cyberstylez · Member · Dec 6, 2011 at 8:53 am

  • Copy link

  But once You have the upgrade how do You do it?

• 

  thesacredpath · Member · Dec 6, 2011 at 9:57 am

  • Copy link

  What do you want to change? I’ve put my crystal ball away for the evening.

• 

  cyberstylez · Member · Dec 7, 2011 at 9:20 am

  • Copy link

  I’m looking to change the font size and colour of the widgets.

  I’m using the Piano Black theme.

• 

  thesacredpath · Member · Dec 7, 2011 at 9:29 am

  • Copy link

  This is about all of it.

  .widget {
  color: #AAAAAA;
  font-size: 11px;
  }
  
  a, a:visited {
  color: #7F8E91;
  }
  
  a:hover, a:active {
  color: #81C8D5;
  }
  
  .widget-title {
  color: #999999;
  font-size: 11px;
  }

• 

  cyberstylez · Member · Dec 7, 2011 at 9:35 am

  • Copy link

  Is there a way to change the links in your blogrolls ect as well, or re those stuck as is?

• 

  cyberstylez · Member · Dec 7, 2011 at 9:36 am

  • Copy link

  Never mind….. i’m dense sometimes… DER.. i figured it out.

• 

  thesacredpath · Member · Dec 7, 2011 at 9:40 am

  • Copy link

  That’s what I gave you, but let’s make a little change to the center two bits of CSS to target ONLY the widgets.

  .widget a, .widget a:visited {
  color: #7F8E91;
  }
  
  .widget a:hover, .widget a:active {
  color: #81C8D5;
  }

• 

  cyberstylez · Member · Dec 7, 2011 at 9:43 am

  • Copy link

  Is there a way to centre it all in that side area?

• 

  thesacredpath · Member · Dec 7, 2011 at 9:59 am

  • Copy link

  Give this a try.

  .widget ul, .widget-title {
  text-align: center;
  }
  
  #flickr_badge_uber_wrapper, #flickr_badge_uber_wrapper table {
  margin-left: auto;
  margin-right: auto;
  }
  
  .textwidget iframe {
  padding-left: 50px;
  }

• 

  thesacredpath · Member · Dec 7, 2011 at 10:01 am

  • Copy link

  Oh, and add this too.

  #blog_subscription-3 p {
  text-align: center;
  }

• 

  cyberstylez · Member · Dec 7, 2011 at 10:22 am

  • Copy link

  You are my CSS Hero….

  i tried to use a theme code closer to what i want, and it nearly destroyed my entire blog… luckily i saved it in a notepad before i changed it.

• 

  thesacredpath · Member · Dec 7, 2011 at 10:34 am

  • Copy link

  You are welcome.

• 

  thesacredpath · Member · Dec 7, 2011 at 10:35 am

  • Copy link

  You’re welcome.

  You might work on the purple on the links in the sidebar. There isn’t enough contrast and people with even moderately impaired vision will have a hard time reading it. It needs to be lighter to increase the contrast.