Home>Support>Remove “menu” text from responsive menu

Remove “menu” text from responsive menu

By Espen Gjelsvik, 9 years ago. Last reply by Andrew Misplon, 9 years ago.

I find more of my customers want to use responsive menus as default view. (i.e use the 3bars menu button also when viewing the website from desktop computers)

I set the overflow width to 3000px, so it forces the responsive menu allways. But i dont want the “menu” text by the icon. Also, how can i customize the icon? I want it bigger. (possible to add Font Awesome`s “f0c9” ?)

Last question, how can i manage to make the menubar the same color as the header? We want it clean, not a dark grey bar that sticks out :) Perhaps we could use the phonenumber position in the headerbar to place the responive menu button?

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 9 years, 10 months ago Andrew Misplon
    Hi, I Work Here

    Hi Espen

    Our Influence theme runs a responsive menu as the main menu: Theme: Influence. Perhaps for another project.

    Below is a full set of selectors you can use under Appearance > Custom CSS to try style the menu:

    /* Mobile Nav */

.mobile-nav-frame {
background: #222222 !important;
}

.mobile-nav-frame .title h3 {
color: white !important;
text-shadow: 0px 2px 1px rgba(0, 0, 0, 0.8) !important;
}

.mobile-nav-frame ul {
background: #212121 !important;
border: 1px solid #111 !important;
}

.mobile-nav-frame ul li {
border-bottom: 1px solid rgba(0, 0, 0, 0.25) !important;
border-top: 1px solid rgba(255, 255, 255, 0.05) !important;
}

.mobile-nav-frame ul li a.link {
color: #F3F3F3 !important;
text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.7) !important;
}

    The latest version of Vantage Premium does provide a standard mobile menu icon. It will unfortunately, at this stage, require custom development to remove the word Menu, it isn’t wrapped in any element that can be easily targeted. Sorry I don’t have more there.

  2. 9 years, 9 months ago Espen Gjelsvik

    Thanks. Influence looks great, Maybe I should go for that one instead.

    That CSS you posted, was that intended for Vantage og Influence?

    I sort of solved the problem myself by disabling the menu, and using “responive menu” plugin. And publishing it in the masthead.php instead of the code where you display the phonenumbers.

  3. 9 years, 9 months ago Andrew Misplon
    Hi, I Work Here

    That’s right, the CSS above is to help style the mobile menu in Vantage should you wish to go that route.

    Glad to hear you made some progress. Thanks for the update.

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More