I have tumbled around in the rabbit hole, try’d different solutions for my BS5 main navbar with a WordPress Theme.
Have build a extended walker_nav_menu class for wp_nav_menu(), where playing around with start_el or end_lvl functions.
My end_lvl function seems not to get fired or something, as you see in the code below. There should be added an extra element to the list, containing languagebare for switching between 2 languages.
Can you tell me what I’m doing wrong?
Code in functions.php
class BS5_MainMenu extends Walker_Nav_Menu
{
public function start_el(&$output, $data_object, $depth = 0, $args = null, $current_object_id = 0)
{
$item = $data_object; // use more descriptive name for use within this method.
$frontpageID = get_option('page_on_front');
if ($item->post_parent != 0 || $item->ID == $frontpageID) {
return;
}
$itemUrl = get_permalink($item);
$children = $this->getChildren($item->ID);
$_liCssClass = "nav-item";
$_aCssClass = "nav-link";
if (count($children)) {
$_liCssClass .= " dropdown";
$_aCssClass .= " dropdown-toggle";
}
$output .= '<li class="' . $_liCssClass . '">';
if (!empty($itemUrl) && $itemUrl != '#') {
$output .= '<a href="' . $itemUrl . '" class="' . $_aCssClass . '" role="button" data-bs-toggle="dropdown" aria-expanded="false">';
} else {
$output .= '<span>';
}
$output .= $item->post_title;
if (!empty($itemUrl) && $itemUrl != '#') {
$output .= '</a>';
} else {
$output .= '</span>';
}
$output .= $this->renderChildrenDropdownHtml($item->ID);
}
public function end_lvl(&$output, $depth = 0, $args = null)
{
$otherLanguage = $this->get_other_languages()[0];
$output .= '<li class="nav-item mx-4">';
$output .= '<a class="nav-link nav-translate" href="' . $otherLanguage->permalink . '">' . $otherLanguage->res_label . ' <span>' . $otherLanguage->displaylanguage . '</span></a>';
$output .= '</li></ul>';
}
private function get_other_languages()
{
$_all = get_available_languages();
$_other = array();
$_current = get_locale();
foreach ($_all as $result) {
if ($_current == $result) {
continue;
}
$_lang_of_result = explode("_", $result)[0];
$_obj = new stdClass();
$_obj->displaylanguage = Locale::getDisplayLanguage($_lang_of_result, $_lang_of_result);
$_obj->permalink = get_msls_permalink($result);
$_obj->flagurl = get_msls_flag_url($result);
$_obj->res_label = $_lang_of_result == "da" ? "Skift til" : "Switch to";
$_other[] = $_obj;
}
return $_other;
}
private function renderChildrenDropdownHtml($post_id)
{
if (!$post_id) {
return false;
}
$children = $this->getChildren($post_id);
if (!count($children)) {
return false;
}
$html = '<ul class="dropdown-menu">';
foreach ($children as $child) {
$html .= '<li><a class="dropdown-item" href="' . get_permalink($child) . '">' . $child->post_title . '</a></li>';
}
$html .= '</ul>';
return $html;
}
private function getChildren($post_id)
{
if (!$post_id) {
return false;
}
$args = array(
'post_parent' => $post_id,
'post_type' => 'any',
'numberposts' => -1,
'post_status' => 'any'
);
return get_children($args);
}
}
In my parts/header.php
<nav class="navbar navbar-main navbar-expand-lg highlighted" data-bs-theme="dark">
<div class="container-fluid">
<a class="navbar-brand" href="/index.html">
<img src="<?php echo esc_url(get_template_directory_uri() . '/img/logo.svg'); ?>" height="70" />
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#main-navbar"
aria-controls="main-navbar" aria-expanded="false" aria-label="Visning af navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="main-navbar">
<?php
wp_nav_menu([
'theme_location' => 'MainMenu',
'menu_class' => 'navbar-nav ms-auto mb-2 mb-lg-0',
'container' => 'ul',
'walker' => new BS5_MainMenu()
]);
?>
</div>
</div>
</nav>
I have tried different things, found on Google