WordPress : le comportement du menu n’est pas celui attendu

J’essaie de développer l’un de ces menus de navigation qui en a un au-dessus de l’autre comme suit :

Je ne sais pas si le problème vient de la façon dont j’ai codé mon header.php :

<!-- HEADER ========================================================================================== -->
    <header class="site-header" role="banner">
        <!-- NAVBAR ====================================================================================== -->
        <div class="navbar navbar-default navbar-fixed-top" role="navigation">
                <div class="container">
                    <div class="navbar-header">
                        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="navbar-collapse">
                            <span class="sr-only">Toggle navigation</span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                        </button>
                    </div><!-- navbar-header -->

                    <!-- If the menu (WP Admin area) is not set, then the "menu_class" is applied to "container". In other words, it overwrites the "container-class". -->
                    <?php
                        wp_nav_menu(array(

                            'menu'      => 'topnav'
                        ));
                    ?>

                </div><!-- container -->
            </div><!-- navbar -->
        <div class="navbar-wrapper">
            <div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
                <div class="container">
                    <div class="navbar-header">
                        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="navbar-collapse">
                            <span class="sr-only">Toggle navigation</span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                        </button>

                        <a class="navbar-brand" href="/"><img src="<?php bloginfo('stylesheet_directory'); ?>/assets/img/Logo.png" alt="UpAbility"></a>
                    </div><!-- navbar-header -->

                    <!-- If the menu (WP Admin area) is not set, then the "menu_class" is applied to "container". In other words, it overwrites the "container-class". -->
                    <?php
                        wp_nav_menu(array(

                            'theme_location'    => 'primary',
                            'container'         => 'nav',
                            'container_class'   => 'navbar-collapse collapse',
                            'menu_class'        => 'nav navbar-nav navbar-right'
                        ));
                    ?>

                </div><!-- container -->
            </div><!-- navbar -->

Ou si le problème vient de mon functions.php :

<?php
/**
 * UpAbility functions and definitions
 *
 * @link https://developer.wordpress.org/themes/basics/theme-functions/
 *
 * @package UpAbility
 */

if ( ! function_exists( 'upability_setup' ) ) :
/**
 * Sets up theme defaults and registers support for various WordPress features.
 *
 * Note that this function is hooked into the after_setup_theme hook, which
 * runs before the init hook. The init hook is too late for some features, such
 * as indicating support for post thumbnails.
 */
function upability_setup() {
    /*
     * Make theme available for translation.
     * Translations can be filed in the /languages/ directory.
     * If you're building a theme based on UpAbility, use a find and replace
     * to change 'upability' to the name of your theme in all the template files.
     */
    load_theme_textdomain( 'upability', get_template_directory() . '/languages' );

    // Add default posts and comments RSS feed links to head.
    add_theme_support( 'automatic-feed-links' );

    /*
     * Let WordPress manage the document title.
     * By adding theme support, we declare that this theme does not use a
     * hard-coded <title> tag in the document head, and expect WordPress to
     * provide it for us.
     */
    add_theme_support( 'title-tag' );

    /*
     * Enable support for Post Thumbnails on posts and pages.
     *
     * @link https://developer.wordpress.org/themes/functionality/featured-images-post-thumbnails/
     */
    add_theme_support( 'post-thumbnails' );

    // This theme uses wp_nav_menu() in one location.
    register_nav_menus( array(
        'menu-1' => esc_html__( 'Primary', 'upability' ),
    ) );

    /*
     * Switch default core markup for search form, comment form, and comments
     * to output valid HTML5.
     */
    add_theme_support( 'html5', array(
        'search-form',
        'comment-form',
        'comment-list',
        'gallery',
        'caption',
    ) );

    // Set up the WordPress core custom background feature.
    add_theme_support( 'custom-background', apply_filters( 'upability_custom_background_args', array(
        'default-color' => 'ffffff',
        'default-image' => '',
    ) ) );

    // Add theme support for selective refresh for widgets.
    add_theme_support( 'customize-selective-refresh-widgets' );
}
endif;
add_action( 'after_setup_theme', 'upability_setup' );

function upability_register_custom_menu() {
    register_nav_menu('topnav', __('Top Nav'));
}
add_action('init', 'upability_register_custom_menu');

Ça ne s’annonce pas bien par contre :

Il est difficile de poser cette question quand il ne semble pas y avoir de nom pour mon problème. Par exemple, si j’avais un problème avec un menu collant, je dirais simplement cela. Mais aussi courant qu’il soit d’avoir le type de menu de navigation où il semble être l’un au-dessus de l’autre, la documentation sur la façon de le développer dans WordPress est rare.

Il y a donc deux problèmes ici: 1. Je veux que le menu du bas soit par défaut et ne bouge pas et que le menu du haut avec BLOG et LOGIN soit inversé et disparaisse lorsque l’utilisateur commence à faire défiler.

2. Lorsque je vais dans wp-admin et crée le menu pour une barre de navigation, il crée le menu pour les deux barres de navigation.

Mes excuses si ce n’est pas plus clair, A. ce n’est pas clair pour moi, B. Je suis franchement épuisé, j’ai travaillé dessus toute la journée et toute la nuit.

Solution n°1 trouvée

La première chose que je ferais serait d’enregistrer 2 menus,

<?php function register_my_menus() {register_nav_menus(array('primary' => __( 'Primary Menu' ),'topnav' => __( 'Top Nav Menu' ) ) ); } add_action( 'init', 'register_my_menus' ); ?>

deuxièmement dans le panneau de menu wordpress, je créerais deux menus et attribuerais chacun à un emplacement d’affichage Troisièmement, j’afficherais les menus en utilisant

<!-- HEADER ========================================================================================== -->
<header class="site-header" role="banner">
    <!-- NAVBAR ====================================================================================== -->
    <div class="navbar navbar-default" role="navigation">
            <div class="container">
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="navbar-collapse">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                </div><!-- navbar-header -->

                <!-- If the menu (WP Admin area) is not set, then the "menu_class" is applied to "container". In other words, it overwrites the "container-class". -->
                <?php wp_nav_menu( array( 'theme_location' => 'topnav' ) ); ?>

            </div><!-- container -->
        </div><!-- navbar -->
    <div class="navbar-wrapper">
        <div class="navbar navbar-inverse" role="navigation">
            <div class="container">
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="navbar-collapse">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>

                    <a class="navbar-brand" href="/"><img src="<?php bloginfo('stylesheet_directory'); ?>/assets/img/Logo.png" alt="UpAbility"></a>
                </div><!-- navbar-header -->

                <!-- If the menu (WP Admin area) is not set, then the "menu_class" is applied to "container". In other words, it overwrites the "container-class". -->
                <?php
                    wp_nav_menu(array(

                        'theme_location'    => 'primary',
                        'container'         => 'nav',
                        'container_class'   => 'navbar-collapse collapse',
                        'menu_class'        => 'nav navbar-nav navbar-right'
                    ));
                ?>

            </div><!-- container -->
        </div><!-- navbar -->
        </div><!-- navbar-wrapper --></header>