title size; sidebar width

• 

  caitlintherese · Member · Apr 15, 2014 at 10:41 pm

  • Copy link
  • Add topic to favorites

  1. I want to increase the size of the title font, and decrease the size of the “widget” headings in the sidebars.

  2. Is there any way to change the width of a sidebar? For instance, in the “About me” section in sidebar one, the text is within a narrow column, and I think it would be easier to read if the column were widened a bit.

  Any help would be greatly appreciated! Thanks!!

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

• 

  thesacredpath · Member · Apr 16, 2014 at 12:02 am

  • Copy link

  Hi there, to increase the font size on the site title, add the following CSS and adjust as desired.

  .wf-active .site-title {
  font-size: 38px;
  }

  For the widget titles, add the following and adjust.

  .wf-active h1 {
      font-size: 51px;
  }

  2. For the widget columns, you are going to have to adjust a couple of things. First adjust the width of the column (.widget-column) and the reduce the 5% left/right margin (.three.widget-column). You will have to work back and forth with those.

  .three.widget-column {
      margin: 0 5%;
  }
  .widget-column {
      width: 23%;
  }

• 

  caitlintherese · Member · Apr 16, 2014 at 12:26 am

  • Copy link

  Very helpful! Thanks so much!

• 

  caitlintherese · Member · Apr 16, 2014 at 12:56 am

  • Copy link

  I have another question if you or anyone can help once more!

  When I click on one of the “categories” in the home page (for example, “cocinar”), the word “Categories” shows up in the bubble over top of the word “cocinar” – is there a way to remove “Categories” altogether?

  Many thanks!

• 

  hfzrhmn · Member · Apr 16, 2014 at 1:15 am

  • Copy link

  Hi there,

  You can do that by adding this:

  .page-header h1 {
  	font-size: 0 !important;
  }
  .page-header h1 span {
  	font-size: 24px;
  	font-size: 2.4rem;
  }

• 

  thesacredpath · Member · Apr 16, 2014 at 1:20 am

  • Copy link

  Hi there, this little trick (applying a black color with full transparency) gets rid of the “Category”. The second rule moves the category name up a little to center in the orange circle. I’ve targeted only category page types.

  .category h1.page-title {
      color: rgba(0, 0, 0, 0);
  }
  .category h1.page-title span {
      margin-top: -7px;
  }

• 

  hfzrhmn · Member · Apr 16, 2014 at 1:21 am

  • Copy link

  My solution was a bit sloppy. Try his instead ^

• 

  caitlintherese · Member · Apr 16, 2014 at 1:25 am

  • Copy link

  Perfect!!! Worked like a charm.

  Thanks to you both for your input.

• 

  thesacredpath · Member · Apr 16, 2014 at 2:52 am

  • Copy link

  You are welcome, and @hfzrhmn, I should have refreshed. Yours is just as good a solution as mine. :)