脚本未显示在 wordpress 主题中答案

【问题标题】：Scripts not showing up in wordpress theme脚本未显示在 wordpress 主题中
【发布时间】：2022-01-15 14:26:41
【问题描述】：

我将这些脚本添加到我正在处理的主题的页眉和页脚中：

<!DOCTYPE html>
<html>
    <head>
        <?php wp_head();?>
        
    </head>
<body <?php body_class();?>>

<?php wp_footer();?>

</body>
</html>

在functions.php中，我还添加了：

<?php

function load_stylesheets()
{
    wp_register_style('bootstrap', get_template_directory_uri() . '/css/bootstrap.min.css', array(), false, 'all');
    wp_enqueue_style('bootstrap');

    wp_register_style('stylesheet', get_template_directory_uri() . '/style.css', array(), false, 'all');
    wp_enqueue_style('stylesheet');
}
add_action('wp_enqueue_scripts', 'load_stylesheets');

function include_jquery()
{
    wp_deregister_script('jquery');
    wp_enqueue_script('jquery', get_template_directory_uri() . '/js/jquery.min.js', '', 1, true);
    add_action('wp_enqueue_scripts', 'jquery');
}
add_action('wp_enqueue_scripts', 'include_jquery');

function load_js()
{
    wp_register_script('customjs', get_template_directory_uri() . '/js/scripts.js', '', 1, true);
    wp_enqueue_script('customjs');
}

add_action('wp_enqueue_scripts', 'load_js');

当我检查本地站点时，我看不到这些脚本或我在functions.php 中排队的任何其他脚本。只有我能找到的脚本：

<script type="text/javascript">
            window._wpemojiSettings = {"baseUrl":"https:\/\/s.w.org\/images\/core\/emoji\/13.1.0\/72x72\/","ext":".png","svgUrl":"https:\/\/s.w.org\/images\/core\/emoji\/13.1.0\/svg\/","svgExt":".svg","source":{"concatemoji":"http:\/\/localhost\/financeblog\/wp-includes\/js\/wp-emoji-release.min.js?ver=5.8.2"}};
            !function(e,a,t){var n,r,o,i=a.createElement("canvas"),p=i.getContext&&i.getContext("2d");function s(e,t){var a=String.fromCharCode;p.clearRect(0,0,i.width,i.height),p.fillText(a.apply(this,e),0,0);e=i.toDataURL();return p.clearRect(0,0,i.width,i.height),p.fillText(a.apply(this,t),0,0),e===i.toDataURL()}function c(e){var t=a.createElement("script");t.src=e,t.defer=t.type="text/javascript",a.getElementsByTagName("head")[0].appendChild(t)}for(o=Array("flag","emoji"),t.supports={everything:!0,everythingExceptFlag:!0},r=0;r<o.length;r++)t.supports[o[r]]=function(e){if(!p||!p.fillText)return!1;switch(p.textBaseline="top",p.font="600 32px Arial",e){case"flag":return s([127987,65039,8205,9895,65039],[127987,65039,8203,9895,65039])?!1:!s([55356,56826,55356,56819],[55356,56826,8203,55356,56819])&&!s([55356,57332,56128,56423,56128,56418,56128,56421,56128,56430,56128,56423,56128,56447],[55356,57332,8203,56128,56423,8203,56128,56418,8203,56128,56421,8203,56128,56430,8203,56128,56423,8203,56128,56447]);case"emoji":return!s([10084,65039,8205,55357,56613],[10084,65039,8203,55357,56613])}return!1}(o[r]),t.supports.everything=t.supports.everything&&t.supports[o[r]],"flag"!==o[r]&&(t.supports.everythingExceptFlag=t.supports.everythingExceptFlag&&t.supports[o[r]]);t.supports.everythingExceptFlag=t.supports.everythingExceptFlag&&!t.supports.flag,t.DOMReady=!1,t.readyCallback=function(){t.DOMReady=!0},t.supports.everything||(n=function(){t.readyCallback()},a.addEventListener?(a.addEventListener("DOMContentLoaded",n,!1),e.addEventListener("load",n,!1)):(e.attachEvent("onload",n),a.attachEvent("onreadystatechange",function(){"complete"===a.readyState&&t.readyCallback()})),(n=t.source||{}).concatemoji?c(n.concatemoji):n.wpemoji&&n.twemoji&&(c(n.twemoji),c(n.wpemoji)))}(window,document,window._wpemojiSettings);
        </script>

所有的 CSS 仍然显示在源代码中，只是脚本没有。

【问题讨论】：

标签： javascript php wordpress

【解决方案1】：

您的主页模板看起来如何？（例如 index.php、single.php、page.php）

每个页面都应该使用特殊的功能来包含：

header.php 使用get_header();
footer.php 使用get_footer();

single.php 在 WordPress 二十人主题中的外观如下：

<?php
/**
 * The template for displaying all single posts
 *
 * @link https://developer.wordpress.org/themes/basics/template-hierarchy/#single-post
 *
 * @package WordPress
 * @subpackage Twenty_Twenty_One
 * @since Twenty Twenty-One 1.0
 */

get_header();

/* Start the Loop */
while ( have_posts() ) :
    the_post();

    // Template and article navigation includes here.

endwhile; // End of the loop.

get_footer();

试试这个代码来包含脚本和样式：

/**
 * Load custom scripts and styles.
 */
function custom_scripts_and_styles() {

    // Enqueue styles.
    wp_enqueue_style( 'md-bootstrap', get_template_directory_uri() . '/css/bootstrap.min.css', array(), false, 'all' );
    wp_enqueue_style( 'md-stylesheet', get_template_directory_uri() . '/style.css', array(), false, 'all' );

    // Enqueue scripts.
    wp_deregister_script( 'jquery' );
    wp_enqueue_script( 'jquery', get_template_directory_uri() . '/js/jquery.min.js', array(), 1, true );
    wp_enqueue_script( 'md-customjs', get_template_directory_uri() . '/js/scripts.js', array( 'jquery' ), 1, true );
}
add_action( 'wp_enqueue_scripts', 'custom_scripts_and_styles' );

【讨论】：

目前，我的 index.php 看起来只有这样： js 在我查看源代码时不显示。跨度>
我用排队代码更新了我的答案。
脚本仍然没有出现。不过 CSS 确实如此。
我认为这个问题与语法有关。我通过添加添加来修复它：之前是（在 ; 和 ? 之间没有空格）