Page Navigation

#Navigation

#Define a navigation tree

For the top navigation and left the basic array looks like this:

return [
    ['label'=>'='],
    ['href'=>'#',          'label'=>'Menu A', 'icon'=>'fa-solid fa-home' ],
    ['href'=>'#',          'label'=>'Menu B', 'icon'=>'fa-solid fa-tv'],
    ['href'=>'#',          'label'=>'Menu C', 'icon'=>'fa-solid fa-truck-pickup', 'class'=>'active',
        'children'=>[
            ['href'=>'#',     'label'=>'FAQ'     , 'icon'=>'fa-solid fa-truck-monster'],
            ['href'=>'#',     'label'=>'Support' , 'icon'=>'fa-solid fa-truck-moving'],
        ]
    ]
];

Specialties For top navigation in thwe 2nd level (below children) define a label value with a single minus character to draw a line: ['label'=>'-']

The hamburger menu is rendered by ['label'=>'=']. Remove this item when you don’t want a left sidebar or it is static.

#Show navigation on top

The top navigation is for the placeholder {{NAVI_TOP}}.

You can use getTopNavigation({array}) to render the navigation items. It creates

• the hamburger menu
• li elements for first level items
• divs for navigation items of 2nd level

$aTopnav=include("./config/navi_top.php");
$aReplace['{{NAVI_TOP}}']=''
    . $renderAdminLTE->addWrapper(
        'nav', ['class'=>'main-header navbar navbar-expand navbar-white navbar-light'],
        $renderAdminLTE->getTopNavigation($aTopnav)
        // add 2nd navbar if needed
    )
    ;

See also https://adminlte.io/docs/3.2/components/main-header.html

#Show navigation on the left

You can use getSidebarNavigation({array}) to render the navigation items. It creates

• li elements for first level items
• if an item has children a nested list will be written. The nanigation item gets a “<” sign on the right.
• A navigation with class “active” will be highlighted
• If the active class is active and has children it will be expanded

$aReplace['{{NAVI_LEFT}}']=''
    . $renderAdminLTE->addWrapper(
        'nav', ['class'=>'mt-2'],
        $renderAdminLTE->getSidebarNavigation($aSidebarNav)
    );

#Navigation hacks

#Sidebar

To render a horizontal line in the sidebar menu, add a navigation item with label ‘-’

$aSidebarNav[]=['href'=>'#', 'label'=>'-'];

In your css file add a rule:

.nav-item hr{color: #505860; border-top: 1px solid; height: 1px; padding: 0; margin: 0; }