Jump to content

7.1 Hide "Account Login" from header navigation menu

Recommended Posts

Site URL: https://highvibebiz.com

Can someone provide the CSS to hide Account Login from the header navigation menu on squarespace 7.1?

I currently have this code on my site to remove the Login Link in the Header Navigation Menu. The first display code works, but the word "Account'", would still appear for one second.
The second line of code was added to remove the margin around the link.
The third line of code was added so that you couldn't see the word "Account" load.
Unfortunately, when you load the page, you can still see the navigation menu shift from left to right as each of these codes are happening consecutively after the other. 
 

/*customer account login */
.user-accounts-link.loaded .user-accounts-text-link {
   display: none !important;
}
.header-actions--right .customerAccountLoginDesktop {
margin: 0 !important;
}
body:not(.tweak-transparent-header) .user-accounts-text-link  {
    color: #ffffff !important;
}

Link to comment
  • 4 weeks later...
On 7/15/2020 at 4:45 AM, tuanphan said:

Add to Home > Design > Custom CSS


.user-accounts-link {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    color: white !important;
    font-size: 0 !important;
}

 

@tuanphan I was having the same problem where I have a custom icon for user account added to the menu options and the login text and the icon was appearing in the same space.  My intent is to remove the login text and just show the icon.  I used the snippet that you provided above, but I now have the issue where both the icon and the login have been removed from the menu page (see attached).  I would like the icon to appear between the contact menu text and the shopping bag icon.

Again my website is still private @ https://sunfish-alligator-jggp.squarespace.com/config/ pass $Square567.  Looking forward to your response.. 🙂

menu options remove login and add icon.jpg

Link to comment
13 hours ago, phowlett said:

@tuanphan I was having the same problem where I have a custom icon for user account added to the menu options and the login text and the icon was appearing in the same space.  My intent is to remove the login text and just show the icon.  I used the snippet that you provided above, but I now have the issue where both the icon and the login have been removed from the menu page (see attached).  I would like the icon to appear between the contact menu text and the shopping bag icon.

Again my website is still private @ https://sunfish-alligator-jggp.squarespace.com/config/ pass $Square567.  Looking forward to your response.. 🙂

Remove this code

.user-accounts-link {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    color: #fff !important;
    font-size: 0 !important;
}

Add this code

.user-accounts-link a {
    color: transparent !important;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
13 hours ago, kfalconer said:

this is so great @tuanphan !

Is there a way to have that user-accounts-link elsewhere while hiding it from the header? 

I'd love to have it as a button on a single page

Thank you so much!

Can you share site url? We can check easier.

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
  • 3 weeks later...
  • 2 weeks later...
On 9/16/2020 at 3:57 AM, kfalconer said:

thank you @tuanphan! I hid the log-in using the code you offered but deleted that code now. 

Thanks for any help!

Add to Home > design > Custom CSS

.header-actions .user-accounts-link {
    display: none;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
  • 1 month later...

@Minna

Sounds like customer accounts have been enabled. If you don't need 'em try turning them off.

Let us know how it goes.

Edited by creedon

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

Link to comment
  • 4 weeks later...

@Thedripfitnesshoboken

Please post the URL to your site.

If your site is not public please set up a site-wide password, if you've not already done so. Post the password here.

We can then take a look at your issue.

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

Link to comment
10 hours ago, Thedripfitnesshoboken said:

@tuanphan Hi! I used the code to take the login out of the navigation, but is there a code to have that accessible on just one page? Can I put the account/login access on a page instead fo the navigation so that way people can access their account while they are signed in?

Did you use above code? Remove code & add this code to Page Settings > Advanced > Header

<style>
  .header-actions .user-accounts-link {
    display: none;
}
</style>

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
  • 3 months later...
On 9/18/2020 at 1:14 PM, tuanphan said:

Add to Home > design > Custom CSS


.header-actions .user-accounts-link {
    display: none;
}

 

 

On 7/15/2020 at 4:45 AM, tuanphan said:

Add to Home > Design > Custom CSS


.user-accounts-link {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    color: white !important;
    font-size: 0 !important;
}

 

Thank you! This just appeared in my navigation bar all of a sudden and your answer resolved.

Link to comment
  • 1 month later...
On 4/27/2021 at 1:55 AM, kfalconer said:

@tuanphan thank you as always for your wisdom & help! I am also trying to have the log-in hidden on the header but available elsewhere on an individual page like @Thedripfitnesshoboken asked. 

my website is www.consciouscityguide.com and I am currently hiding the login on the header. thank you

Hi. Which code did you use? and do you use Personal, Business or Commerce Plan?

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
  • 1 year later...
12 minutes ago, MelCUdesigner said:

I have an online store that I want people to be able to sign in to, as it saves their order history and details, but I don't want this sign in link visible on the main navigation menu, only on the "Shop" page.

Please post the URL for a page on your site where we can see your issue.

If your site is not public please set up a site-wide password, if you've not already done so.

Post the password here.

Adding a site-wide password does not allow anyone to alter your site. It only allows those with the password to see your site. Please read the documentation at the link provided to understand how it works.

Please read the documentation at the link provided on how to share a link to your site to understand how it works. A link to the backend of the your site won’t work for us, i.e. a url that contains /config/.

We can then take a look at your issue.

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

Link to comment
  • 3 months later...

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.