WordPress Issue: Centering Page Tabs in Top Menu

20 replies
  • WEB DESIGN
  • |
I may make someone mad because I am sure that this question must have been answered SOMEWHERE on WF already, but I can't find it.

My research on the WP Forum says that this question is not possible. I find that hard to believe.

"How can you center your page titles in the top menu of your website, rather than have them default to the left?"

I hope there is a widget or a plug-in or something simple. I am not a CSS expert, but I can give it a go!

Thanks Team! :confused:
#centering #issue #menu #page #tabs #top #wordpress
  • Profile picture of the author RobinInTexas
    You need to modify the css that is controlling the element.

    In the case of Twenty Eleven theme which I use on one site, WordPress presents this to the browser:

    <h1 id="site-title"><span><a href="http://mysite.com/" title="The Title" rel="home">The site</a></span></h1>

    The CSS that controls it in this case is

    media="all"
    #site-title {
    margin-right: 270px;
    padding: 3.65625em 0 0;
    }

    You could change that to
    #site-title {
    text-align:center
    }

    Or you could fiddle with the margins:

    margin-right: 270px;
    margin-left: 270px;


    and increase or decrease the 270's till you get what you like
    Signature

    Robin



    ...Even if you're on the right track, you'll get run over if you just set there.
    {{ DiscussionBoard.errors[8270276].message }}
    • Profile picture of the author OscarTheDog
      Originally Posted by RobinInTexas View Post

      You need to modify the css that is controlling the element.

      In the case of Twenty Eleven theme which I use on one site, WordPress presents this to the browser:

      <h1 id="site-title"><span><a href="http://mysite.com/" title="The Title" rel="home">The site</a></span></h1>

      The CSS that controls it in this case is

      media="all"
      #site-title {
      margin-right: 270px;
      padding: 3.65625em 0 0;
      }

      You could change that to
      #site-title {
      text-align:center
      }

      Or you could fiddle with the margins:

      margin-right: 270px;
      margin-left: 270px;


      and increase or decrease the 270's till you get what you like

      :p That's what I was afraid of. Your help went COMPLETELY over my head. LOL Although, I really do appreciate it. I am using the Atahualpa Theme, if that matters.

      I don't even know which sidebar to edit in the dashboard. Or do I need one of the many php files?

      Anyway, I appreciate you trying. This is my FIRST site to have created myself. I am ghost writing for someone, and there is a big section on WordPress. So, I am experimenting/researching.

      Cheers, Dude!
      Signature

      Freelance Writer For Hire.

      MattRowlandSEO.com

      {{ DiscussionBoard.errors[8270385].message }}
      • Profile picture of the author RobinInTexas
        Go here http://www.w3schools.com/css/default.asp and do some research. It's not that difficult it you take it in little chunks.
        Signature

        Robin



        ...Even if you're on the right track, you'll get run over if you just set there.
        {{ DiscussionBoard.errors[8270660].message }}
        • Profile picture of the author OscarTheDog
          Originally Posted by RobinInTexas View Post

          Go here CSS Tutorial and do some research. It's not that difficult it you take it in little chunks.

          Thanks Dude! I was looking on WordPress.org. I'll take a look at this today.
          Signature

          Freelance Writer For Hire.

          MattRowlandSEO.com

          {{ DiscussionBoard.errors[8271654].message }}
  • Profile picture of the author Istvan Horvath
    Just curious: why do you think it is better (or needed) to have that menu centered?

    In 99.99% of the cases the top menu in WP themes is made with a template tag listing the Pages and it also needs lots of CSS to make that list to not look like a list
    If it has a parent container, you may make the text-align centered for it... otherwise the deprecated <center> gizmo shouldn't be used.

    And, finally, in 110% of the cases when novice users want to "modify" the design but the code is over their head... they are absolutely wrong: it won't look better and there is no reason for what they want.
    Sorry, this is based on over 9 years of experience working with novice users :p
    Signature

    {{ DiscussionBoard.errors[8270837].message }}
    • Profile picture of the author OscarTheDog
      Originally Posted by Istvan Horvath View Post

      Just curious: why do you think it is better (or needed) to have that menu centered?

      In 99.99% of the cases the top menu in WP themes is made with a template tag listing the Pages and it also needs lots of CSS to make that list to not look like a list
      If it has a parent container, you may make the text-align centered for it... otherwise the deprecated <center> gizmo shouldn't be used.

      And, finally, in 110% of the cases when novice users want to "modify" the design but the code is over their head... they are absolutely wrong: it won't look better and there is no reason for what they want.
      Sorry, this is based on over 9 years of experience working with novice users :p

      Well, I may be a novice to WordPress, but I am not a novice to the Internet. I do know what I like and why I want it.

      Centering the page tabs is more aesthetically pleasing when you only require a few pages on a site. It just looks plain "wrong" otherwise, but the main point of the question is that "WordPress" makes claims that it is the most user friendly site builder online for novices.

      Just trying to find out "how user-friendly" it really is for this ghost writing project. Thanks for your help, kind Sirs...
      Signature

      Freelance Writer For Hire.

      MattRowlandSEO.com

      {{ DiscussionBoard.errors[8271647].message }}
      • Profile picture of the author Istvan Horvath
        Originally Posted by OscarTheDog View Post

        but the main point of the question is that "WordPress" makes claims that it is the most user friendly site builder online for novices.
        And where exactly says WordPress it was the most user friendly for people who want to modify CSS/XHTML but don't know code?

        They claim it has 5-minutes install - true;
        they claim you can start blogging away right after the installation - true;
        they claim you can change the "design" (the theme) with a click - true;

        And because these steps are so easy, people expect that everything else (messing with CSS code, for example) should be as easy as well :rolleyes:

        In one of my WP books I called this the "5-minutes trap"... most users fell in it. :p
        Signature

        {{ DiscussionBoard.errors[8272661].message }}
        • Profile picture of the author OscarTheDog
          Originally Posted by Istvan Horvath View Post

          And where exactly says WordPress it was the most user friendly for people who want to modify CSS/XHTML but don't know code?

          They claim it has 5-minutes install - true;
          they claim you can start blogging away right after the installation - true;
          they claim you can change the "design" (the theme) with a click - true;

          And because these steps are so easy, people expect that everything else (messing with CSS code, for example) should be as easy as well :rolleyes:

          In one of my WP books I called this the "5-minutes trap"... most users fell in it. :p

          It's just an old marketing tactic that marketers has been using for decades. By inferring that....

          "They claim it has 5-minutes install - true;
          they claim you can start blogging away right after the installation - true;
          they claim you can change the "design" (the theme) with a click - true;"
          [/I]

          ...the novice is led to believe that the entirety of the WordPress Package is "easy as pie" to use.

          In actuality, I am finding it to be quite easy, as they have claimed. The amount of online resources is remarkable. This is the only item that I have come across so far that is not easily available on the WP help site. I am pretty impressed.
          Signature

          Freelance Writer For Hire.

          MattRowlandSEO.com

          {{ DiscussionBoard.errors[8272776].message }}
  • Profile picture of the author yestyle
    Banned
    Show me your site and what do you want to fix ?
    I will help you quickly
    {{ DiscussionBoard.errors[8271674].message }}
  • Profile picture of the author OscarTheDog
    Thanks Ms. I just PM'ed you. No worries if you can't help me. I don't really expect WordPress to be "simple" for all knuckleheads like me.

    Signature

    Freelance Writer For Hire.

    MattRowlandSEO.com

    {{ DiscussionBoard.errors[8271701].message }}
    • Profile picture of the author RobinInTexas
      I haven't looked at the Atahualpa Theme in quite some time, but back then it had endless options that made it easy to change anything covered by the options, and very difficult to change anything that didn't have a dashboard setting. You might take a look at a less complex theme if this one doesn't have the options you want.
      Signature

      Robin



      ...Even if you're on the right track, you'll get run over if you just set there.
      {{ DiscussionBoard.errors[8271738].message }}
      • Profile picture of the author OscarTheDog
        Originally Posted by RobinInTexas View Post

        I haven't looked at the Atahualpa Theme in quite some time, but back then it had endless options that made it easy to change anything covered by the options, and very difficult to change anything that didn't have a dashboard setting. You might take a look at a less complex theme if this one doesn't have the options you want.

        Well, that at least makes me FEEL better, knowing that the dashboard actually does not have the options that I want. I have been trying everything, looking everywhere! Thanks for the tip! :p
        Signature

        Freelance Writer For Hire.

        MattRowlandSEO.com

        {{ DiscussionBoard.errors[8271761].message }}
    • Profile picture of the author yestyle
      Banned
      Originally Posted by OscarTheDog View Post

      Thanks Ms. I just PM'ed you. No worries if you can't help me. I don't really expect WordPress to be "simple" for all knuckleheads like me.

      Hello, I sent you a PM with detail about code that you should add to center your Tabs in top menu. It's simple, I checked on my computer and it's good as your requirement.

      Regards,
      {{ DiscussionBoard.errors[8273740].message }}
      • Profile picture of the author rhinocl
        Things are a little different in Atahualpa.
        If you are using the theme menus:
        Under dadhboard|Atahualpa Options|Style and configure header area

        enter %page-center
        or %cat-center


        depending on whether you want a page menu or a category one
        (remove %pages or %cats)
        If you are using a custom menu then you have to use the info given earlier
        Usually a centered menu is harder to maintain and keep looking with way you want it as you add pages, unless you have a firm grasp of css.
        You can get help with using theme at forum.bytesforall.com
        But read through all the text in the theme options first. You can get an initial grasp of it in 4 hours.
        {{ DiscussionBoard.errors[8275637].message }}
        • Profile picture of the author OscarTheDog
          Originally Posted by rhinocl View Post

          Things are a little different in Atahualpa.
          If you are using the theme menus:
          Under dadhboard|Atahualpa Options|Style and configure header area

          enter %page-center
          or %cat-center


          depending on whether you want a page menu or a category one
          (remove %pages or %cats)
          If you are using a custom menu then you have to use the info given earlier
          Usually a centered menu is harder to maintain and keep looking with way you want it as you add pages, unless you have a firm grasp of css.
          You can get help with using theme at forum.bytesforall.com
          But read through all the text in the theme options first. You can get an initial grasp of it in 4 hours.

          HOLEY CRAP! THAT WAS SOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOO OOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOO OOO EASY! LOL

          Thanks man!
          Signature

          Freelance Writer For Hire.

          MattRowlandSEO.com

          {{ DiscussionBoard.errors[8276023].message }}
      • Profile picture of the author OscarTheDog
        Thanks so much for the IM! I appreciate your help!
        Signature

        Freelance Writer For Hire.

        MattRowlandSEO.com

        {{ DiscussionBoard.errors[8276021].message }}
  • Profile picture of the author Internetoholic
    If you could send link to your website that would be good.

    Probably you will need to use #ultabs {margin: 0 auto;}

    Tom
    Signature

    Find me here

    {{ DiscussionBoard.errors[8271735].message }}
    • Profile picture of the author OscarTheDog
      Originally Posted by Internetoholic View Post

      If you could send link to your website that would be good.

      Probably you will need to use #ultabs {margin: 0 auto;}

      Tom
      Thanks Dude. I PM'ed you. No rush. It's just a test project that I am working on. I really do appreciate your taking the time to look it over.

      Matt
      Signature

      Freelance Writer For Hire.

      MattRowlandSEO.com

      {{ DiscussionBoard.errors[8271755].message }}
  • Profile picture of the author Istvan Horvath
    This is the only item that I have come across so far that is not easily available on the WP help site
    Because it is a theme specific issue, not a general WP thing!

    It has (almost) nothing to do with WP: it is about the CSS in the theme you are using. Even on a plain HTML template (if a list is used as a horizontal block to form a menu) you would still need to edit/modify the CSS file to have it as you like it.

    ^^ This is what you are struggling with - nothing WP-specific, except finding where in the CSS file was the menu display/layout defined.
    Signature

    {{ DiscussionBoard.errors[8272875].message }}
    • Profile picture of the author OscarTheDog
      Originally Posted by Istvan Horvath View Post

      Because it is a theme specific issue, not a general WP thing!

      It has (almost) nothing to do with WP: it is about the CSS in the theme you are using. Even on a plain HTML template (if a list is used as a horizontal block to form a menu) you would still need to edit/modify the CSS file to have it as you like it.

      ^^ This is what you are struggling with - nothing WP-specific, except finding where in the CSS file was the menu display/layout defined.
      Thanks. I can wrap my feeble mind around that differentiation. I'll have to make note of that in the material that I am ghost writing. That is a valuable piece of information to include.
      Signature

      Freelance Writer For Hire.

      MattRowlandSEO.com

      {{ DiscussionBoard.errors[8272940].message }}

Trending Topics