Remove account button from header & add appointments menu

Store Design
1

Hello! My website is www.gemopticians.com

  1. Can you please help me to remove the ‘Account’ button from the header?

  2. Also I see whatever menu items I add to navigation get added to the left of the logo on the header. How do I add the items to the right of the logo where the ‘ACCOUNT’ button is currently?

  3. How do I change the font of the menu items. On the mobile version, I am able to change the font eg. the ‘SALE’ is in red on mobile but on desktop, since it is part of the header, there might be a differen

2

Hi ,
Step 1: Go to Shopify Admin → Online Store ->Theme → Edit code

Step 2: Search file base.css, theme.css, styles.css, custom.css or theme.scss.liquid

Step 3: Insert the below code at the bottom of the file → Save

li.HorizontalList__Item:has(a[href="/account"]) {
    display: none;
}

Here is result:

BSSCommerceB2B_1-1719039216674.png
BSSCommerceB2B_1-1719039216674.png612×269 9.27 KB

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you

3

Hello @Trivin

  1. To remove the Account button :-

Go to online store ---------> themes --------------> actions ------> edit code-------> theme.css
and add this code at the very end of your file.

ul.HorizontalList.HorizontalList--spacingLoose.hidden-pocket.hidden-lap li.HorizontalList__Item:nth-child(1) {
display: none;
}

  1. navigation get added to the left :-
    need the custom coding to move the menu items to the right side, i can help you in coding.

  2. change the font of the menu items:- ( you can choose font family according to your need.)
    Go to online store ---------> themes --------------> actions ------> edit code-------> theme.css
    and add this code at the very end of your file.

nav.Header__MainNav.hidden-pocket.hidden-lap li.HorizontalList__Item:last-child a {
    color: red;
	font-family: initial;
}

and the result will be

12.png
12.png1181×919 88.8 KB

If you find this helpful, please like and mark the job as completed.
Thanks

4

Hi @Trivin

This is Amelia at PageFly - Shopify Advanced Page Builder app.

You can try the following steps I have provided to help you solve the problem you are facing:

Step 1: Online Stores > Themes > Edit code

Step 2: Choose file base.css or theme.css

Step 3: Add code

.HorizontalList__Item:has(a[href="/account"]) {
    display: none !important;
}

Hoping my solution helps you solve your problem.

Best regards,

Amelia | PageFly