Mobile Responsive Header - Menu Button - Search Icon

VanessaDebus · October 2015

Two questions:

1. How can I create a mobile responsive header in that way: logo left - serach icon right, menu button right -> all in one line
2. Is it possible to change the menu button icon (that three stacked lines)?

Thank you in advance!!

Albert · October 2015

Hi,

1. This one is unfortunately impossible. With custom css it will be probably possible to move one of them next to the logo but we need url to your site first.

2. Yes, it is possible. Under Theme options > Responsive section, you can set text instead of icon.

VanessaDebus · October 2015

To 2: But I can not change the icon with custom css in textbox, right?! Its only this icon or text?

To1:
Here is my url:
http://www.meyouandtheworld.com/home/

Albert · October 2015

1. We checked your site but this is unfortunately impossible. Only menu icon can be in the same line as logo.

2. You can use icon as html, like: <i class="ICON-NAME"></i>

VanessaDebus · October 2015

ok, thank you!

Albert · October 2015

No problem

VanessaDebus · October 2015

Two more questions: (same url)
1. How can I align my responsive logo to the left?
2. How can I decrease responsive padding/margin above and below my logo and menu button -> to descrease responsive header size?

Albert · October 2015

1. You can align this logo to the left side with below css:

@media only screen and (max-width: 479px) { 
    #Top_bar .logo #logo { margin: 5px 0px 15px !important; } 
    .header-stack #Top_bar .logo { text-align: left !important; }
}

2. Please show us on screenshot what exactly you want to do.

VanessaDebus · October 2015

to 1: Thank you! That works perfectly!
to 2: solved with #1

Albert · October 2015

You're welcome

VanessaDebus · October 2015

How can I change color of the mobile menu "+" for submenus? it's currently gray and hard to see on mobile devices.

Albert · October 2015

It's an image. So if you want to change it's color, you must upload new image. It's under http://www.meyouandtheworld.com/wp-content/themes/betheme/images/menu-plus.png

VanessaDebus · October 2015

thx!

Albert · October 2015

You're welcome

VanessaDebus · March 2016

The mobile submenu + is gray again. Probably you stopped using the "menu-plus.png" since one of the last theme updates?!

How can I change the color of the mobile menu "+" for submenus now?

Albert · March 2016

To change plus icon, please use the following css:

#Top_bar #menu ul li.submenu .menu-toggle { color: #000 !important; }

VanessaDebus · March 2016

Works! Thank you!

Albert · March 2016

You are welcome!

Mobile Responsive Header - Menu Button - Search Icon

Comments