Home Forums Weaver Xtreme Theme Can I add the word "Menu" after the hamburger icon on my mobile menu

This topic contains 9 replies, has 2 voices, and was last updated by  otaku 5 days, 4 hours ago.

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #49069

    otaku
    Participant

    I would like to add the word “menu” after the hamburger icon on the mobile menu at https://prime-tshirts.com

    Doable?

    #49071

    scrambler
    Moderator

    Typing Menu in The Guide site Search box in the sidebar would have returned several article one of them being

    Mobile Menu: Advanced Customizations > Add a Menu label beside the Hamburger Icon On mobile

    http://guide.weavertheme.com/mobile-menu-advanced-customizations/#xlabel

    #49073

    otaku
    Participant

    While that does indeed put a Menu label in it appears it’s nearly impossible to style the text Menu.

    I need to change the size of the text Menu and move it up vertically but everything I add to style code screws my layout.

    Can I style just the text Menu?

    #49074

    otaku
    Participant

    I’m using this to add the word “Menu”

    <span style="vertical-align:inherit" class="genericon genericon-menu">
    </span><span style="color:red; padding-left:10px">Menu</span>
    #49075

    otaku
    Participant

    I’ve attempted to add multiple style items but as I indicated above it just breaks the page.

    #49076

    scrambler
    Moderator

    The HTML you have now is all corrupted, so I dont know what happened when you pasted it.

    Delete the content of the “Hamburger Label” box and retype the HTML.

    For the record if I copy paste from the guide article in that box I dont get any problem, but may be your computer does something to the copy paste, so typing it carefully should help

    #49077

    otaku
    Participant

    Should I be able to change the font size of Menu?

    #49078

    otaku
    Participant

    It’s too bad the entry box is so small and not expandable!

    #49079

    scrambler
    Moderator

    The fact it does not expand is indeed a problem and something @weaver can probably fix.

    @weaver, The Hamburger HTML box uses an <input> tag, instead of a <textarea> tag. As a result, it does not auto expand when the content gets bigger.

    It that necessary, or could it be changed to textarea?

    @otaku

    You can change the Font size by adding it to the style attribute

    <span style="vertical-align:inherit" class="genericon genericon-menu">
    </span><span style="color:red; padding-left:10px;font-size:150%;">Menu</span>

    if you want to do a lot of styling on the text, you can put a class on it, then use the class to create custom CSS rules.

    <span style="vertical-align:inherit" class="genericon genericon-menu">
    </span><span class="mymenu-text">Menu</span>

    then add a styling rule like below to the Theme Global Custom CSS rule box

    .mymenu-text {color: white; padding-left: 10px; font-size: 150%;}

    #49080

    otaku
    Participant

    Awesome – Thank You!

Viewing 10 posts - 1 through 10 (of 10 total)

You must be logged in to reply to this topic.