changing widget background color on Twenty Thirteen

• 

  ladyjynx · Member · Sep 5, 2013 at 12:46 am

  • Copy link
  • Add topic to favorites

  Can I change the widget background color on Twenty Thirteen and if so could someone help?

  http://www.selenawolff.com

  Thank you!!!!

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

• 

  thesacredpath · Member · Sep 5, 2013 at 3:28 am

  • Copy link

  Hi, here is the existing CSS for the widget background color. It is done as RGB with an Alpha opacity setting. The first three numbers are the RGB values, and the last number, the 0.7, is the opacity. The closer to 1, the more opaque the color.

  .widget {
  background-color: rgba(247, 245, 231, 0.7);
  }

  If you wish to use a hex color using the following and then edit the color code as desired.

  .widget {
  background-color: #FFCCAA;
  }

• 

  ladyjynx · Member · Sep 6, 2013 at 12:16 am

  • Copy link

  Thank you, thesacredpath! I think I’m getting the hang of CSS. Now I’d like to change the widget header color. Last one, I promise. Can you help?

• 

  thesacredpath · Member · Sep 6, 2013 at 3:50 am

  • Copy link

  You are welcome, and not a problem with the questions. Your site is looking great. Love the header and colors. Nice and clean.

  Widget titles coming up :)

  .widget .widget-title {
      color: #55dd00;
  }

  (Excuse my obnoxious color, I use those so that things stand out when I’m making sure the code works.)

• 

  ladyjynx · Member · Sep 6, 2013 at 2:08 pm

  • Copy link

  This is awesome. I think I’m finally satisfied with the look. Thank you for all your help!!!

• 

  thesacredpath · Member · Sep 6, 2013 at 3:05 pm

  • Copy link

  You are very welcome, it looks great!