How can I hide the fixed vertical menu on the homepage until mouse hover?

Store Design
,
1

Hello,

As you can see in the video, the vertical menu is hidden on the product detail page and the menu opens when I hover the mouse over it.

I want to do the same on the homepage, but the menu on the homepage stays fixed and therefore prevents the product from appearing.

How can I fix this situation? In other words, I want the menu to be hidden on the homepage and to be opened when the mouse is hovered over it.

2

xy-20221115-160712.gif

1.Find theme-responsive.scss.liquid under Assets folder in your theme edit code.

2.Shortcut key ctrl+/ Comment the following part of the code.

.template-index #shopify-section-ss-vertical-menu .widget-verticalmenu .vertical-wrapper{opacity:1;-webkit-transform:translateY(0);-moz-transform:translateY(0);-o-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0);visibility:visible}
3

Hello @Luxell_Europe

I would like to give you some recommendations to support you

  1. Go to Online Store → Theme → Edit code
  2. Open your theme.liquid theme file
  3. Paste the below code before

If you require any further information, feel free to contact me.
Best regards,
GemPages Support Team

1 Like
4

solution.jpg
solution.jpg1069×573 59.4 KB

5

Thank you. I solved the problem with the advice given by @lfbokco

6

You’re welcome, I’m glad to be able to help you.

1 Like