WordPress-将js问题入队-页面已损坏,没有错误

时间:2020-06-18 作者:Pbalazs89

我正在尝试将主题迁移到Wordpress。像往常一样,我导入了所有CSS,现在我转到JS部分。

这就是我的功能。php外观:

    <?php

function greennectar_files() {
  
// enqueue CSS

  wp_enqueue_style(\'custom-google-fonts\', \'//fonts.googleapis.com/css?family=Roboto+Condensed:300,300i,400,400i,700,700i|Roboto:100,300,400,400i,700,700i\');
  wp_enqueue_style(\'font-awesome\', \'//maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css\');
  wp_enqueue_style(\'university_main_styles\', get_stylesheet_uri());
  wp_enqueue_style(\'bootstrapcss\',   get_theme_file_uri(\'/css/bootstrap.css\'), null, array(), );
  wp_enqueue_style(\'bootstrap8\',  get_theme_file_uri(\'/vendors/linericon/style.css\'), null, array(), );
  wp_enqueue_style(\'bootstrap4\',  get_theme_file_uri(\'/css/font-awesome.min.css\'), null, array(), );
  wp_enqueue_style(\'bootstrap2\',  get_theme_file_uri(\'/vendors/nice-select/css/nice-select.css\'), null, array(), );
  wp_enqueue_style(\'bootstrap3\',  get_theme_file_uri(\'/vendors/animate-css/animate.css\'), null, array(), );
  wp_enqueue_style(\'bootstrap5\',  get_theme_file_uri(\'/css/animate.min.css\'), null, array(), );
  wp_enqueue_style(\'bootstrap6\',  get_theme_file_uri(\'/vendors/flaticon/flaticon.css\'), null, array(), );


// enqueue JAVASCRIPT



    wp_enqueue_script(\'popper\',             get_theme_file_uri(\'/js/popper.js\'), array(\'jquery\') , array(), true);
  wp_enqueue_script(\'bootstrap\', get_theme_file_uri(\'/js/bootstrap.min.js\'), array(\'popper\'), array(), true);
  wp_enqueue_script(\'main-university-js4\', get_theme_file_uri(\'/js/stellar.js\'), array(\'bootstrap\'), array(), true);
  wp_enqueue_script(\'main-university-js5\', get_theme_file_uri(\'/js/jquery.magnific-popup.min.js\'), array(\'bootstrap\'), array(), true);
  wp_enqueue_script(\'main-university-js6\', get_theme_file_uri(\'/vendors/nice-select/js/jquery.nice-select.min.js\'), array(\'bootstrap\'), array(), true);
  wp_enqueue_script(\'main-university-js7\', get_theme_file_uri(\'/vendors/isotope/imagesloaded.pkgd.min.js\'), array(\'bootstrap\'), array(), true);
  wp_enqueue_script(\'main-university-js8\', get_theme_file_uri(\'/vendors/isotope/isotope-min.js\'), array(\'bootstrap\'), array(), true);
  wp_enqueue_script(\'main-university-js9\', get_theme_file_uri(\'/vendors/owl-carousel/owl.carousel.min.js\'), array(\'bootstrap\'), array(), true);
  wp_enqueue_script(\'main-university-js10\', get_theme_file_uri(\'/js/jquery.ajaxchimp.min.js\'), array(\'bootstrap\'), array(), true);
  wp_enqueue_script(\'main-university-js11\', get_theme_file_uri(\'/js/mail-script.js\'), array(\'bootstrap\'), array(), true);
  wp_enqueue_script(\'main-university-js12\', \'https://maps.googleapis.com/maps/api/js?key=AIzaSyCjCGmQ0Uq4exrzdcL6rvxywDDOvfAu6eE\', NULL, false, true);
  wp_enqueue_script(\'main-university-js13\', get_theme_file_uri(\'/js/gmaps.min.js\'), NULL, array(), true);
  wp_enqueue_script(\'main-university-js14\', get_theme_file_uri(\'/js/theme.js\'), NULL, array(), true);
  
}

// THEME FUNCTIONS

add_action(\'wp_enqueue_scripts\', \'greennectar_files\');

function greennectar_features() {
  add_theme_support(\'title-tag\');
  register_nav_menus(
    array(
      \'header-menu\' => __( \'Header Menu\' ),
      \'extra-menu\' => __( \'Extra Menu\' )
    )
  );
}

add_action(\'after_setup_theme\', \'greennectar_features\');
原始HTML主题就是这样做的:

<!DOCTYPE html>
<html lang="en">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1, shrink-to-fit=no"
    />
    <link rel="icon" href="img/favicon.png" type="image/png" />
    <title>Steve Portfolio</title>
    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="css/bootstrap.css" />
    <link rel="stylesheet" href="vendors/linericon/style.css" />
    <link rel="stylesheet" href="css/font-awesome.min.css" />
    <link rel="stylesheet" href="vendors/owl-carousel/owl.carousel.min.css" />
    <link rel="stylesheet" href="css/magnific-popup.css" />
    <link rel="stylesheet" href="vendors/nice-select/css/nice-select.css" />
    <link rel="stylesheet" href="vendors/animate-css/animate.css" />
    <link rel="stylesheet" href="vendors/flaticon/flaticon.css" />
    <!-- main css -->
    <link rel="stylesheet" href="css/style.css" />
  </head>


    <!-- Optional JavaScript -->
    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script src="js/jquery-3.2.1.min.js"></script>
    <script src="js/popper.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/stellar.js"></script>
    <script src="js/jquery.magnific-popup.min.js"></script>
    <script src="vendors/nice-select/js/jquery.nice-select.min.js"></script>
    <script src="vendors/isotope/imagesloaded.pkgd.min.js"></script>
    <script src="vendors/isotope/isotope-min.js"></script>
    <script src="vendors/owl-carousel/owl.carousel.min.js"></script>
    <script src="js/jquery.ajaxchimp.min.js"></script>
    <script src="js/mail-script.js"></script>
    <!--gmaps Js-->
    <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCjCGmQ0Uq4exrzdcL6rvxywDDOvfAu6eE"></script>
    <script src="js/gmaps.min.js"></script>
    <script src="js/theme.js"></script>
  </body>
</html>
原始版本(第二个)可以很好地使用HTML。我的很紧张。一半的脚本似乎没有加载。

我尝试的内容:

我试着确保根据第二个建议加载脚本:

试图注销WordPress jQuery并添加新的3.2.1版本,但没有帮助。

  • 尝试将步骤1中建议的脚本移动到页面顶部。

    试图将jquery作为依赖项添加到所有脚本中。

    这些都没有帮助。感谢您的帮助!

  • 1 个回复
    SO网友:Pat J

    wp_enqueue_script() 需要字符串的数组,而不是字符串$deps 参数

    因此,例如,您的代码应为:

    wp_enqueue_script( \'popper\', get_theme_file_uri(\'/js/popper.js\'), array( \'jquery\' ), array(), true );
    

    相关推荐