如何在 wordpress 主題下正確鏈接引導腳本？

Question

我正在使用 Bootstrap 5 創建 WP 主題，但遇到了一個我無法解決的問題。 我想將引導程序文件直接放入主題文件中。 我已成功使用.css文件完成此操作，但我在使用.js文件時遇到問題。 你們中有人可能知道我做錯了什么，比如navbar-toggler類的元素不起作用嗎？ 通過包含<script src="_TEMP0_@5.0.0-beta1/dist/js/bootstrap.bundle.min.js" integrity="sha384-ygbV9kiqUc6oa4msXn9868pTtWMgiQaeYH7/t7LECLbyPA2x65Kgf80OJFdroafW" crossorigin="anonymous"></script>文件使用 CDN 的主題一切正常。 當我手動執行時，它不再有效。

這是我的functions.php文件的摘錄：

function imago_theme_scripts() {
    wp_enqueue_style( 'google-fonts', 'https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;700;900&display=swap" rel="stylesheet', array(), null );

    wp_enqueue_style( 'imago-theme-style', get_stylesheet_uri(), array('imago-bootstrap-css'), '1.0.0' );

    wp_style_add_data( 'imago-theme-style', 'rtl', 'replace' );

    wp_enqueue_script( 'imago-bootstrap-popper', 'https://cdn.jsdelivr.net/npm/@popperjs/core@2.5.4/dist/umd/popper.min.js', array(), null, true );

    wp_enqueue_script( 'imago-bootstrap-js', get_template_directory_uri() . '/assets/bootstrap/js/bootstrap.min.js', array(), null, true );

    //wp_enqueue_script( 'imago-bootstrap-js', 'https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-alpha3/dist/js/bootstrap.bundle.min.js', array(), null, true );

}
add_action( 'wp_enqueue_scripts', 'imago_theme_scripts' );

我仍然通過將popper.min.js和bootstrap.min.js腳本替換為以下內容來嘗試這種方式wp_enqueue_script( 'imago-bootstrap-js', get_template_directory_uri(). '/assets/bootstrap/js/bootstrap.bundle.min.js', array(), null, true ); ，但不幸的是，這也沒有改變任何東西。 移動版本中的導航仍然不起作用。

目錄結構保存正確。 根據文檔，在第一個配置中，您可以看到“popper.min.js”文件插入在“bootstrap.min.js”文件之前。

Answer 1

它們可能無法正常工作，因為您沒有將 jQuery 包含在依賴項中。

wp_enqueue_script( 'imago-bootstrap-js', get_template_directory_uri() . '/assets/bootstrap/js/bootstrap.min.js', array('jquery'), null, true );

除此之外，它們正在加載，您的導航控制台指示... ...控制台中是否有任何錯誤？