html - Bootstrap 下拉自定义切换未在 Wordpress 中打开

Question

我有一个自定义下拉切换开关，可以显示元素列表。这在我的静态 HTML 网站上正常工作，但是在转换为 Wordpress 时，切换不再有效。它应该是这样的:

在 Wordpress 站点上单击插入符号时，下拉菜单不会出现。有些事情很奇怪，因为我直接从 Bootstrap 组件页面放置了默认下拉菜单，并且下拉菜单按钮也没有正确显示。

这是我的 HTML:

<div class="playlist-select">
        <div class="discovery-mode">
                DISCOVERY MODE
        </div>
        <div class="playlist-choice">
            <button class="btn btn-default dropdown-toggle playlist-select-dropdown" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
                    FRESH FINDS
                    <span class="caret"></span>
            </button>
            <ul class="dropdown-menu select-dropdown" aria-labelledby="dropdownMenu1">
                <li><a href="#">Action</a></li>
                <li><a href="#">Another action</a></li>
                <li><a href="#">Something else here</a></li>
            </ul>
        </div>
    </div>

Answer 1

您必须将 Bootstrap 排入您网站的页脚才能使其正常工作:

add_action('wp_enqueue_scripts','load_bootstrap');
function load_bootstrap() {
wp_enqueue_script('bootstrap', //path to bootstrap or cdn here, array(), '', true);
}

主题: wp_enqueue_script('bootstrap', get_template_directory_uri(). '/assets/js/bootstrap.min.js', array(), '', true);

子主题:wp_enqueue_script('bootstrap', get_stylesheet_directory_uri() . '/assets/js/bootstrap.min.js', array(), '', true);

该代码的真实部分加载页脚中的 js，以便它在 dom 准备好后进入并应用。