Re: Mobile Navigation Menu (Automatically Open First Sub-Menu)

Solved

Mobile Navigation Menu (Automatically Open First Sub-Menu)

Explore-Sherpa
Excursionist
37 0 12

I want to have it to where when someone open the navigation menu on the side of the mobile version of our website, that the "Shop Now" Section is automatically opened. Any custom CSS code would be greatly appreciated.

Website: https://www.exploresherpa.com/

I am using an Influence Theme

 

How I want it to open when someone first clicks on the side-bar menu:

IMG_3651.jpg

 

How It Currently Opens:

IMG_3650.jpg

Accepted Solution (1)

BSS-TekLabs
Shopify Partner
2401 695 830

This is an accepted solution.

- Here is the solution for you @Explore-Sherpa 
- Please follow these steps:

step.png

- Then find the theme.liquid or header.liquid file.
- Then add the following code at the end of the file and press 'Save' to save it.

 

<script>
document.getElementById("new-arrow").classList.add("sldm-open");
document.querySelector(".sldm-nav-container .sldm-submenu:first-child .sldm-default").style.display="block"
</script>

 

- Here is the result you will achieve:

BSSTekLabs_0-1719241993603.png

 

 

- Please press 'Like' and mark it as 'Solution' if you find it helpful. Thank you.

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


Salepify: Efficiently increase sales conversion with sale-driven features like auto add to cart, free gifts (free plan available)


Salemate: Boost your AVO with 2-layer offer, countdown upsell in your post purchase page


BSS Commerce - Full-service eCommerce Agency | Use Shopify for 1$ in the first month now

View solution in original post

Reply 1 (1)

BSS-TekLabs
Shopify Partner
2401 695 830

This is an accepted solution.

- Here is the solution for you @Explore-Sherpa 
- Please follow these steps:

step.png

- Then find the theme.liquid or header.liquid file.
- Then add the following code at the end of the file and press 'Save' to save it.

 

<script>
document.getElementById("new-arrow").classList.add("sldm-open");
document.querySelector(".sldm-nav-container .sldm-submenu:first-child .sldm-default").style.display="block"
</script>

 

- Here is the result you will achieve:

BSSTekLabs_0-1719241993603.png

 

 

- Please press 'Like' and mark it as 'Solution' if you find it helpful. Thank you.

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


Salepify: Efficiently increase sales conversion with sale-driven features like auto add to cart, free gifts (free plan available)


Salemate: Boost your AVO with 2-layer offer, countdown upsell in your post purchase page


BSS Commerce - Full-service eCommerce Agency | Use Shopify for 1$ in the first month now