How to change ribbon color in Spectrum theme

• 

  rcobb0523 · Member · Jan 8, 2014 at 12:35 am

  • Copy link
  • Add topic to favorites

  I want to change the ribbon color in Spectrum theme. I only see 3 options to choose from and I don’t want any of those options (lime, teal or brown). I want a yellow ribbon. Thanks!

  The blog I need help with is pattilooloos.com.

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

• 

  thesacredpath · Member · Jan 8, 2014 at 1:04 am

  • Copy link

  Hi, the ribbon on the post and page titles is made up of 3 images. You will need to either edit those image and change the colors, or make new images and then upload those images to your media library and add the image URLs to the below CSS.

  Teal center image: http://s0.wp.com/wp-content/themes/pub/spectrum/colors/blue/main-title.png

  Left image: http://s0.wp.com/wp-content/themes/pub/spectrum/colors/blue/main-title-back.png

  Right image: http://s0.wp.com/wp-content/themes/pub/spectrum/colors/blue/main-title-edge.gif

  Main center CSS:

  .main-title {
      background: url("URL_OF_CENTER_IMAGE") no-repeat scroll 0 0 #0B516D;
      border-bottom: 1px solid #333333;
  }

  Left image CSS:

  .main-title .left-fold {
      background: url("URL_OF_LEFT_IMAGE") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
  }

  Right image CSS:

  .main-title .edge {
      background: url("URL_OF_RIGHT_IMAGE") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
  }