Add "Menu" text next to burger icon

Solved
fredbleu
Excursionist
12 2 0

Hello, I'd like to add "Naviguer" to the right of the navigation burger icon on my store.
I'm an experienced programmer, but my html skills are rusty lol...
I have achived it, but display was inconsistent throuout different browsers and phones, so i reverted the changes.
I probably didin't do somthing right.
I want it to look like this on mobile and on desktops.
Screenshot_20201221-152059_Chrome.jpg
what would be the correct html and css properties to use here to get that done?

My store URL is La Cabane à Boucane (lacabaneaboucane.com)
and the theme I am using is a lightly customized version of the free shopify brooklyn theme.
Thank you!

0 Likes

This is an accepted solution.

.site-nav--open.site-nav--mobile.js-drawer-open-button-left.site-nav--init {
    width: 119px;
}
button.icon-fallback-text.site-nav__link.site-nav__link--burger.js-drawer-open-button-left::after {
    content: "Naviguer";
    position: relative;
    right: -37px;
}

Hello
Add this css at the bottom of
Online Store->Theme->Edit code->Assets->timber.scss.liquid

If helpful then please Like and Accept Solution. Free Website Review and advice for sale from Hire us
Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO | Digital Marketing | Site Speed Optimization | Performance Site Audit
For Quick Chat Whats app | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87
fredbleu
Excursionist
12 2 0

Thank you! exactly what i wanted.
Last thing i'd like would be it to have the same space to the left and right.
2020-12-22 10_23_08-La Cabane à Boucane and 1 more page - Personal - Microsoft​ Edge.png
What would that be? im trying padding and margins but it dosnt work x)

0 Likes