XF 1.1 Moving top login/sign up to navbar

[Ingenious]

I'm trying to move the default top login/sign up option to the navbar below it (and remove the thin line that spans the top of the page that it sits under):



1. I can add a login option to the navbar using instructions from @Jake Bunce here: http://xenforo.com/community/threads/adding-a-login-link-to-the-nav-menu.22550/#post-282228 but the problem is it does not emulate the behaviour of the top link, ie. it does not shove the screen down on click. It just redirects to the full log in page. How do I get this to emulate the normal log in or sign up action when clicked?

2. Once done, how do I remove that top Log In or Sign Up button and the line across the top, what template do I edit and what do I delete or comment out? As I won't need it with it being in the nav bar.

(I need to remove it from the top to give me more space for a banner when I shrink my header height down).

Thanks!

 

[Amaury]

Use this to remove the border:

#moderatorBar {
    border-bottom: none !important;
}

 

[Ingenious]

That doesn't actually remove the blue bar across the top of the screen that login/signup sits under. I mean the dark blue line with the brighter blue 1px line underneath, it may well remove the border but not the rest of the line. I want to remove all of this along the top including the link:

 

[Amaury]

That doesn't actually remove the blue bar across the top of the screen that login/signup sits under. I mean the dark blue line with the brighter blue 1px line underneath, it may well remove the border but not the rest of the line. I want to remove all of this along the top including the link:

View attachment 68014

#loginBar {
    display: none !important;
}

 

[Ingenious]

#loginBar {
    display: none !important;
}

Nope, that removes it but also hides it when you click login (ie. the screen fades but no login form appears at the top). Thanks anyway.

But I have found a style property for it!



Changed this to 0.

Then in login_bar remove:

<h3 id="loginBarHandle">
                <label for="LoginControl"><a href="{xen:link login}" class="concealed noOutline">{xen:if $xenOptions.registrationSetup.enabled, {xen:phrase log_in_or_sign_up}, {xen:phrase log_in}}</a></label>
            </h3>

Which removes the button too.

Now the login button and line does not show, plus the login form still appears at the top when you click the main (side bar) "Sign Up or Log in" button.

HOWEVER I still can't get a manually added log in option in the navbar to emulate this and bring the in-line login form up at the top. It keeps redirecting to a new page for the log in. So can anyone help with query 1 in my OP? I'm guessing I need to add some label or tag for the JS to run, but what, and where too?

 

[Ingenious]

Sorted. I tried adding <label for="LoginControl" id="SignupButton"> tags around the login URL in Jake.s post but that turned it into a login button style, so just used <label for="LoginControl"> around the link text, that worked fine. Made the new navbar login link act like the original one and brings down the login form from the top now rather than divert to the standalone login page.