How to add hover to show dropdown in navigation menu from Ira theme?

Store Design
1

Hi,

Could you please show me how do I change the code for the navigation menu so that the dropdown shows on hover instead of clicking.

Theme: Ira Paid theme.

2

@mharis

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community! :blush:
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

3

https://bodybrics-testing-3.myshopify.com/

4

@mharis

thanks for url can you please try this code

  1. Go to Online Store->Theme->Edit code
  2. Asset->/index.css ->paste the below code at the bottom of the file.
html:not(.no-js) .navigation__submenu {
background-color: var(--color-background-header);
top: 45px;
}
.header__links-list li:hover ul.navigation__submenu.fs-body-base {
    display: block;
}
5

Hi @mharis

Please add the following code in index.css file

1)Go to Online store> Theme >Edit code
2)Asset> index.css

.header__links-list li:hover .navigation__submenu {
    display: block;
}
6

Hey Ketan, would you know the fix for the Sense theme?

7

Hi, I actually found it. To anyone else with the same issue can review the link as it works for Sense as well. Solved: Dawn Theme - How to add the ability to hover over dropdown in navigation menu without clic… - Shopify Community