WordPress Navwalker не открывается на мобильном - PullRequest
0 голосов
/ 28 марта 2020

Я реализовал WP_navwalker в моем проекте, но он не открывается на мобильном телефоне. Я выложу код ниже. Если я что-то упустил, пожалуйста, дайте мне знать. Я ценю, если кто-то может помочь мне выяснить, чего мне не хватает. Спасибо.

Я использую последнюю версию navwalker из https://github.com/wp-bootstrap/wp-bootstrap-navwalker и следую различным инструкциям к букве, но просто не могу заставить кнопку переключиться, чтобы открыть меню. Еще раз спасибо за вашу помощь в этом.

enter image description here

функций. php

/**
 * Register Custom Navigation Walker
 */
function register_navwalker(){
    require_once get_template_directory() . '/class-wp-bootstrap-navwalker.php';
}
add_action( 'after_setup_theme', 'register_navwalker' );

register_nav_menus( array(
    'primary' => __( 'Primary Menu', 'rrspark' ),
) );



 function html5blank_header_scripts()
{
    if ($GLOBALS['pagenow'] != 'wp-login.php' && !is_admin()) {

        wp_register_script('conditionizr', get_template_directory_uri() . '/js/lib/conditionizr-4.3.0.min.js', array(), '4.3.0'); // Conditionizr
        wp_enqueue_script('conditionizr'); // Enqueue it!

        wp_register_script('modernizr', get_template_directory_uri() . '/js/lib/modernizr-2.7.1.min.js', array(), '2.7.1'); // Modernizr
        wp_enqueue_script('modernizr'); // Enqueue it!

        wp_register_script('html5blankscripts', get_template_directory_uri() . '/js/scripts.js', array('jquery'), '1.0.0'); // Custom scripts
        wp_enqueue_script('html5blankscripts'); // Enqueue it!
    }
}

// Load HTML5 Blank conditional scripts
function html5blank_conditional_scripts()
{
    if (is_page('pagenamehere')) {
        wp_register_script('scriptname', get_template_directory_uri() . '/js/scriptname.js', array('jquery'), '1.0.0'); // Conditional script(s)
        wp_enqueue_script('scriptname'); // Enqueue it!
    }
}

// Load HTML5 Blank styles
function html5blank_styles()
{
    wp_register_style('normalize', get_template_directory_uri() . '/normalize.css', array(), '1.0', 'all');
    wp_enqueue_style('normalize'); // Enqueue it!

    wp_register_style('html5blank', get_template_directory_uri() . '/style.css', array(), '1.0', 'all');
    wp_enqueue_style('html5blank'); // Enqueue it!

    wp_register_style('montserrat', 'https://fonts.googleapis.com/css?family=Montserrat:400,700', array(), '1.0', 'all');
    wp_enqueue_style('montserrat'); // Enqueue it!

    wp_register_style('kaushan', 'https://fonts.googleapis.com/css?family=Kaushan+Script', array(), '1.0', 'all');
    wp_enqueue_style('kaushan'); // Enqueue it!

    wp_register_style('droid', 'https://fonts.googleapis.com/css?family=Droid+Serif:400,700,400italic,700italic', array(), '1.0', 'all');
    wp_enqueue_style('droid'); // Enqueue it!

    wp_register_style('roboto', 'https://fonts.googleapis.com/css?family=Roboto+Slab:400,100,300,700', array(), '1.0', 'all');
    wp_enqueue_style('roboto'); // Enqueue it!

    // wp_register_style('agencystyles', get_template_directory_uri() . '/css/agency.css', array(), '1.0', 'all');
    // wp_enqueue_style('agencystyles'); 

    wp_register_style('customstyles', get_template_directory_uri() . '/css/style.css', array(), '1.0', 'all');
    wp_enqueue_style('customstyles'); 
    // Enqueue it!

}

header. php

<nav class="navbar navbar-expand-md navbar-dark navbar-expand-md fixed-top" id="mainNav" role="navigation">
    <div class="container">
        <!-- Brand and toggle get grouped for better mobile display -->
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-controls="bs-example-navbar-collapse-1" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
        </button>

        <a href="/rrspark">
        <img src="<?php echo get_template_directory_uri(); ?>/img/homelogo.png" alt="home-brand-logo" style="width: 125px;">
        </a>
        <div class="collapse navbar-collapse" id="navbar-content">
        <?php
            wp_nav_menu( array(
                'theme_location'    => 'primary',
                'depth'             => 2,
                'container'         => 'div',
                'container_class'   => 'collapse navbar-collapse',
                'container_id'      => 'bs-example-navbar-collapse-1',
                'menu_class'        => 'navbar-nav ml-auto',
                'fallback_cb'       => 'WP_Bootstrap_Navwalker::fallback',
                'walker'            => new WP_Bootstrap_Navwalker(),
            ) );
            ?>
        </div>
        </div>
</nav>

до закрывающий тег в нижнем колонтитуле. php

<?php wp_footer(); ?>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
        <script src="<?php bloginfo('template_url') ?> . /js/bootstrap.js"></script>

