RocketStang Posted September 5, 2020 Share Posted September 5, 2020 So I upgraded one of my forums to 4.5 and every thing looks good except the Hamburger menu is missing from mobile view on my phone. www.bigmacktrucks.com Link to comment Share on other sites More sharing options...
Adlago Posted September 6, 2020 Share Posted September 6, 2020 You probably have a missing template "mobileNavigationIcon" - in this template is a hamburger menu. Link to comment Share on other sites More sharing options...
RocketStang Posted September 7, 2020 Author Share Posted September 7, 2020 I got the menu icon back but now it is on the top right corner of the mobile view. Shouldn't it be on the nav bar with the other icons? Link to comment Share on other sites More sharing options...
Adlago Posted September 7, 2020 Share Posted September 7, 2020 2 hours ago, RocketStang said: I got the menu icon back but now it is on the top right corner of the mobile view. Shouldn't it be on the nav bar with the other icons? On my site I did the following: 1. I removed a code for template "mobileNavigationIcon" from a global template. 2. Template "mobileNavBar" I edited by adding a hamburger menu code, before </ul>, or now total code this template is: <ul id='elMobileNav' class='ipsResponsive_hideDesktop' data-controller='core.front.core.mobileNav'> {{if \count( \IPS\Output::i()->breadcrumb )}} {{if \count( \IPS\Output::i()->breadcrumb ) == 1}} <li id='elMobileBreadcrumb'> <a href='{setting="base_url"}'> <span>{lang="home"}</span> </a> </li> {{else}} {{$i = 0;}} {{foreach \IPS\Output::i()->breadcrumb as $k => $b}} {{if $i + 2 == \count( \IPS\Output::i()->breadcrumb )}} <li id='elMobileBreadcrumb'> <a href='{$b[0]}'> <span>{$b[1]}</span> </a> </li> {{endif}} {{$i++;}} {{endforeach}} {{endif}} {{endif}} {{$defaultStream = \IPS\core\Stream::defaultStream();}} <li {{if !\IPS\Member::loggedIn()->canAccessModule( \IPS\Application\Module::get( 'core', 'discover' ) ) }}class='ipsHide'{{endif}}> <a data-action="defaultStream" href='{{if $defaultStream}}{$defaultStream->url()}{{else}}{url="app=core&module=discover&controller=streams" seoTemplate="discover_all"}{{endif}}' title="streams"><i class="fa fa-newspaper-o" aria-hidden="true"></i></a> </li> {{if !\IPS\Member::loggedIn()->restrict_post and \count( \IPS\Member::loggedIn()->createMenu() )}} <li data-ipsDrawer data-ipsDrawer-drawerElem='#elMobileCreateMenuDrawer'> <a href='#'><i class='fa fa-plus'></i></a> </li> {{endif}} {{if \IPS\Member::loggedIn()->canAccessModule( \IPS\Application\Module::get( 'core', 'search' ) )}} <li class='ipsJS_show'> <a href='{url="app=core&module=search&controller=search" seoTemplate="search"}' title="search"><i class='fa fa-search'></i></a> </li> {{endif}} <li data-ipsDrawer data-ipsDrawer-drawerElem='#elMobileDrawer'> <a href='#' title="navigation"> {{$total = \IPS\Member::loggedIn()->notification_cnt;}} {{if !\IPS\Member::loggedIn()->members_disable_pm and \IPS\Member::loggedIn()->canAccessModule( \IPS\Application\Module::get( 'core', 'messaging' ) )}} {{$total += \IPS\Member::loggedIn()->msg_count_new;}} {{endif}} {{if \IPS\Member::loggedIn()->canAccessModule( \IPS\Application\Module::get( 'core', 'modcp' ) ) and \IPS\Member::loggedIn()->modPermission('can_view_reports')}} {{$total += \IPS\Member::loggedIn()->reportCount();}} {{endif}} {{if $total}} <span class='ipsNotificationCount' data-notificationType='total'>{$total}</span> {{endif}} <i class='fa fa-navicon'></i> </a> </li> </ul> 3. Result Ramsesx, PANL, Genestoy and 2 others 3 2 Link to comment Share on other sites More sharing options...
RocketFoot Posted September 8, 2020 Share Posted September 8, 2020 This is unfortunate! The nav menu icon was perfect on the nav bar in 4.4...wonder why they moved it?? Now it really affects the size of logo you can use! I like to have a little more up top for branding so I am not a fan of the new 4.5 mobile nav icon! I also like to run default theme with as little modification as possible to make updates easier! Link to comment Share on other sites More sharing options...
RunInRed Posted September 10, 2020 Share Posted September 10, 2020 On 9/7/2020 at 3:40 PM, Adlago said: On my site I did the following: 1. I removed a code for template "mobileNavigationIcon" from a global template. 2. Template "mobileNavBar" I edited by adding a hamburger menu code, before </ul>, or now total code this template is: <ul id='elMobileNav' class='ipsResponsive_hideDesktop' data-controller='core.front.core.mobileNav'> {{if \count( \IPS\Output::i()->breadcrumb )}} {{if \count( \IPS\Output::i()->breadcrumb ) == 1}} <li id='elMobileBreadcrumb'> <a href='{setting="base_url"}'> <span>{lang="home"}</span> </a> </li> {{else}} {{$i = 0;}} {{foreach \IPS\Output::i()->breadcrumb as $k => $b}} {{if $i + 2 == \count( \IPS\Output::i()->breadcrumb )}} <li id='elMobileBreadcrumb'> <a href='{$b[0]}'> <span>{$b[1]}</span> </a> </li> {{endif}} {{$i++;}} {{endforeach}} {{endif}} {{endif}} {{$defaultStream = \IPS\core\Stream::defaultStream();}} <li {{if !\IPS\Member::loggedIn()->canAccessModule( \IPS\Application\Module::get( 'core', 'discover' ) ) }}class='ipsHide'{{endif}}> <a data-action="defaultStream" href='{{if $defaultStream}}{$defaultStream->url()}{{else}}{url="app=core&module=discover&controller=streams" seoTemplate="discover_all"}{{endif}}' title="streams"><i class="fa fa-newspaper-o" aria-hidden="true"></i></a> </li> {{if !\IPS\Member::loggedIn()->restrict_post and \count( \IPS\Member::loggedIn()->createMenu() )}} <li data-ipsDrawer data-ipsDrawer-drawerElem='#elMobileCreateMenuDrawer'> <a href='#'><i class='fa fa-plus'></i></a> </li> {{endif}} {{if \IPS\Member::loggedIn()->canAccessModule( \IPS\Application\Module::get( 'core', 'search' ) )}} <li class='ipsJS_show'> <a href='{url="app=core&module=search&controller=search" seoTemplate="search"}' title="search"><i class='fa fa-search'></i></a> </li> {{endif}} <li data-ipsDrawer data-ipsDrawer-drawerElem='#elMobileDrawer'> <a href='#' title="navigation"> {{$total = \IPS\Member::loggedIn()->notification_cnt;}} {{if !\IPS\Member::loggedIn()->members_disable_pm and \IPS\Member::loggedIn()->canAccessModule( \IPS\Application\Module::get( 'core', 'messaging' ) )}} {{$total += \IPS\Member::loggedIn()->msg_count_new;}} {{endif}} {{if \IPS\Member::loggedIn()->canAccessModule( \IPS\Application\Module::get( 'core', 'modcp' ) ) and \IPS\Member::loggedIn()->modPermission('can_view_reports')}} {{$total += \IPS\Member::loggedIn()->reportCount();}} {{endif}} {{if $total}} <span class='ipsNotificationCount' data-notificationType='total'>{$total}</span> {{endif}} <i class='fa fa-navicon'></i> </a> </li> </ul> 3. Result Thanks! Dumb question ... how do you change the fonts / background colors in the mobile menu? When I click through, the notifications and messages icons are white and can't be seen b/c the background is white as well. Link to comment Share on other sites More sharing options...
Nehaj Posted September 10, 2020 Share Posted September 10, 2020 On 9/7/2020 at 9:40 PM, Adlago said: On my site I did the following: 1. I removed a code for template "mobileNavigationIcon" from a global template. 2. Template "mobileNavBar" I edited by adding a hamburger menu code, before </ul>, or now total code this template is: <ul id='elMobileNav' class='ipsResponsive_hideDesktop' data-controller='core.front.core.mobileNav'> {{if \count( \IPS\Output::i()->breadcrumb )}} {{if \count( \IPS\Output::i()->breadcrumb ) == 1}} <li id='elMobileBreadcrumb'> <a href='{setting="base_url"}'> <span>{lang="home"}</span> </a> </li> {{else}} {{$i = 0;}} {{foreach \IPS\Output::i()->breadcrumb as $k => $b}} {{if $i + 2 == \count( \IPS\Output::i()->breadcrumb )}} <li id='elMobileBreadcrumb'> <a href='{$b[0]}'> <span>{$b[1]}</span> </a> </li> {{endif}} {{$i++;}} {{endforeach}} {{endif}} {{endif}} {{$defaultStream = \IPS\core\Stream::defaultStream();}} <li {{if !\IPS\Member::loggedIn()->canAccessModule( \IPS\Application\Module::get( 'core', 'discover' ) ) }}class='ipsHide'{{endif}}> <a data-action="defaultStream" href='{{if $defaultStream}}{$defaultStream->url()}{{else}}{url="app=core&module=discover&controller=streams" seoTemplate="discover_all"}{{endif}}' title="streams"><i class="fa fa-newspaper-o" aria-hidden="true"></i></a> </li> {{if !\IPS\Member::loggedIn()->restrict_post and \count( \IPS\Member::loggedIn()->createMenu() )}} <li data-ipsDrawer data-ipsDrawer-drawerElem='#elMobileCreateMenuDrawer'> <a href='#'><i class='fa fa-plus'></i></a> </li> {{endif}} {{if \IPS\Member::loggedIn()->canAccessModule( \IPS\Application\Module::get( 'core', 'search' ) )}} <li class='ipsJS_show'> <a href='{url="app=core&module=search&controller=search" seoTemplate="search"}' title="search"><i class='fa fa-search'></i></a> </li> {{endif}} <li data-ipsDrawer data-ipsDrawer-drawerElem='#elMobileDrawer'> <a href='#' title="navigation"> {{$total = \IPS\Member::loggedIn()->notification_cnt;}} {{if !\IPS\Member::loggedIn()->members_disable_pm and \IPS\Member::loggedIn()->canAccessModule( \IPS\Application\Module::get( 'core', 'messaging' ) )}} {{$total += \IPS\Member::loggedIn()->msg_count_new;}} {{endif}} {{if \IPS\Member::loggedIn()->canAccessModule( \IPS\Application\Module::get( 'core', 'modcp' ) ) and \IPS\Member::loggedIn()->modPermission('can_view_reports')}} {{$total += \IPS\Member::loggedIn()->reportCount();}} {{endif}} {{if $total}} <span class='ipsNotificationCount' data-notificationType='total'>{$total}</span> {{endif}} <i class='fa fa-navicon'></i> </a> </li> </ul> 3. Result Can you ELI5 me this, because I don't understand what I have to do? What do I have to edit and where? And what is happening @bfarber ? Do we have to manually add menu icons or is this a glitch or something? Link to comment Share on other sites More sharing options...
Adlago Posted September 10, 2020 Share Posted September 10, 2020 5 minutes ago, Nehaj said: Can you ELI5 me this, because I don't understand what I have to do? What do I have to edit and where? 1. Open for edit your global template. Find and remove this code {template="mobileNavigationIcon" app="core" group="global" params=""} 2. Open for edit template "mobileNavBar" Copy the code I specified in my previous post, and replace the contents of the template with it. Nehaj and Ramsesx 2 Link to comment Share on other sites More sharing options...
AudiSport-Ibérica Club Posted September 11, 2020 Share Posted September 11, 2020 On 9/7/2020 at 9:40 PM, Adlago said: On my site I did the following: 1. I removed a code for template "mobileNavigationIcon" from a global template. 2. Template "mobileNavBar" I edited by adding a hamburger menu code, before </ul>, or now total code this template is: <ul id='elMobileNav' class='ipsResponsive_hideDesktop' data-controller='core.front.core.mobileNav'> {{if \count( \IPS\Output::i()->breadcrumb )}} {{if \count( \IPS\Output::i()->breadcrumb ) == 1}} <li id='elMobileBreadcrumb'> <a href='{setting="base_url"}'> <span>{lang="home"}</span> </a> </li> {{else}} {{$i = 0;}} {{foreach \IPS\Output::i()->breadcrumb as $k => $b}} {{if $i + 2 == \count( \IPS\Output::i()->breadcrumb )}} <li id='elMobileBreadcrumb'> <a href='{$b[0]}'> <span>{$b[1]}</span> </a> </li> {{endif}} {{$i++;}} {{endforeach}} {{endif}} {{endif}} {{$defaultStream = \IPS\core\Stream::defaultStream();}} <li {{if !\IPS\Member::loggedIn()->canAccessModule( \IPS\Application\Module::get( 'core', 'discover' ) ) }}class='ipsHide'{{endif}}> <a data-action="defaultStream" href='{{if $defaultStream}}{$defaultStream->url()}{{else}}{url="app=core&module=discover&controller=streams" seoTemplate="discover_all"}{{endif}}' title="streams"><i class="fa fa-newspaper-o" aria-hidden="true"></i></a> </li> {{if !\IPS\Member::loggedIn()->restrict_post and \count( \IPS\Member::loggedIn()->createMenu() )}} <li data-ipsDrawer data-ipsDrawer-drawerElem='#elMobileCreateMenuDrawer'> <a href='#'><i class='fa fa-plus'></i></a> </li> {{endif}} {{if \IPS\Member::loggedIn()->canAccessModule( \IPS\Application\Module::get( 'core', 'search' ) )}} <li class='ipsJS_show'> <a href='{url="app=core&module=search&controller=search" seoTemplate="search"}' title="search"><i class='fa fa-search'></i></a> </li> {{endif}} <li data-ipsDrawer data-ipsDrawer-drawerElem='#elMobileDrawer'> <a href='#' title="navigation"> {{$total = \IPS\Member::loggedIn()->notification_cnt;}} {{if !\IPS\Member::loggedIn()->members_disable_pm and \IPS\Member::loggedIn()->canAccessModule( \IPS\Application\Module::get( 'core', 'messaging' ) )}} {{$total += \IPS\Member::loggedIn()->msg_count_new;}} {{endif}} {{if \IPS\Member::loggedIn()->canAccessModule( \IPS\Application\Module::get( 'core', 'modcp' ) ) and \IPS\Member::loggedIn()->modPermission('can_view_reports')}} {{$total += \IPS\Member::loggedIn()->reportCount();}} {{endif}} {{if $total}} <span class='ipsNotificationCount' data-notificationType='total'>{$total}</span> {{endif}} <i class='fa fa-navicon'></i> </a> </li> </ul> 3. Result Working!! Thanks!! Link to comment Share on other sites More sharing options...
RunInRed Posted September 13, 2020 Share Posted September 13, 2020 On 9/9/2020 at 11:48 PM, RunInRed said: Thanks! Dumb question ... how do you change the fonts / background colors in the mobile menu? When I click through, the notifications and messages icons are white and can't be seen b/c the background is white as well. Any help here? Link to comment Share on other sites More sharing options...
Nehaj Posted September 13, 2020 Share Posted September 13, 2020 On 9/10/2020 at 11:51 PM, Adlago said: 1. Open for edit your global template. Find and remove this code {template="mobileNavigationIcon" app="core" group="global" params=""} 2. Open for edit template "mobileNavBar" Copy the code I specified in my previous post, and replace the contents of the template with it. I only have {template="mobileNavigation" if="theme.responsive" app="core" group="global" params=""} Can @bfarber or someone explain me, why do I have to edit template, to have a functional mobile web? Link to comment Share on other sites More sharing options...
Adlago Posted September 13, 2020 Share Posted September 13, 2020 9 minutes ago, Nehaj said: I only have {template="mobileNavigation" if="theme.responsive" app="core" group="global" params=""} This is the contents of the "header" in a global template in version 4.5. Check carefully. Also the default IPS theme. Link to comment Share on other sites More sharing options...
Nehaj Posted September 13, 2020 Share Posted September 13, 2020 4 minutes ago, Adlago said: This is the contents of the "header" in a global template in version 4.5. Check carefully. Also the default IPS theme. Yes, IPS theme, 4.5.2: <header> <div class='ipsLayout_container'> {template="logo" app="core" group="global" params=""} {{if !\in_array('ipsLayout_minimal', \IPS\Output::i()->bodyClasses )}}{template="userBar" app="core" group="global" params=""}{{endif}} </div> </header> Link to comment Share on other sites More sharing options...
Adlago Posted September 13, 2020 Share Posted September 13, 2020 4 minutes ago, Nehaj said: Yes, IPS theme, 4.5.2: <header> <div class='ipsLayout_container'> {template="logo" app="core" group="global" params=""} {{if !\in_array('ipsLayout_minimal', \IPS\Output::i()->bodyClasses )}}{template="userBar" app="core" group="global" params=""}{{endif}} </div> </header> Share a link to your community please - for some tests Link to comment Share on other sites More sharing options...
Nehaj Posted September 13, 2020 Share Posted September 13, 2020 Just now, Adlago said: Share a link to your community please - for some tests https://zeljeznice.net Link to comment Share on other sites More sharing options...
Adlago Posted September 13, 2020 Share Posted September 13, 2020 5 minutes ago, Nehaj said: https://zeljeznice.net Only replace code in template mobileNavigation, from here' Nehaj 1 Link to comment Share on other sites More sharing options...
Nehaj Posted September 13, 2020 Share Posted September 13, 2020 40 minutes ago, Adlago said: Only replace code in template mobileNavigation, from here' Thank you. Is there an official explanation why do we have to do this manually? Link to comment Share on other sites More sharing options...
Recommended Posts