0

我使用 WP 5.3 27 子主题，但我不想编辑模板，所以我在顶部导航菜单中添加了一个需要的第二个（实际上它成为显示顺序中的第一个）div 换行部分，具有以下功能。问题是我在此之后失去了菜单的固定位置（现在不再粘了）。如何补救？我玩过 CSS 代码，但没有成功。讨论中的站点在这里。

function my_navigation_top( $slug, $name ) {
    if( $name == 'top' ) { ?>
        --- some content here ---
        </div> <!-- wrap closed -->
        <div class="wrap"> <!-- wrap opened -->
    <?php }
}
add_action( 'get_template_part_template-parts/navigation/navigation', 'my_navigation_top', 10, 2 );

更新

如果不是第二个 div 包装部分，而是在包装内添加一个简单的 div 部分，则不会出现问题。

4

1 回答 1

1

我正在查看设置固定类的脚本文件（向下滚动时使顶部导航变粘）。（文件：twentyseventeen/assets/js/global.js）如果导航的高度太高，似乎没有设置固定类：

    // Set properties of navigation.
    function setNavProps() {
        navigationHeight      = $navigation.height();
        navigationOuterHeight = $navigation.outerHeight();
        navPadding            = parseFloat( $navWrap.css( 'padding-top' ) ) * 2;
        navMenuItemHeight     = $navMenuItem.outerHeight() * 2;
        idealNavHeight        = navPadding + navMenuItemHeight;
        navIsNotTooTall       = navigationHeight <= idealNavHeight;
    }

    // Make navigation 'stick'.
    function adjustScrollClass() {

        // Make sure we're not on a mobile screen.
        if ( 'none' === $menuToggle.css( 'display' ) ) {

            // Make sure the nav isn't taller than two rows.
            if ( navIsNotTooTall ) {

                // When there's a custom header image or video, the header offset includes the height of the navigation.
                if ( isFrontPage && ( $body.hasClass( 'has-header-image' ) || $body.hasClass( 'has-header-video' ) ) ) {
                    headerOffset = $customHeader.innerHeight() - navigationOuterHeight;
                } else {
                    headerOffset = $customHeader.innerHeight();
                }

                // If the scroll is more than the custom header, set the fixed class.
                if ( $( window ).scrollTop() >= headerOffset ) {
                    $navigation.addClass( navigationFixedClass );
                } else {
                    $navigation.removeClass( navigationFixedClass );
                }

            } else {

                // Remove 'fixed' class if nav is taller than two rows.
                $navigation.removeClass( navigationFixedClass );
            }
        }
    }

我不完全确定解决方案是什么。一个想法（这并不理想）是调整 .js 文件并放在true( ) 之间而不是navIsNotTooTall在这一行上：

if ( navIsNotTooTall ) {

如果您想将此更改添加到子主题，而不是主主题：将更改后的 global.js 文件放在您的子主题目录中：twentyseventeen-child/assets/js/global.js

然后将其添加到functions.php子主题中：

add_action( 'wp_enqueue_scripts', 'override_globaljs_script', 100 );
function override_globaljs_script()
{
    wp_dequeue_script( 'twentyseventeen-global' );
    wp_deregister_script( 'twentyseventeen-global' );

    wp_enqueue_script( 'twentyseventeen-global-child', get_stylesheet_directory_uri() . '/assets/js/global.js' );
}

它将注销主主题 global.js 并将其注册为子主题。就我而言，这是“正确”的 Wordpress 方式。

于 2019-11-19T18:59:56.867 回答