Need help? Check out our Support site, then

How to Make Font Bigger for all Titles on Home Page

  1. I am using the Twenty-Eleven theme. With this theme, the titles of the widgets (“Quick Links,” Contact”) in the showcase sidebar as well as the title of my featured post (“Featured Post”) and recent posts (“Recent Posts”) on the home page are super small by default. Is there any way using css to increase the font size for all of these titles? Check out my home page and you will see what I mean.


    The blog I need help with is

  2. Hi, it does indeed have small widget titles. :)

    Add the following CSS to yours and adjust as desired.

    .wf-active .widget-title {
        font-size: 9px;
  3. Super. Now, how do I do it for the featured posts and the recent posts on the front page?

  4. And for all category archives, e.g.,


  5. Scratch the category archives: I decided to hide that header and found the css for twenty-eleven to do so.

    But I would still like to increase the font size of the other two headers (featured posts and recent posts ) on the home page. Thanks!

  6. This will change both the recent and featured titles on the main page.

    .wf-active h1.showcase-heading {
        font-size: 9px;
        font-weight: 400;
  7. Thanks, sacredpath. Look great!

  8. You are welcome.

  9. I am amazed at how many tweaks and improvements one can make to WP's themes using css, and how much better one's posts can look with just a little bit of html coding. Although I don't have time to get into this on a regular basis, I see the attraction. I could easily spend hours and hours, days and days, tweaking and building websites and/or web products. Cheers!

  10. You are welcome, and yes, it can be a lot of fun. :)

  11. A couple of more spots that the miniature text pops up.

    (1) In the header of a category: "Featured" ( );
    and (2) if you click page two of the current blog post, in the header above replies, it reads "One thought on “US Press Not Reporting on Urgency of the Climate Change Problem” "


  12. Sneaky, aren't they with those tiny fonts. :)

    For category pages:

    .entry-header .entry-format {
    font-size: 9px;

    For the line above the comments:

    .wf-active #comments-title {
    font-size: 9px;
    font-weight: 400;
  13. Works like a charm. I decided that I don't need the line above comments and made it disappear by changing the font size to 0:

    .wf-active #comments-title { font-size: 0px; font-weight: 400; }

    I am sure that my solution is a work around. Is there a better way to do this, or am I fine?

  14. I would suggest this instead.

    .wf-active #comments-title {
    display: none;
  15. Got it.

    Lots of little improvements add up to one aesthetically appealing and streamlined site. I'm not quite there yet, but am getting closer. Tx!

  16. You are welcome and it is looking very good!

  17. One more: how about the subtitle "Advancing the Field of Environmental Ethics and Philosophy since 1990" that is above the header image on every page?

  18. That would be here for changing color and text size.

    #site-description {
        color: #7A7A7A;
        font-size: 14px;
  19. Got it. Also, how do I nudge up my site's name and tagline? I don't know the css handle for the name, though I am guessing that the css will look something like:

    #site- _____________ {
    color: #___________;
    font-size: __px;
    margin-top: __px;


  20. Yup, that will work. You will likely have to add !important to the font size since it is set with the Typekit fonts and the !important will override that setting.

    On moving the site title and description up or down, there is padding on the top of the site title, so I would use this and adjust the top padding (3.65625em) to position the two vertically.

    #site-title {
    padding: 3.65625em 0 0;
  21. Great, great, great. Now I have a banner with an aligned title and a tagline and that's not too big. Cheers!

  22. You are welcome, and your site is looking awesome!

  23. Here's another one: How to I close up the space in my footer, where my bottom widgets are?

  24. And also the WP footer that contains WP's text: "Customized Twenty Eleven Theme. | Blog at"

  25. I figured out how to narrow the space on my footers, where my bottom widgets are, using this css:

    .widget-area {
    margin-bottom: -35px;

    however, I still can't figure out how to tighten up the space at the very bottom that says "Customized Twenty Eleven Theme. | Blog at" Is it possible to do this? Thanks!

  26. Well, I'm learning a little bit: figured out how to tighten up the bottom space using:

    #site-generator {
    padding: .5em;


Topic Closed

This topic has been closed to new replies.

About this Topic