Редактировать, вносить изменения в функции. php

/*------------------------------------*\
    Functions
\*------------------------------------*/

/**
 * Register Custom Navigation Walker
 */
function register_navwalker(){
    require_once get_template_directory() . '/class-wp-bootstrap-navwalker.php';
}
add_action( 'after_setup_theme', 'register_navwalker' );

register_nav_menus( array(
    'primary' => __( 'Primary Menu', 'rrspark' ),
) );


// Load HTML5 Blank scripts (header.php)
function html5blank_header_scripts() {
    if ( $GLOBALS['pagenow'] != 'wp-login.php' && ! is_admin() ) {
        if ( HTML5_DEBUG ) {
            // jQuery
            wp_deregister_script( 'jquery' );
            wp_register_script( 'jquery', get_template_directory_uri() . '/js/lib/jquery.js', array(), '1.11.1' );

            // Conditionizr
            wp_register_script( 'conditionizr', get_template_directory_uri() . '/js/lib/conditionizr-4.3.0.min.js', array(), '4.3.0' );

            // Modernizr
            wp_register_script( 'modernizr', get_template_directory_uri() . '/js/lib/modernizr.js', array(), '2.8.3' );

            // Custom scripts
            wp_register_script(
                'html5blankscripts',
                get_template_directory_uri() . '/js/scripts.js',
                array(
                    'conditionizr',
                    'modernizr',
                    'jquery'
                ),
                '1.0.0' );

            // Enqueue Scripts
            wp_enqueue_script( 'html5blankscripts' );

        // If production
        } else {
            // Scripts minify
            wp_register_script( 'html5blankscripts-min', get_template_directory_uri() . '/js/scripts.js', array(), '1.0.0' );
            // Enqueue Scripts
            wp_enqueue_script( 'html5blankscripts-min' );
        }
    }
}



// Load HTML5 Blank conditional scripts
function html5blank_conditional_scripts()
{
    if (is_page('pagenamehere')) {
        wp_register_script('scriptname', get_template_directory_uri() . '/js/scriptname.js', array('jquery'), '1.0.0'); // Conditional script(s)
        wp_enqueue_script('scriptname'); // Enqueue it!
    }
}

// Load HTML5 Blank styles
function html5blank_styles()
{
    wp_register_style('normalize', get_template_directory_uri() . '/normalize.css', array(), '1.0', 'all');
    wp_enqueue_style('normalize'); // Enqueue it!

    wp_register_style('html5blank', get_template_directory_uri() . '/style.css', array(), '1.0', 'all');
    wp_enqueue_style('html5blank'); // Enqueue it!

    wp_register_style('montserrat', 'https://fonts.googleapis.com/css?family=Montserrat:400,700', array(), '1.0', 'all');
    wp_enqueue_style('montserrat'); // Enqueue it!

    wp_register_style('kaushan', 'https://fonts.googleapis.com/css?family=Kaushan+Script', array(), '1.0', 'all');
    wp_enqueue_style('kaushan'); // Enqueue it!

    wp_register_style('droid', 'https://fonts.googleapis.com/css?family=Droid+Serif:400,700,400italic,700italic', array(), '1.0', 'all');
    wp_enqueue_style('droid'); // Enqueue it!

    wp_register_style('roboto', 'https://fonts.googleapis.com/css?family=Roboto+Slab:400,100,300,700', array(), '1.0', 'all');
    wp_enqueue_style('roboto'); // Enqueue it!

    wp_register_style('customstyles', get_template_directory_uri() . '/css/style.css', array(), '1.0', 'all');
    wp_enqueue_style('customstyles'); 
    // Enqueue it!

}

add_action( 'wp_enqueue_scripts', 'prefix_enqueue_awesome' );
/**
 * Register and load font awesome CSS files using a CDN.
 */
function prefix_enqueue_awesome() {
    wp_enqueue_style('font-awesome-5', 'https://use.fontawesome.com/releases/v5.3.0/css/all.css', array(), '5.3.0');
}

// Register HTML5 Blank Navigation
function register_html5_menu()
{
    register_nav_menus(array( // Using array to specify more menus if needed
        'header-menu' => __('Header Menu', 'html5blank'), // Main Navigation
        'sidebar-menu' => __('Sidebar Menu', 'html5blank'), // Sidebar Navigation
        'extra-menu' => __('Extra Menu', 'html5blank') // Extra Navigation if needed (duplicate as many as you need!)
    ));
}

add_action( 'wp_enqueue_scripts', 'custom_load_bootstrap' );
/**
 * Enqueue Bootstrap.
 */
function custom_load_bootstrap() {
    wp_enqueue_style( 'bootstrap-css', '//maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css' );

    wp_enqueue_script( 'bootstrap-js', '//maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js', array( 'jquery' ), true );
}

Второе редактирование с выводом инструментов разработчика

Header output

Footer Output

После удаления указанного мне div я получил панель навигации для расширения. Проблема в том, что навигационная панель открывается на мобильном телефоне по умолчанию и не закрывается. Пожалуйста, смотрите изображение. open nav

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...