Just figured a perfect use -case for adding media to the menu items. The guide covers adding a metafield on using collection links in menu. However, if I use a specific URL (search URL) and add it on my menu then how am I able to give that menu entry a specific icon/gif? Hope you come up with a guide on this soon! Doing this breaks the code and the sub-menu items won't show anymore!
Hi! Currently the code is designed for use with objects that have metafields (ex: products, collections, pages, blogs, etc). If you want to use a direct URL, then unfortunately the code needs to be adjusted a bit. I've added this to the list of suggestions. Thanks!
Brother, along with collections and pages i also have direct links in my Header Menu. I need to figure out how to also add images above these 'Links' in my header menu because its currently showing a Grey Image.
Since it was designed to work with metafields (which your direct links likely don't have), unfortunately you would need a bit of additional code customization to handle those situations.
It's a great tutorial and you have posted two more videos on the menu. However, my request is if you can create a menu similar to Fashion Nova. You have added photos, but I would like the rest of the collection to be the same as the default menu, with the addition of one image. Thank you.
Will look into doing that when the channel grows enough to unlock that feature. Until then, the best way to support us is by using our tutorials, sharing our videos with anyone you think would benefit, and liking + subscribing! Thanks :)
is the code only available for the dawn theme? I want to add it to Gain theme of Shopify, please guide me from where can i copy the code please. thanks
This was designed for the free Shopify themes, like Dawn, Refresh, Sense, etc. For premium/third-party themes like Gain, it might not behave as expected and might require some additional development to adapt it to work. But you can always give it a try and let us know how it goes!
The code was designed for the free Shopify themes like Dawn, Refresh, Sense, etc. Archetype are third party/premium themes that have been designed differently, so you're unlikely going to be able to simply copy & paste the code. You can still use it as a reference, but may need some development work to adapt it to your theme.
Could you do a video on manually updating your theme which had (external) custom coding done on it? Really backtracking atm with our theme. Warehouse for reference. Would really like to see a reaction. Love the vids, keep up!
Thank you, I'm glad you like them! The answer to this depends on how much and how complex the custom code is. If it's simple and relatively small amounts of customization then you can backtrack. To do this it can either be by reverting to a previous version using Shopify's individual file versioning or duplicated backup theme. But you'll want to know exactly what was changed, otherwise you risk leaving behind some code that might cause problems later. But if you don't have a good grasp of the what was changed, then it can often times be easier to start from a fresh install. Trying to remove someone else's code may lead to more troubleshooting than just installing from the ground up. This is why I recommend making duplicates of your theme every time you make any code changes. It allows you to backtrack more easily. Good luck and I hope this helps!
We're not actively taking on clients but we're happy to hear about what you are looking for and might be able to offer some suggestions or help. You can fill out this form to reach us: docs.google.com/forms/d/1LXVh8Ks510f2EOWdlq5nVf0UbQ0AK6fuR9cf5ZuMubA/viewform?edit_requested=true
I just saw it - Sorry, somehow I missed it. Here are my thoughts: 1. Theme updates: ideally this is done and documented by the original developer, but if that's not possible then your approach of finding any customizations and adding it to the new version makes sense. You would need to just be very careful to test it thoroughly after adding it back to your new theme. Especially since the calculator may be dealing with pricing or advertised pricing, you'll want that to be calculated properly to avoid customer complaints. 2. I posted a new video yesterday that may help with your combined listings: ua-cam.com/video/bPDpDnFslVs/v-deo.html. If you decide to go with this customization and considering you have a large catalog, you will probably need to use Matrixify or Hextom BPE to bulk create the metaobject product groupings and then bulk update the metafields. 3. Not actually sure what you mean here (and I've never personally used the Warehouse theme). But generally, whether you want to use functions, a legacy style app without functions, or build directly in the theme will depend on a few factors: complexity or scope of the custom features, resources available for development, site speed performance requirements, and need for scalability or portability. Sorry if that's not very helpful right now, but it does depend on what features you're trying to add. I hope this helps!
Nice one. I'll let you know have I managed to make it work. Just from observing, I have noticed that you might be missing 'enable swipe on mobile' on your 'collection list section'. Also, just of curiosity, have you explored the solution to add drop down menu or even images for 3rd level on mobile. So where you have All Collection (1ts level)/Clothing (2nd level) on mobile by default it becomes to much tapping to go to Shirts, then back to Socks. If you know what I mean. It would be great if 3rd level is listed under the 2nd as drop down on mobile. And if image can be added to is as well, that would be even better. -All Collections - - Clothing - - - T Shirts - - - Socks - - - etc - - Shoos - - Accesories. hope I have explained it well.
Good points! I updated the code so that the enable swipe (and some other) settings are now available. Yes - adding images in dropdowns + additional levels is something I can look at. Added it to the list. Thanks!
Just wanted to let you know that the new navigation menu video is now out! We've got multi-level drawer and dropdown menus with images available now. Check it out: ua-cam.com/video/wUWo39swCC4/v-deo.html
Sorry, not sure what problem you're running into, but if you are trying to add subcollections, then you may want to check out this video: ua-cam.com/video/CKc6-nz6e-w/v-deo.html
i was wondering if you have a video that can help me?, not sure if its possible with shopify though. is it possible to add another menu to sub menus so in yours you have t-shirts but i'm trying to add another menu to t shirts for example long sleeve t shirts, cropped t-shirts ect so an even more defined catalogue
If you're looking for a 4th layer in your navigation menus, unfortunately Shopify doesn't support that out of the box. One workaround is for the 3rd layer to take you to a collections list with the collections you want in the 4th layer. But if you want it to be in the navigation menu itself, then there are apps you could install that provide that feature.
@@theprompted yea I am definitely going to give your suggestion a try but I would also like it in the navigation menu. Could you suggest any apps ? Would it be apart of a theme they have ?
Sorry, there aren't any apps that I've personally used that have 4 level navigation, so I don't have any to recommend. You'll have to do some research through the Shopify app store. Many offer free trials, so you could try them out before committing to any. Make sure to duplicate your theme before installing the apps.
I actually made an updated version of menu images in this video: ua-cam.com/video/wUWo39swCC4/v-deo.html Once you've added the code you can update your images with the theme settings as shown in 24:50 (of the new video).
We've changed where he host our code from Notion to our website blog. You can find the code at the link here: theprompted.co/blogs/tutorials/adding-images-to-your-shopify-mega-menu-and-drawer-menu-free-tutorial
Great Video! but if you have lots of products and on top they are gender based, its not the best solution to redirect a customer always to a site instead of giving them sub-menu options directly in the drawer menu. Maybe thats something for a new video ;) Also to mix text and pictures
Just wanted to let you know that the new navigation menu video is now out! We've got multi-level drawer and dropdown menus with images available now! You can check it out: ua-cam.com/video/wUWo39swCC4/v-deo.html
Thank you so much!❤
Great video! Very clear explanation and enjoyable to watch. Thanks!
My favorite channel ♥️🫶
Awesome💖💖 from Portugal here🇵🇹👋😊
Bro! do you know how i can hide the price of my products in my homepage?
wow!! and that all for free‼️
really amazing work
Amazing 🎉❤❤❤❤ love you
Just figured a perfect use -case for adding media to the menu items. The guide covers adding a metafield on using collection links in menu. However, if I use a specific URL (search URL) and add it on my menu then how am I able to give that menu entry a specific icon/gif? Hope you come up with a guide on this soon!
Doing this breaks the code and the sub-menu items won't show anymore!
Hi! Currently the code is designed for use with objects that have metafields (ex: products, collections, pages, blogs, etc). If you want to use a direct URL, then unfortunately the code needs to be adjusted a bit. I've added this to the list of suggestions. Thanks!
Awesome Video yet again!! 🔥
King! what an awesome video and all of it for free! Subb'd!
Brother, along with collections and pages i also have direct links in my Header Menu.
I need to figure out how to also add images above these 'Links' in my header menu because its currently showing a Grey Image.
Since it was designed to work with metafields (which your direct links likely don't have), unfortunately you would need a bit of additional code customization to handle those situations.
This is amazing, but would it be possible for you to go through a way we can hover and show a second image on the mega menu?
Thanks for the suggestion! I'll add it to the queue
showing error or hide Navigation bar Sub Category in Mobile menu
It's a great tutorial and you have posted two more videos on the menu. However, my request is if you can create a menu similar to Fashion Nova. You have added photos, but I would like the rest of the collection to be the same as the default menu, with the addition of one image. Thank you.
Thanks for the suggestion! I added it to our suggestion box
@@theprompted yes, Thank you
@@theprompted did you ever get around to making that tutorial? ultimately that's what I was looking for
bro keep up the good work, add option in your channel to add tips
Will look into doing that when the channel grows enough to unlock that feature. Until then, the best way to support us is by using our tutorials, sharing our videos with anyone you think would benefit, and liking + subscribing! Thanks :)
Hey Love the Content, Would like to ask if this will work with the "Refresh" theme as well?
Yes, it should also work with the Refresh theme
is the code only available for the dawn theme? I want to add it to Gain theme of Shopify, please guide me from where can i copy the code please. thanks
This was designed for the free Shopify themes, like Dawn, Refresh, Sense, etc.
For premium/third-party themes like Gain, it might not behave as expected and might require some additional development to adapt it to work.
But you can always give it a try and let us know how it goes!
is the code only available for the dawn theme? I tried to use it in archetypes motion theme and the code didnt't work. how do I fix this? thx.
The code was designed for the free Shopify themes like Dawn, Refresh, Sense, etc. Archetype are third party/premium themes that have been designed differently, so you're unlikely going to be able to simply copy & paste the code. You can still use it as a reference, but may need some development work to adapt it to your theme.
Could you do a video on manually updating your theme which had (external) custom coding done on it? Really backtracking atm with our theme. Warehouse for reference. Would really like to see a reaction. Love the vids, keep up!
Thank you, I'm glad you like them!
The answer to this depends on how much and how complex the custom code is.
If it's simple and relatively small amounts of customization then you can backtrack. To do this it can either be by reverting to a previous version using Shopify's individual file versioning or duplicated backup theme. But you'll want to know exactly what was changed, otherwise you risk leaving behind some code that might cause problems later.
But if you don't have a good grasp of the what was changed, then it can often times be easier to start from a fresh install. Trying to remove someone else's code may lead to more troubleshooting than just installing from the ground up.
This is why I recommend making duplicates of your theme every time you make any code changes. It allows you to backtrack more easily.
Good luck and I hope this helps!
Do you offer your services for things like for example updating a theme?
We're not actively taking on clients but we're happy to hear about what you are looking for and might be able to offer some suggestions or help. You can fill out this form to reach us: docs.google.com/forms/d/1LXVh8Ks510f2EOWdlq5nVf0UbQ0AK6fuR9cf5ZuMubA/viewform?edit_requested=true
@@theprompted Filled in the form awhile ago, did you receive it :)?
I just saw it - Sorry, somehow I missed it.
Here are my thoughts:
1. Theme updates: ideally this is done and documented by the original developer, but if that's not possible then your approach of finding any customizations and adding it to the new version makes sense. You would need to just be very careful to test it thoroughly after adding it back to your new theme. Especially since the calculator may be dealing with pricing or advertised pricing, you'll want that to be calculated properly to avoid customer complaints.
2. I posted a new video yesterday that may help with your combined listings: ua-cam.com/video/bPDpDnFslVs/v-deo.html. If you decide to go with this customization and considering you have a large catalog, you will probably need to use Matrixify or Hextom BPE to bulk create the metaobject product groupings and then bulk update the metafields.
3. Not actually sure what you mean here (and I've never personally used the Warehouse theme). But generally, whether you want to use functions, a legacy style app without functions, or build directly in the theme will depend on a few factors: complexity or scope of the custom features, resources available for development, site speed performance requirements, and need for scalability or portability. Sorry if that's not very helpful right now, but it does depend on what features you're trying to add.
I hope this helps!
Nice one. I'll let you know have I managed to make it work. Just from observing, I have noticed that you might be missing 'enable swipe on mobile' on your 'collection list section'.
Also, just of curiosity, have you explored the solution to add drop down menu or even images for 3rd level on mobile.
So where you have All Collection (1ts level)/Clothing (2nd level) on mobile by default it becomes to much tapping to go to Shirts, then back to Socks. If you know what I mean. It would be great if 3rd level is listed under the 2nd as drop down on mobile. And if image can be added to is as well, that would be even better.
-All Collections
- - Clothing
- - - T Shirts
- - - Socks
- - - etc
- - Shoos
- - Accesories.
hope I have explained it well.
Good points! I updated the code so that the enable swipe (and some other) settings are now available.
Yes - adding images in dropdowns + additional levels is something I can look at. Added it to the list. Thanks!
@@theprompted Thank you, and you are most welcome.
Just wanted to let you know that the new navigation menu video is now out! We've got multi-level drawer and dropdown menus with images available now. Check it out: ua-cam.com/video/wUWo39swCC4/v-deo.html
brother unable to add multiple collections in sub colection
Sorry, not sure what problem you're running into, but if you are trying to add subcollections, then you may want to check out this video: ua-cam.com/video/CKc6-nz6e-w/v-deo.html
i was wondering if you have a video that can help me?, not sure if its possible with shopify though. is it possible to add another menu to sub menus so in yours you have t-shirts but i'm trying to add another menu to t shirts for example long sleeve t shirts, cropped t-shirts ect so an even more defined catalogue
If you're looking for a 4th layer in your navigation menus, unfortunately Shopify doesn't support that out of the box.
One workaround is for the 3rd layer to take you to a collections list with the collections you want in the 4th layer.
But if you want it to be in the navigation menu itself, then there are apps you could install that provide that feature.
@@theprompted yea I am definitely going to give your suggestion a try but I would also like it in the navigation menu. Could you suggest any apps ? Would it be apart of a theme they have ?
Sorry, there aren't any apps that I've personally used that have 4 level navigation, so I don't have any to recommend. You'll have to do some research through the Shopify app store. Many offer free trials, so you could try them out before committing to any.
Make sure to duplicate your theme before installing the apps.
but how to incearse the Image Size
I actually made an updated version of menu images in this video: ua-cam.com/video/wUWo39swCC4/v-deo.html
Once you've added the code you can update your images with the theme settings as shown in 24:50 (of the new video).
cant find the code on the given link. Please help me to find the code to be put under section
At the bottom of the page you will see instructions with a triangle. Simply click on the triangle to open the dropdown and reveal the code.
@@theprompted bottom of which page can i find the instructions with a traingle?
We've changed where he host our code from Notion to our website blog. You can find the code at the link here: theprompted.co/blogs/tutorials/adding-images-to-your-shopify-mega-menu-and-drawer-menu-free-tutorial
Great Video! but if you have lots of products and on top they are gender based, its not the best solution to redirect a customer always to a site instead of giving them sub-menu options directly in the drawer menu.
Maybe thats something for a new video ;)
Also to mix text and pictures
Stay tuned, multi-level drawer menus with images are coming soon :)
Just wanted to let you know that the new navigation menu video is now out! We've got multi-level drawer and dropdown menus with images available now! You can check it out: ua-cam.com/video/wUWo39swCC4/v-deo.html
Didnt work
What errors are you getting?