localhost wordpress 加载 style.css 失败答案

【问题标题】：localhost wordpress failed load style.csslocalhost wordpress 加载 style.css 失败
【发布时间】：2021-06-13 21:41:08
【问题描述】：

我正在尝试在 localhost 中构建 WordPress 主题。当我打开浏览器（http://localhost/website/wordpress）时，我有我的functions.php，这不会加载所有的css更改。浏览器中仅显示正文背景。你认为问题是什么？感谢您的帮助。

这是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('style', get_template_directory_uri().'/css/style.css', array(), false, 'all');
    wp_enqueue_style('style');
}
add_action('wp_enqueue_scripts', 'load_stylesheets');

function include_jquery(){
    wp_deregister_script('jquery');
    wp_enqueue_script('jquery',get_template_directory_uri().'/js/jquery-3.6.0.min.js','',1,true);

    add_action('wp_enqueue_scripts', 'jquery');
}
add_action('wp_enqueue_scripts', 'include_jquery');

function loadjs(){
    wp_register_script('customjs', get_template_directory_uri().'js/script.js', '', 1, true);
    wp_enqueue_script('customjs');

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

这是 header.php

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


</head>
<body <?php body_class();?>>

<header class="sticky-top">
</header>

这是front-page.php

<?php get_header();?>
<div class="container">
<div class="row">
<div class="col">
left side
</div>

<div class="col">
Right side
</div>
</div>
</div>
<?php get_footer();?>

style.css

body
{ 
    background: hsl(0, 64%, 98%);
}
header .hh
{
    background-color: hsl(0, 0%, 100%);
    width: 100%;
    height:100%;
}

即使 js alert 不加载这是代码（仅用于测试）

$(document).ready(function(){
alert('test');


});

【问题讨论】：

请提供一些代码和您尝试过的内容，以便我们更好地帮助您。谢谢。 :) stackoverflow.com/help/minimal-reproducible-example

标签： css wordpress localhost

【解决方案1】：

你能展示你正在处理的代码吗？诊断问题会容易得多:-)

我想到的问题的潜在原因是：

wp搜索文件，css文件不存在
css可能被缓存了（解决方法：大量ctrl+f5或者清除缓存）
css 排队代码中的一些错字

我可能错了，但是 - 正如我所说 - 不看代码就很难判断。 :-)

【讨论】：

感谢您的快速重播。我试图从 chrome 设置中清除缓存清除浏览数据。问题仍然存在。
好的，css-enqueuing 代码看起来没问题。确保文件存在 - 在浏览器中查看 html 源代码，找到元素并将 url 复制到您的 css 文件并将其粘贴到浏览器中 - 您应该看到您的 css，否则该文件不存在。
如果文件已经存在，请确保它没有缓存。我这样做： $debug_suffix = constant( 'WP_DEBUG' ) ？ '?v=' 。时间（）： ''; $debug_suffix 变量包含当前时间戳，或者，如果 WP_DEBUG 常量设置为 false，则为空。前者代表开发环境，后者代表生产环境。然后我将此变量附加到传递给 wp_register_style 的 css url。由于时间戳每秒都在变化，因此永远不会从缓存中获取 css url（因为每次重新加载页面时它都不同），所以我总是得到最新的 CSS。同样的策略也适用于 JS 入队。
一个重要的事情：记住在发布站点时将 WP_DEBUG 常量设置为 false ;-) 它在 wp-config.php 中定义
我没有更改 wp_register。我只是在 css 和 front-page.php 中添加了额外的代码。我更正了functions.php 中script.js 文件的路径，我只在路径的开头添加了正斜杠/。现在一切正常。感谢 mpdoctor 我感谢您的帮助。祝你有美好的一天！