WordPress.org

Forums

page title font size and color in twenty eleven (11 posts)

  1. APL70
    Member
    Posted 3 years ago #

    How do I change the size of the page title? And also the color? I'm a total novice at WordPress. I'd like to change the color to a light grey.
    amylincoln.com/wp

  2. JGWeston
    Member
    Posted 3 years ago #

    I'd like to know this too. I have been trying to find the css-file as well.....this just seems so foreign and difficult. I just want to make the font smaller!!

  3. jgailen
    Member
    Posted 3 years ago #

    I have been looking around for the answer to this question as well, and feel the same way! It seems like it should not be difficult to do this one thing.
    I just want to make the title smaller and not so bold, and it would be nice if it didn't have to be white. It would be better if it didn't have to be there at all, but still show up in the header...but that doesn't seem to be possible, except on the home page.

    (Would I have to do a child theme just to make this one change to the pages? I have just taken over a site that someone else started and am trying to make sense of it. If I do a child theme do I have to start over?)

  4. chrislakephoto
    Member
    Posted 3 years ago #

    Same here. Can't seem to figure this out in the style.css editor

  5. esmi
    Forum Moderator
    Posted 3 years ago #

    Do not edit the Twenty Eleven theme. It is the default WordPress 3.2 theme and having access to an unedited version of the theme is vital when dealing with a range of site issues.

    Create a child theme for your customisations. Once your child theme is active, we should be able to help with the customisation.

  6. rmdechazal
    Member
    Posted 3 years ago #

    Was hoping for the answer, too. I've created and activated my child theme and have diligently added code only to my child. I've looked around in the docs, forums, and searched elsewhere for it. No luck.

    I'm using Twenty Eleven, dark, and have come across the "!important" trick for changing colour values in my menu bar, etc. That works quite nicely.

    I've changed the colour of the page's body text to suit my site, but I would also like to change the page title colour, and the colour of the links (to other pages and websites) within the text. When I tried to change the colour in the "Link" section. Unfortunately that also changed my menu text colours and some of the colours in the admin bar above my site (when I was logged in).

    Stumped.

  7. Knightspirit
    Member
    Posted 3 years ago #

    rmdechazal - you said:

    "I'm using Twenty Eleven, dark, and have come across the "!important" trick for changing colour values in my menu bar, etc. That works quite nicely."

    Please share that trick! I am tryijng to figure out how mto change the black menu bar to white and the the corresponding link text. I set up a child css folder - but have no experience with that. I tried to just change the background color of the hover function:

    #access li:hover > a,
    #access ul ul :hover > a,
    #access a:focus {
    background: #efefef;
    }

    But I did not see a change in the parent theme.

    Is the color of the menu bar hidden in this portion of the css file?

    If so - can someone please identify where that is? Thanks

    /* =Menu
    -------------------------------------------------------------- */

    #access {
    background: #fdfdfd; /* Show a solid color for older browsers */
    background: -moz-linear-gradient(#252525, #0a0a0a);
    background: -o-linear-gradient(#252525, #0a0a0a);
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#252525), to(#0a0a0a)); /* older webkit syntax */
    background: -webkit-linear-gradient(#252525, #0a0a0a);
    -webkit-box-shadow: rgba(0, 0, 0, 0.4) 0px 1px 2px;
    -moz-box-shadow: rgba(0, 0, 0, 0.4) 0px 1px 2px;
    box-shadow: rgba(0, 0, 0, 0.4) 0px 1px 2px;
    clear: both;
    display: block;
    float: left;
    margin: 0 auto 6px;
    width: 100%;
    }
    #access ul {
    font-size: 13px;
    list-style: none;
    margin: 0 0 0 -0.8125em;
    padding-left: 0;
    }
    #access li {
    float: left;
    position: relative;
    }
    #access a {
    color: #eee;
    display: block;
    line-height: 3.333em;
    padding: 0 1.2125em;
    text-decoration: none;
    }
    #access ul ul {
    -moz-box-shadow: 0 3px 3px rgba(0,0,0,0.2);
    -webkit-box-shadow: 0 3px 3px rgba(0,0,0,0.2);
    box-shadow: 0 3px 3px rgba(0,0,0,0.2);
    display: none;
    float: left;
    margin: 0;
    position: absolute;
    top: 3.333em;
    left: 0;
    width: 188px;
    z-index: 99999;
    }
    #access ul ul ul {
    left: 100%;
    top: 0;
    }
    #access ul ul a {
    background: #f9f9f9;
    border-bottom: 1px dotted #ddd;
    color: #444;
    font-size: 13px;
    font-weight: normal;
    height: auto;
    line-height: 1.4em;
    padding: 10px 10px;
    width: 168px;
    }
    #access li:hover > a,
    #access ul ul :hover > a,
    #access a:focus {
    background: #efefef;
    }
    #access li:hover > a,
    #access a:focus {
    background: #f9f9f9; /* Show a solid color for older browsers */
    background: -moz-linear-gradient(#f9f9f9, #e5e5e5);
    background: -o-linear-gradient(#f9f9f9, #e5e5e5);
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#f9f9f9), to(#e5e5e5)); /* Older webkit syntax */
    background: -webkit-linear-gradient(#f9f9f9, #e5e5e5);
    color: #373737;
    }
    #access ul li:hover > ul {
    display: block;
    }
    #access .current-menu-item > a,
    #access .current-menu-ancestor > a,
    #access .current_page_item > a,
    #access .current_page_ancestor > a {
    font-weight: bold;
    }

  8. Knightspirit
    Member
    Posted 3 years ago #

    Hmmm - I am not getting the child theme changes to show up. I have the child folder in the themes folder along with the twentyeleven theme folder - which is as the tutorial shows it. I have the following code in the style.css sheet - as per the tutorial:

    /*
    Theme Name: twentyeleven_child
    Description: Child theme for the twentyeleven theme
    Author: Your name here
    Template: twentyeleven
    */

    @import url("../twentyeleven/style.css");

    I can make changes show up using the parent css sheet - so it isn't grabbing the child for some reason.

  9. joMoon
    Member
    Posted 3 years ago #

    Knightspirit...noticed you used " instead of ' that is why its not reading your child css.

  10. darcyspets
    Member
    Posted 3 years ago #

    Hello,
    I am a novice when it comes to building my own website. However, I am brave enough to give it a try.
    I would like to change the font and color on my site. I went to the plug in page, downloaded a plugin that does just that. However, when I go back into "edit page", I click on the font button bar and what appears is a box on the right side with the ever circling wheel, and a statement that I need to wait until my browser is ready. I am operating with the most recent version of IE, and have clicked on the compatibility button in my browser. However, each time I try within the past 2 days, I still receive the same message. Is there something I am missing, is there a better plug in? Eactutorialal I watch claims it is the easiest thing to do.
    I want to be able to change the font to Comic Sans for the body of my site as well as add some background color or a watermark to eliminate all the white background.
    I hope someone within this forum can assist me as I am quite frustrated at this point.
    thank you ahead of time for any assistance I receive.
    Thank you Darcy

  11. cubecolour
    ɹoʇɐɹǝpoɯ
    Posted 3 years ago #

    Darcy, please start a new topic rather than starting your question in an existing old topic. Also you may want to rethink whether comic sans OS a good font choice.

Topic Closed

This topic has been closed to new replies.

About this Topic