在 WordPress 菜单中加载整个小部件区域

Question

我想在 WordPress 中创建非常可变的大型菜单。这个想法是使用标准 WP 菜单（register_nav_menus 函数）和新的 Gutenberg 小部件。我创建了一个主菜单和小部件区域“mega-menu-1”。然后我用各种小部件（块）填充这个小部件区域，例如列、图像、段落等。

现在我想将此菜单分配给主菜单中的第一个（或任何其他）项目。我不知道怎么办。我什至没有找到任何教程这样做。有一些解决方案可以在菜单项“下”加载小部件，例如thisone。但它只需要一个特定的小部件并将其加载到菜单项下。但我需要加载整个小部件区域。

我想可以通过 wp_nav_menu() 函数中的 walker 参数来完成，但我仍然需要被推向正确的方向:)。

请问有什么办法可以实现这个吗？

Answer 1

首先我们需要扩展Walker_Nav_Menu。 既然你想进入任何你想要的项目，我建议使用类来触发。

class Custom_Walker_Nav_Menu extends Walker_Nav_Menu {
    function start_el( &$output, $item, $depth = 0, $args = null, $id = 0 ) {
        // Check if the menu item has a specific class
        if (in_array('widget-area', $item->classes)) {
            
            ob_start();
            dynamic_sidebar('mega-menu-1');
            $sidebar_output = ob_get_clean();
            
            $output .= $sidebar_output;
        }
        
        parent::start_el($output, $item, $depth, $args, $id);
    }
}

在您的菜单中，您必须添加

walker

参数才能使用此

Custom_Walker_Nav_Menu

.

wp_nav_menu(array(
    'theme_location' => 'your_menu_location',
    'walker' => new Custom_Walker_Nav_Menu(),
));