How to make a collection preview and not a new page

Solved

How to make a collection preview and not a new page

PAUL8
Excursionist
75 0 24

Hello,
I want this preview when you hover "collection" and not a new page like I have now! There is a example of what I want:
I use dawn theme. My store is womber.fr and password is PROPAGANDAAA

PAUL8_0-1728991548324.png

 


Can you help me?
Thanks,
regards


Accepted Solutions (2)
EBOOST
Shopify Partner
1223 319 365

This is an accepted solution.

Hi @PAUL8 ,

 

May I suggest to update code these steps:

1. Get code here https://github.com/eboost10/2640367/blob/main/custom/megamenu.liquid

2. Go to Store Online-> theme -> edit code

EBOOST_1-1672356985580.png

3. Snippets/header-dropdown-menu.liquid

 

EBOOST_0-1729008184701.png

 

4. Replace code in this file with code that you get at step 1

- Hope can help. If you find my reply helpful, please hit Like and Mark as Solution
- Need a Shopify developer? Contact email: eboost10@gmail.com
- Visit our site: https://www.eboosttech.net to view and download shopify themes and magento2 extensions free
- ❤❤DONATE ❤❤Coffee tips

View solution in original post

EBOOST
Shopify Partner
1223 319 365

This is an accepted solution.

Hi,

- To remove underline you can go to Assets/base.css add code below to end of file

header .header__active-menu-item {
text-underline-offset: 0;
 text-decoration: none;
}

- To you can choose which collection I want to put in the preview ->Could you share code of Sections/header.liquid? I will help to add a settings in customize to you can do it. It only show 5 first collections  in list collections now. 

- Hope can help. If you find my reply helpful, please hit Like and Mark as Solution
- Need a Shopify developer? Contact email: eboost10@gmail.com
- Visit our site: https://www.eboosttech.net to view and download shopify themes and magento2 extensions free
- ❤❤DONATE ❤❤Coffee tips

View solution in original post

Replies 5 (5)

EBOOST
Shopify Partner
1223 319 365

Hi @PAUL8 ,

You mean you want to show it likes this theme https://themes.shopify.com/themes/impulse/styles/modern/preview?

- Hope can help. If you find my reply helpful, please hit Like and Mark as Solution
- Need a Shopify developer? Contact email: eboost10@gmail.com
- Visit our site: https://www.eboosttech.net to view and download shopify themes and magento2 extensions free
- ❤❤DONATE ❤❤Coffee tips
PAUL8
Excursionist
75 0 24

Like this website: https://nude-project.com

feature only for desktop 

EBOOST
Shopify Partner
1223 319 365

This is an accepted solution.

Hi @PAUL8 ,

 

May I suggest to update code these steps:

1. Get code here https://github.com/eboost10/2640367/blob/main/custom/megamenu.liquid

2. Go to Store Online-> theme -> edit code

EBOOST_1-1672356985580.png

3. Snippets/header-dropdown-menu.liquid

 

EBOOST_0-1729008184701.png

 

4. Replace code in this file with code that you get at step 1

- Hope can help. If you find my reply helpful, please hit Like and Mark as Solution
- Need a Shopify developer? Contact email: eboost10@gmail.com
- Visit our site: https://www.eboosttech.net to view and download shopify themes and magento2 extensions free
- ❤❤DONATE ❤❤Coffee tips
PAUL8
Excursionist
75 0 24

It's working, but how can I delete the line below "Acceuil" when I'm not hovering it
And how can I choose which collection I want to put in the preview ?
You can see what I'm saying here: https://jd2tsoprwmfaoukh-70360858889.shopifypreview.com

PAUL8_0-1729013112164.png

 

EBOOST
Shopify Partner
1223 319 365

This is an accepted solution.

Hi,

- To remove underline you can go to Assets/base.css add code below to end of file

header .header__active-menu-item {
text-underline-offset: 0;
 text-decoration: none;
}

- To you can choose which collection I want to put in the preview ->Could you share code of Sections/header.liquid? I will help to add a settings in customize to you can do it. It only show 5 first collections  in list collections now. 

- Hope can help. If you find my reply helpful, please hit Like and Mark as Solution
- Need a Shopify developer? Contact email: eboost10@gmail.com
- Visit our site: https://www.eboosttech.net to view and download shopify themes and magento2 extensions free
- ❤❤DONATE ❤❤Coffee tips