1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

How to move Log Out to where Log In is - more menu room

Discussion in 'Styling and Customization Questions' started by ibaker, Nov 16, 2011.

  1. ibaker

    ibaker Well-Known Member

    I was wanting more real estate on the navbar menu and thought that it was better for a user to be able to logout where they logged in. So I have located my logout button the same as the login and made it look the same and thought it might be useful to others if they need that extra little bit of space on their menu.

    To move the entire User Menu (Account Drop Down, Inbox and Alerts) up there as well please see HERE. This will give you the entire page width for the main menu if you have a lot of addons and require more menu real estate.

    img1.jpg

    Step 1 - Firstly add this css to the EXTRA.css template...it can go in there as it is a global requirement unlike other items in the EXTRA.css that only may be needed for certain areas and thus your other pages are loading css that is not required:
    Code:
    .user_menu
    {
        font-size: 11px;
        background-color: @primaryDarker;
        padding: 0 10px;
        margin-right: 10px;
        border-bottom-right-radius: 10px;
        border-bottom-left-radius: 10px;
        text-align: center;
        z-index: 1;
        line-height: 20px;
        box-shadow: 0px 2px 5px @primaryDarker;
        float:right;
    }
     
    .user_menu a
    {
        padding: 5px 8px;
        color: @primaryLightest;
        font-weight: bold;
    }
     
    .user_menu a:hover
    {
        cursor: pointer;
    }
    Step 2 - In your "header" template after the line:
    Code:
    <div id="header">
    Add this:
    Code:
    <xen:if is="{$visitor.user_id}">
        <span class="user_menu">
            <a href="{xen:link logout}" class="OverlayTrigger">{xen:phrase log_out}</a>
        </span>
    </xen:if>
    Step 3 - This part will remove the "Log Out" item on your menu bar. In your "navigation_visitor_tab" template just above the closing ul at the bottom of the template, remove the following line:
    Code:
    <li class="navTab PopupClosed"><a href="{xen:link logout}" class="navLink visitorTabItem OverlayTrigger">{xen:phrase log_out}</a></li>
    That's it...when you are logged in you now have a Log Out button exactly where the Log In button was for users

    Hope this helps others and I will post what I have done to move the entire Navigation Visitor Tab up there as well to give you even more real estate on your menu bar if you need it

    NOTE: I use to post a lot here having been with XF from day 1 before XF was released however what I posted was copied by a competing site. I went to vb, they went to vb, I went to XF, they went to XF, they even copied my unique phrases AND even their moderator uses my site name in the meta tags of his own site. So, I had to ask Kier to remove all my posts, sorry about that as I know some of the things I did on my site did help some others, but I will post again in the hope that these little things may help someone but on the condition that anything that I post is not allowed to be used by Glenn Inwood of Cowra NSW Australia or anyone associated with him.

    Isn't it unfortunate that you have to go to this extreme because of the degenerates out there
     
    erich37, Fuhrmann and Morgain like this.
  2. kkm323

    kkm323 Well-Known Member

    step#3 and if you want to logout you could using the
    Screen Shot 2011-11-16 at 9.22.39 PM.png

    I like your idea too ;)
     
  3. Morgain

    Morgain Well-Known Member

    Oh I wanted to do exactly this. Thank you.

    Why don't you start another user account here so the silly person doers not know your username.
    You can link a new account to your buyer account in the XF members area.
     
  4. Fuhrmann

    Fuhrmann Well-Known Member

    Great one. Thanks!
     
    erich37 likes this.

Share This Page