Remove navigation menu and home directory menu

Spreadshop HTML and web design
#1

SS%20help
SS help.jpg806×132 18 KB

See attached image.

  1. How do I remove product list page on desktop and on mobile? In Page Settings>Product List Page, there is a disable for product list page but this does not remove it from mobile display. What is the coding to remove it?

  2. How do I remove the home directory from the Product Detail page? For example, when I click on one of my shirt products, there is a directory listed above the product, i.e. HOME>Product Name. What is the code to use to make sure the home directory does not display?

partner@spreadshirt directed me here for coding help.

#2

Why do you not want this to be displayed? This is industry standard and will only help your customers to finalize a purchase. Otherwise you can use CSS to hide these elements. Have you ever used CSS or do you need some more explanations?

#3

Hi Lena,

I have very little experience with CSS coding. I was also referred here for the help that I need.

In regards to your question, I have external links to different screens of my SS on my own website. When a customer clicks on one of those links, they are taking to my SS but no longer have my custom navigation at the top of my website. I want the customer to click on an image from my website that will lead them to the product detail screen and then back to my website if needed. If the customer clicks on the navigation menu or the home>product name directory, it does not lead them back to my website. I tried doing the embed html process but that method is not good for setting up external links, i.e. mens t-shirts, women t-shirts, on my website. You can direct a customer to a particular screen on a SS embedded html.

So I would like to test out my suggestion by removing both navigation sections to see how well my site perform then.

I hope all of this makes sense.

#4

please add the following in your CSS under Advanced Settings > HTML & CSS >
Edit Shop CSS (at the bottom left of the page) and click on save after you’ve added the info below

hides navigation and breadcrumb home link

.SprdMain .sprd-navigation,
.SprdMain .sprd-breadcrumb {
display: none;
}

hides burger menu but keeps title/logo centered

.sprd-header__burgerbutton {
visibility: hidden;
}

disables clicking on title/logo to go to index page

.sprd-header__title,
.sprd-header__image {
pointer-events: none;
}

#5

Lena, you’re awesome. For the “hides navigation and breadcrumb home link”, that worked for desktop and tablet display, but when viewing on mobile display, the navigation is still there.

What does the “hides burger menu” get rid of because I didn’t see a change?

The coding for “disables clicking on the title/logo to go to index page” doesn’t seem to work but I’ll keep trying.

All codes, I simply copy/pasted…

#6

@Fashion_By_Wes can you please post the link to your shop/website so our developers can have a look. It makes it easier to troubleshoot :slight_smile:
And happy to help of course!

#7

Hi.

  1. Hides navigation and breadcrumb home link works, thanks
  2. disables clicking on title/logo to go to index page now works, thanks.
  3. I tried the “hides burger menu” code but not sure if it changed something or not when I used it. I have removed it from Edit Shop CSS.

Can you tell what that coding is supposed to do to the shop when used?

#8

Sorry Lena, spoke to soon, forgot my initial issue.

The "hides navigation and breadcrumb home link works on desktop mode, but not tablet and mobile. You can still see the navigation in the upper left corner.

Attached is an image showing the CSS coding being used properly.

Also attached is the screen shot of desktop, tablet, and phone.

My SS: https://shop.spreadshirt.com/fashionbywesSS%20CSS%20coding%20screenshot

desktop%20display
desktop display.jpg1790×264 25.5 KB
phone%20display
tablet%20display
tablet display.jpg758×190 13.9 KB

#9

We added

.sprd-header__burgerbutton {
visibility: hidden;
}

for you.

It should now work on mobile as well!

#10

Lena, thanks so much. You just made my day!

#11

I just passed along the messages :wink:
Happy that we could help you!

#12