Home › Forums › Basel support forum › Top Menu on Mobile Devices

Top Menu on Mobile Devices

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • July 27, 2017 at 7:10 am #16867

    pursehuit
    Participant

    Hi,
    Is there a way to display the Top Menu also on Mobile Devices?
    Thx

    July 27, 2017 at 7:33 am #16869

    Artem Temos
    Keymaster

    Hi,

    You can display your top bar menu on mobile adding the following code snippet to the Custom CSS section in Theme Settings -> Custom CSS for mobile devices only

    .top-bar-right,
.top-bar-left,
.topbar-wrapp .topbar-menu {
    display: block;
}

.topbar-wrapp {
  	height:auto;
}

.topbar-menu {
	float:none;
  	margin:auto;
}

.topbar-menu ul.menu {
	text-align:center;
}

    Regards

    July 27, 2017 at 7:51 am #16870

    pursehuit
    Participant

    Thx a lot!

    July 27, 2017 at 12:37 pm #16874

    Artem Temos
    Keymaster

    You are welcome!

    January 9, 2021 at 9:41 am #256951

    pursehuit
    Participant

    Hi. I am reopening this topic because after update to the last version of the theme – 5.4.2 – top bar is now showing right on the mobile with the css you gave me.
    Please check screenshot on mobile – http://prnt.sc/wjlz2z

    January 9, 2021 at 8:01 pm #257031

    Elise Noromit
    Member

    Hello,

    Please provide your site admin access to the private area.

    Best Regards

    January 9, 2021 at 8:46 pm #257041

    pursehuit
    Participant

    Ok. I sent you the login details for staging site where we have exactly the same configuration as the live one.

    January 10, 2021 at 4:34 pm #257124

    Elise Noromit
    Member

    Hello,

    I have checked the Theme Settings > Custom CSS > Mobile, I see the code we have provided is added not in full.

    In addition, please remove this upper row and check again.

    Best Regards

    January 10, 2021 at 4:34 pm #257125

    Elise Noromit
    Member

    Hello,

    I have checked the Theme Settings > Custom CSS > Mobile, I see the code we have provided is added not in full.

    In addition, please remove this upper row and check again.

    Best Regards

    January 10, 2021 at 4:40 pm #257128

    pursehuit
    Participant

    I am sorry. I forgot on staging site it was not in full. Even in full cod you provided first, its not working anymore with the latest version of the theme.
    You can check again now. I added the custom css in full.

    January 10, 2021 at 4:53 pm #257131

    pursehuit
    Participant

    I did some tests and I found that the following code is solving the problem:

    .topbar-wrapp.color-scheme-light {
    height: 50px;
}

    It is ok or do you have a better solution?

    January 10, 2021 at 9:30 pm #257176

    Elise Noromit
    Member

    Hello,

    We can hardly suggest something better as I saw the menu with the code and it required more space in height and it is the solution.

    Best Regards

  • Author
    Posts
Viewing 12 posts - 1 through 12 (of 12 total)