aaaallleeexx Posted April 24, 2022 Share Posted April 24, 2022 Site URL: http://www.alexcomansn.com Hello! I'm trying to make the menu on mobile a bit more visible. Right now from my analytics i see people remain on my home page only. Therefore - 01: is there a way to make the mobile menu always on? 02: is there a way to modify the menu to make it more legible. Bold the folder name / remove those lines? Thank you! Link to comment
aaaallleeexx Posted April 24, 2022 Author Share Posted April 24, 2022 I made a clearer idea of what I desire. First - I want to add a burger view like in this wells template website: Second - I would like to change the color to my desired color - as in this wells template website: Third - I would like to format my menu so the 'folder' category and text is more legible: from this: to this: Thank you so much !! Link to comment
aaaallleeexx Posted April 25, 2022 Author Share Posted April 25, 2022 On 4/24/2022 at 3:40 PM, aaaallleeexx said: I made a clearer idea of what I desire. First - I want to add a burger view like in this wells template website: Second - I would like to change the color to my desired color - as in this wells template website: Third - I would like to format my menu so the 'folder' category and text is more legible: from this: to this: Thank you so much !! I found the burger menu code: /* Menu text to burger */ #mobileMenuLink ul>li.active-link { visibility: hidden; } #mobileMenuLink ul>li.active-link a:before { visibility: visible; content: ""; background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik0yNCAxOHYxaC0yNHYtMWgyNHptMC02djFoLTI0di0xaDI0em0wLTZ2MWgtMjR2LTFoMjR6IiBmaWxsPSIjMTA0MGUyIi8+PHBhdGggZD0iTTI0IDE5aC0yNHYtMWgyNHYxem0wLTZoLTI0di0xaDI0djF6bTAtNmgtMjR2LTFoMjR2MXoiLz48L3N2Zz4=); width: 30px; height: 30px; display: block; margin-right: 5px !important; background-position: right center; background-repeat: no-repeat; float: right; margin-top: 5px; } /* Burger to X icon */ .menu-open + div #mobileMenuLink ul>li.active-link a:before { background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMjMuOTU0IDIxLjAzbC05LjE4NC05LjA5NSA5LjA5Mi05LjE3NC0yLjgzMi0yLjgwNy05LjA5IDkuMTc5LTkuMTc2LTkuMDg4LTIuODEgMi44MSA5LjE4NiA5LjEwNS05LjA5NSA5LjE4NCAyLjgxIDIuODEgOS4xMTItOS4xOTIgOS4xOCA5LjF6Ii8+PC9zdmc+) !important; filter: invert(1); } Does anyone know how to format the menu similar to this? or how to format the text of the wells mobile menu in anyway?! Thanks!! Link to comment
tuanphan Posted April 27, 2022 Share Posted April 27, 2022 On 4/26/2022 at 3:48 AM, aaaallleeexx said: I found the burger menu code: /* Menu text to burger */ #mobileMenuLink ul>li.active-link { visibility: hidden; } #mobileMenuLink ul>li.active-link a:before { visibility: visible; content: ""; background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik0yNCAxOHYxaC0yNHYtMWgyNHptMC02djFoLTI0di0xaDI0em0wLTZ2MWgtMjR2LTFoMjR6IiBmaWxsPSIjMTA0MGUyIi8+PHBhdGggZD0iTTI0IDE5aC0yNHYtMWgyNHYxem0wLTZoLTI0di0xaDI0djF6bTAtNmgtMjR2LTFoMjR2MXoiLz48L3N2Zz4=); width: 30px; height: 30px; display: block; margin-right: 5px !important; background-position: right center; background-repeat: no-repeat; float: right; margin-top: 5px; } /* Burger to X icon */ .menu-open + div #mobileMenuLink ul>li.active-link a:before { background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMjMuOTU0IDIxLjAzbC05LjE4NC05LjA5NSA5LjA5Mi05LjE3NC0yLjgzMi0yLjgwNy05LjA5IDkuMTc5LTkuMTc2LTkuMDg4LTIuODEgMi44MSA5LjE4NiA5LjEwNS05LjA5NSA5LjE4NCAyLjgxIDIuODEgOS4xMTItOS4xOTIgOS4xOCA5LjF6Ii8+PC9zdmc+) !important; filter: invert(1); } Does anyone know how to format the menu similar to this? or how to format the text of the wells mobile menu in anyway?! Thanks!! You mean remove line between items? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment