How to Make Font Bigger for all Titles on Home Page

  • Author
  • #1492644

    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


    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;

    Super. Now, how do I do it for the featured posts and the recent posts on the front page?


    And for all category archives, e.g.,



    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!


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

    .wf-active h1.showcase-heading {
        font-size: 9px;
        font-weight: 400;

    Thanks, sacredpath. Look great!


    You are welcome.


    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!


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


    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” “



    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;

    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?


    I would suggest this instead.

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

    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!


    You are welcome and it is looking very good!


    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?


    That would be here for changing color and text size.

    #site-description {
        color: #7A7A7A;
        font-size: 14px;

    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;



    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;

The topic ‘How to Make Font Bigger for all Titles on Home Page’ is closed to new replies.