Please help ~ member site login menu item appearing in wacky location

Hi, please view an example of my issue here: https://share.squarespace.com/qGuBdngP (I have currently deactivated this from appearing on my site.) 

Squarespace has informed me that this is happening due to other CSS I have added to my site. 

Can anyone help with providing CSS to make the Login show as a normal part of the site's menu instead of way to the side and cut off? Or, I'd be happy if it could show in the top right corner under the banner. Just not in the wonky place it is.

(Note that I also have a different login menu option which shows within my menu currently. It links to my current learning platform which I am planning to phase out once I have finished building a Squarespace member site instead.)

Thank you! 🙏🙏🙏

Hi @jallory you need to figure out which CSS is causing the problem first. You can trouble shoot by  removing all CSS from your Custom CSS (save it somewhere for backup), and add them back bit by bit, until you find the problematic CSS code.

Once you find that, fix it, then that might/should resolve your member site login menu item issue!

@melody495 Thanks for responding and trying to provide help. Your suggestion does not resolve my issue.

I want the Login/Account item to show in line as a part of the main navigation. Or, I want it to show directly under the announcement bar and off to the right.

Instead, it is showing in the middle of the header area, off to the right side. When I remove the code, yes, it stops being pushed off to the right so far that it is cut off, but it is still in an awkward random position because it is in the middle of the header while my menu is at the bottom of the header.

I am essentially looking for CSS which will display the Login/Account feature as a part of the main navigation.

I don't want to just add it as a link in the main navigation, because I do want it to do the automatic change from reading as "Login" to "Account" once someone has logged in. 

Can you share your site url? We can check problem easier

@tuanphan Thank you ~ it is https://www.wiseheartpdx.org/

On 2/15/2024 at 4:34 AM, jallory said:

@tuanphan Thank you ~ it is https://www.wiseheartpdx.org/

You mean change this menu item position? Which position?

Hi @tuanphan thank you for your attention.

No, I do not mean that item. (If you look at my first message, you will see an explanation of the login item your arrow indicates.)

The attached screenshot shows what happens when I choose to show the account login feature. This is the item which I am looking for help with.

Thanks again 🙏

@tuanphan the issue is the CSS I am using so that my main navigation shows in one long row:

@media(min-width: 768px){.header-layout-branding-center-nav-center .header-title-nav-wrapper  {width: 100% !important;  flex: 0 0 100% !important; }}

(See attached image for what happens when I remove this code.)

I would like to have all my navigation items showing in a single row AND I would like the login/account item to show either in that same row or at least somewhere else in the header where it is not cut off.

Thank you for any help you may provide 🙏

You can use this CSS to force all items on single row, but on smaller screen, you will need to reduce text size unless nav menu will overflow screen

nav.header-nav-list {
    flex-wrap: nowrap !important;
}

@tuanphan Thank you very much for your support. However, I do want the flex-wrap function. I see it overflowing the screen as you mentioned, and that is not really a workable fix imo. 

Are you able to instead suggest CSS to bring the Login/Account link more toward center?

Also, ultimately, I'd love to have it appear as a button-- see the attached example (created in a graphic design program)-- though I see there are other threads I could probably go to for figuring that part out. 

Hi again @tuanphan thank you very much for your help with my other question re hiding items in member nav. Just following up here, still having this issue and wanting to solve it ~ wondering if there's additional support you can provide. Thanks again 🙏

On 3/29/2024 at 6:03 AM, jallory said:

Hi again @tuanphan thank you very much for your help with my other question re hiding items in member nav. Just following up here, still having this issue and wanting to solve it ~ wondering if there's additional support you can provide. Thanks again 🙏

I see this only, do you still need help?

@tuanphan Thank you ~ yes I do still need help!

You are seeing that nav because you are still logged in to my member site, and I have the login/account item hidden due to its problematic location. You can instead use this page to sign out of my member site: https://www.wiseheartpdx.org/sign-out (click "Account Settings" on the account panel that opens).

Before clicking "Account Settings" you will also see that all of the pages you've helped me to hide from the nav are still shown under the "Pages" area. Can you help me to hide them from this panel also? 

Regardless of being signed out, however, you will still not see the login item I'm wanting help with because I currently have it disabled due to its problematic location.