How to extend title length for centric theme and stop title going on 2 lines

Community Forums Forums Design Tips and Tricks How to extend title length for centric theme and stop title going on 2 lines

This topic is: not resolved

This topic contains 9 replies, has 3 voices, and was last updated by  adamjayc 6 months ago.

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #96065

    adamjayc
    Member
    Post count: 10

    Hi there,

    I’m trying to add the title to my new site using the Centric theme.

    The title is: “WP Superstars”.

    Due to the length this is forcing it onto 2 rows which then extends the area at the top and causes issues with page titles.

    How can I stop this going on to 2 rows?

    Thanks,
    Adam

    #96066

    adamjayc
    Member
    Post count: 10

    Note: when I remove the custom menu from the header widget, the title goes on to a single line.

    #96119

    emasai
    Participant
    Post count: 669

    As I just learned it is likely to be a balancing act between the width of the header and the width of the custom menu to keep everything on the same line.


    Need Website Customization or a Responsive CSS fix? Contact Me
    Lynne emasai.com

    #96120

    emasai
    Participant
    Post count: 669

    Here is the reply which explains it
    http://www.studiopress.com/forums/topic/centric-pro-create-top-navigation/


    Need Website Customization or a Responsive CSS fix? Contact Me
    Lynne emasai.com

    #96149

    adamjayc
    Member
    Post count: 10

    Thanks Lynne but the custom menu consisted of just:

    “Blog” and “Newsletter”

    I did take a look at the post you linked to but it talks more about using the primary navigation and there didn’t seem to be a resolution for the affect that has on the header.

    Thanks,
    Adam

    #96154

    emasai
    Participant
    Post count: 669

    Extend the width of the title area, but not so far that it pushes the custom menu down a line.


    Need Website Customization or a Responsive CSS fix? Contact Me
    Lynne emasai.com

    #96161

    adamjayc
    Member
    Post count: 10

    Thanks Lynne – how would I be able to do that?

    #96184

    emasai
    Participant
    Post count: 669

    Without a link to your site I can’t really tell you.


    Need Website Customization or a Responsive CSS fix? Contact Me
    Lynne emasai.com

    #96207

    braddalton
    Participant
    Post count: 9802

    Simply open your child themes style.css file using a code editor like Notepad++ and scroll down to the Header section where you’ll fine the code for the site-title and header right widget area.

    When you increase the width of one, you must decrease the width of the other so the total width is the same.

    You could, also reduce the font size the the site title.

    Here’s an example of what the code looks like for the title area and site title which you can modify

    [css]
    /* Title Area
    ——————————————— */

    .title-area {
    font-weight: 700;
    float: left;
    overflow: hidden;
    width: 320px;
    }

    .site-title {
    font-size: 36px;
    font-size: 3.6rem;
    line-height: 1.25;
    margin: 0 0 5px;
    margin: 0 0 0.5rem;
    }
    [/css]


    #96248

    adamjayc
    Member
    Post count: 10

    That was just the ticket, thanks Brad.

    Also thanks Lynne for your support too.

Viewing 10 posts - 1 through 10 (of 10 total)

You must be logged in to reply to this topic.