How To Change Hamburger Menu Icon On Mobile In Shopify
ฝัง
- เผยแพร่เมื่อ 29 ส.ค. 2024
- I will show you how to change hamburger header menu icon on mobile in Shopify and set it to any icon of your preference to be the header menu icon for mobile.
The Shopify header menu icon commonly known as the "hamburger menu" is a small icon consisting of three horizontal lines and It is typically placed at the top of the screen and serves as a gateway to the website's navigation menu but however many Shopify store owners fail to realize the importance of changing this menu icon to enhance user experience.
First, changing the header menu icon on mobile in Shopify can help improve the overall aesthetics of your store and the default hamburger menu icon may look generic and unappealing, which can give a negative impression to your visitors so by customizing it to match your Shopify store brand's identity you can create a more visually appealing and cohesive design that resonates with your target audience.
Tool : editsvgcode.com
If you have any questions or suggestions my Instagram : / anas_elmedlaoui
About me:
My name is Anas El Medlaoui and i have been around digitally for 9 years making Websites, Mobile Applications, Social Media Promotions, E-commerce etc...
And i have accumulated some experience in multiple fields over the years jumping from project to project (Which wasn't a good idea), I started this TH-cam channel after a year of hesitation to share my knowledge and experience with people that are willing to succeed online with the theory of knowledge for everyone.
#shopify #menu #icon
what a wonderful video, helped a lot this is crazy how you help us out with so many codes that too for free. god bless you man massive love from india🙏🙏🙏🙏❤❤❤❤
Thank you legend and im really glad i did help, no worries tons of videos on the way which means more code to share haha.
Ameen and much respect to indian people.
Cheers
Thanks, worked perfectly.
Really glad it did and you're welcome
sir your vedios very helpfull thankss...plzz make one vedio about circle slider collection..
You're very welcome and glad they were.
I just noted your request now, i will work on it.
Cheers
Hey Anas, Great Content!! How do I add sidebar menu as a drop-down menu on my pages, through liquid. Thanks!
Hey, Thank you and i appreciate that.
Can you provide more info on this, i replied to your previous comment.
Cheers
Bro I lover your videos you‘re helping me so much!
But I really need your help:
I changed the hamburger icon and it worked perfectly. But if I press further down it still opens. So the hamburger icon has a „hidden bar“ down to the middle of the page. I just want it to be where it should be but I don‘t now what to change. Also this is only on mobile because obviously on desktop you don‘t have the hamburger icon. Please help me bro! Big love
same thing happens now as I changed the cart icon I don‘t know what to do
nevermind bro I figured it out
Thank you and glad they were helpful.
Good to know you fixed it
thanks sir. will you please make a video on how to make additional tabs for different products like headphones tab or speakers so customer make prodcts easily to find
You're very welcome, you mean for the description of the product ? sorry i misunderstood your request but can you elaborate more on the question ?
Let me know in a new comment as its difficult now for me to see replies.
Cheers
can you make dropdown description for multicolumn in dawn theme ?
You mean the cards in multicolumn will be as dropdown ?
Can you please elaborate more on the request ! thanks.
Let me know in a new comment its hard to see the replies now.
Cheers
Hi there anas yopu showed the hamburger Icon but what about the "X" button when you click on the hamburger icon to see the dropdown menu?
Hey, Ohh thats a good question, if you want to change that use the same trick in this video but for icon-close.liquid file instead.
I will make a video about this for other people who have the same question, because i know questions keep repeating.
Cheers
how to customize "add to cart" and "buy it now" add effects to it? like jumping and shaking
I just noted your request and i will work on it.
Cheers
sir plzz help me
specific color variant show
please make a video on this
Can you elaborate more on the request please ? Is it to show the variant picture when the visitor clicks on the variant color ?
If thats the case, the option has been added to Dawn lately.
Cheers
this doesn't fully work as when you go to press the menu button the x is on top of this icon, however you can fix this by pasting the *
actually it may fully work i havent updated to dawn 15.0 yet
I works just fine and i had to recheck after your comment.
yes
can you please simplify that, for me it just erase X
Hi Anas I tried to change also the icon-close.liquid to change the X button but it didn’t work they showed me two icons in the same place at the same time
Ohh i see, then it must have two files then thats why there is that conflict.
Im afraid you might have to wait because i already noted your request that day and now i will work on it and see whats going on.
Cheers
@@OnHOWGuy Thanks a lot Anas
Hey, i have an update for you, i just checked and i figure it out.
Don't change the whole code, Keep the info above like "xmlns=,aria-hidden=focusable=, and so on" change only the code after
@@OnHOWGuy Thanks a lot Anas