This thread is over two years old and may be outdated. Please create a new thread if you need help, or email us if you have an active Premium license.

Modifying the menu icon on the mobile site

Resolved 22 replies technicalthemetheme-vantage
7 years ago · Last reply by Danit Felber 7 years ago

I’ve been using the plugins to make my site (Vantage theme) look good.

I managed to get rid of the word “Menu” and put a hamburger menu in its place, but the icon looks squashed down and I can’t figure out how to bring it back to its normal proportions. I’d also like to make it a little bigger.

The site is brit-hazon.org.

Thanks for your help!

This is our free support forum. Replies can take several days.

Need fast email support? Get SiteOrigin Premium

Replies

22
  1. Alex S Staff 7 years, 11 months ago

    Hi Danit,

    Please navigate to WP AdminAppearanceCustom CSS and remove:

    body.responsive header#masthead.masthead-logo-in-menu .main-navigation .menu-mobilenav-container ul li a {
      font-size: 0px;
    }

    Then please navigate to WP AdminAppearanceCustomize, Theme SettingsNavigation and set the Mobile Text to  .

  2. Danit Felber 7 years, 11 months ago

    Hi Alex! It didn’t work for me… Any other suggestions?

  3. Alex S Staff 7 years, 11 months ago

    Hi Danit,

    Sorry for the delay.
    Hm. Please try navigating to WP AdminAppearanceCustomize, Additional CSS and removing the above mentioned CSS. How does that look?

  4. Danit Felber 7 years, 11 months ago

    Thanks for the help! It moved the icon down a bit, but it’s still squished and small…

  5. Alex S Staff 7 years, 11 months ago

    Hi Danit,

    Please navigate to WP AdminAppearanceCustomize, Additional CSS and increase the width/height:

    .mobilenav-main-link img {
        max-height: 15px;
        max-width: 20px;
        margin-right: 10px;
    }
  6. Danit Felber 7 years, 11 months ago

    Still nothing :/

  7. Alex S Staff 7 years, 11 months ago

    Hi Danit,

    The above CSS still has the same width and height values. As mentioned, you’ll need to change them to increase the sizing of the icon.

  8. Danit Felber 7 years, 11 months ago

    I did – I put each one at 30 px

  9. Alex S Staff 7 years, 11 months ago

    Hi Danit,

    Please clear your page cache as non-logged in users (which I suspect you’re not logged in on your mobile device) are still seeing the unedited mobile menu icon sizing.

  10. Danit Felber 7 years, 11 months ago

    I tried that too, still nothing. Sorry this is such a pain!

  11. Alex S Staff 7 years, 11 months ago

    Hi Danit,

    Can you please provide me with a complete copy of the contents of WP AdminAppearanceCustomize, Additional CSS?

    I ask because the CSS is still coming up the same for me so I just want to confirm you’ve made the right adjustments.

  12. Danit Felber 7 years, 11 months ago

    Yep!

    /*get rid of “Menu” in mobile version*/
    .mobile-nav-frame .title h3 {
    display: none;
    }

    .mobilenav-main-link img {
    max-height: 30px;
    max-width: 30px;
    margin-right: 10px;
    }

  13. Alex S Staff 7 years, 11 months ago

    Hi Danit,

    While that is correct, that’s not what’s present in the output. Are there any other additional caching systems in place on your website that may cause your changes not to be present on the frontend?

  14. Danit Felber 7 years, 11 months ago

    There aren’t any extra caching systems.

  15. Alex S Staff 7 years, 11 months ago

    Hi Danit,

    Would it be possible for you to create a temporary admin account for us so we can log in and take a look around your setup?

  16. Alex S Private Staff 7 years, 11 months ago

    This is a private message.

  17. Danit Felber 7 years, 11 months ago

    Just set it up – thank you!

  18. WordPress Private 7 years, 11 months ago

    This is a private message.

  19. Alex S Staff 7 years, 10 months ago

    Hi Danit,

    Thanks. You had another version of the CSS added to WP AdminAppearanceCustom CSS, I’ve removed that in favor of the CSS you’ve added to WP AdminAppearanceCustomize, Additional CSS.

    How does that look?

  20. Danit Felber 7 years, 10 months ago

    The button looks much better! Is there a way to bring it up so it’s in line with the logo?

  21. Alex S Staff 7 years, 10 months ago

    Hi Danit,

    I’d like to help you with that, but unfortunately, this is beyond the scope of the support we’re able to offer on our free forums. There is a fair amount of custom work involved.

    We do offer this level of support to our premium users, so if you’d like to upgrade to SiteOrigin Premium, then I can help you over email support.

    If you’d prefer not to upgrade to SiteOrigin Premium, then you can hire a WordPress developer from Codeable. They’ll charge you an hourly rate for any work done.

  22. Danit Felber 7 years, 10 months ago

    Alright, thanks so much for all your help Alex!

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.

Have a different question or issue?

Start New Thread