Page 1 of 1
Navigation Bar
Posted: 2022-09-29 14:07
by christian
Hello,
Navigation Bar:
a great way to keep link well organised.
(AppGiniHelper.common.getNavbar())
Unfortunately, the navbar is not displayed in the mobile view (smartphone, ...).
Is there a way to fix this ?
Kind regards
Re: Navigation Bar
Posted: 2022-09-29 16:10
by jsetzer
Hi, don't know if I got your point. If not, please describe more detailed.
When opening in SmartPhone device, navbar is shown, but, obviously, automatically reduced to screen size. This is the default behaviour of websites using Bootstrap framework.
Can you show a screenshot so we can see?
Re: Navigation Bar
Posted: 2022-09-30 09:12
by christian
Hello, attached are 2 pictures showing my "problem".
Picture 01 - desktop view - you can see the menu item "Hilfe" on the top right.
Picture 02 - mobile view - "Burger menu" is there, the menu item "Hilfe" is gone.
Thank you for your efforts and best regards from Austria
Christian
Re: Navigation Bar
Posted: 2022-10-02 18:47
by christian
Hello,
is my "problem" understandable ?
Thank you for the support.
many greetings
Christian
Re: Navigation Bar
Posted: 2022-10-02 20:16
by jsetzer
Well, from my point of view it works as designed, if menus and menuitems are hidden behind so called menu-hamburger button in small devices.
Re: Navigation Bar
Posted: 2022-10-03 07:15
by christian
Herzlichen Dank für die Info.
Liebe Grüße
Re: Navigation Bar
Posted: 2022-10-03 14:11
by ronwill
Hi Jan,
I think Christian wants the menu item 'Hilfe' to show on mobile devices in header or as a menu button?
Re: Navigation Bar
Posted: 2022-10-03 16:53
by jsetzer
Thanks, Ron, I know.
That is more complex than it looks like.
The problem is: You can put as many additional buttons as you like there. But the space is limited, depending on title and available screen width.
So, what is next: there must be an algorithm calculating button widths and deciding about how many buttons may (!) fit into the gap between title and Hamburger-menu and which buttons shall be visible in xs, sm, md and lg screen sizes in portrait/landscape.
Or, if you don't want an algorithm to make those decisions, you will have to specify (=configure) by yourself. For the developers configuring single button visibility would be much more than a one-liner in javascript, especially when specifying for different screen sizes depending on portrait and/or landscape mode and depending on media (screen/print).
Re: Navigation Bar
Posted: 2022-10-03 17:12
by jsetzer
I've just checked HTML code. The whole right part has class hidden-xs and therefore will not be visible in smartphone devices in portrait orientation.
In a first step we can bring back those additional buttons into the hamburger-menu:
Code: Select all
<!-- file: hooks/header-extras.php -->
<script>
jQuery("ul.nav.navbar-nav.navbar-right.hidden-xs").removeClass("hidden-xs");
</script>
In Landscape:
- chrome_dbxAfVwvTB.png (31.58 KiB) Viewed 1923 times
In Portrait:
Those additional buttons are in menu now.
- chrome_6zxRfZjKHU.png (35.69 KiB) Viewed 1923 times