为什么我的wp_enQueue_style()不起作用?

时间:2020-07-28 作者:Candace

我是wordpress的新手,第一次尝试在localhost上开发一个儿童主题。我正在尝试加载样式。css在函数中使用此代码。php。这就是全部功能。php文件:

<?php 

//registers styles in header
function load_stylesheets()
    {   
        
        wp_register_style(\'bootstrap\', get_stylesheet_directory_uri().\'/assets/css/bootstrap.css\', array(), false, \'all\');
        wp_enqueue_style( \'bootstrap\');
        
        wp_register_style(\'style\', get_stylesheet_directory_uri().\'/style.css\', array(), false, \'all\');
        wp_enqueue_style(\'style\');
        

    }
add_action(\'wp_enqueue_scripts\', \'load_stylesheets\');
    
?>
我的风格。css文件位于我的主目录中,其中包含此样式

body {background-color:black;}
我的标题。php文件为

<!DOCTYPE html>
<head>
    <?php wp_head();?>
</head> 
<body <?php body_class();?>>
    
我的页脚。php文件为

<footer>
</footer>

<?php wp_footer();?>

</body>
</html>
当我检查我的主页源代码时,它显示了我的风格。css正在加载,但我没有看到应用的样式(黑色背景)。

<style type="text/css">
img.wp-smiley,
img.emoji {
    display: inline !important;
    border: none !important;
    box-shadow: none !important;
    height: 1em !important;
    width: 1em !important;
    margin: 0 .07em !important;
    vertical-align: -0.1em !important;
    background: none !important;
    padding: 0 !important;
}
</style>
    <link rel=\'stylesheet\' id=\'wp-block-library-css\'  href=\'http://homepage:8888/wp-includes/css/dist/block-library/style.min.css?ver=5.4.2\' type=\'text/css\' media=\'all\' />
<link rel=\'stylesheet\' id=\'bootstrap-css\'  href=\'http://homepage:8888/wp-content/themes/cc/assets/css/bootstrap.css?ver=5.4.2\' type=\'text/css\' media=\'all\' />
<link rel=\'stylesheet\' id=\'style-css\'  href=\'http://homepage:8888/wp-content/themes/cc/style.css?ver=5.4.2\' type=\'text/css\' media=\'all\' />
<link rel=\'https://api.w.org/\' href=\'http://homepage:8888/wp-json/\' />
<link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://homepage:8888/xmlrpc.php?rsd" />
<link rel="wlwmanifest" type="application/wlwmanifest+xml" href="http://homepage:8888/wp-includes/wlwmanifest.xml" /> 
<meta name="generator" content="WordPress 5.4.2" />
<link rel="canonical" href="http://homepage:8888/" />
<link rel=\'shortlink\' href=\'http://homepage:8888/\' />
<link rel="alternate" type="application/json+oembed" href="http://homepage:8888/wp-json/oembed/1.0/embed?url=http%3A%2F%homepage%3A8888%2F" />
<link rel="alternate" type="text/xml+oembed" href="http://homepage:8888/wp-json/oembed/1.0/embed?url=http%3A%2F%homepage%3A8888%2F&#038;format=xml" />


        
当我点击;http://homepage:8888/wp-内容/主题/抄送/风格。css?版本=5.4.2“;看来我的风格;正文{背景色:黑色;}"E;正在显示,但我没有看到它应用于主页。看起来它被引导程序的重新启动所覆盖。scss文件,我从css文件夹中删除了它,所以我不知道为什么它仍在显示。是否也有理由添加;版本=5.4.2“;到最后?

编辑:

在发布此消息之前,我已尝试刷新并检查了调试日志。调试日志上说了这句话,但我仍然不明白它在说什么,我正在关注我的教程视频。

      thrown in /Applications/MAMP/htdocs/homepage.com/wp-content/themes/homepage/template-parts/content-archive.php on line 27
[28-Jul-2020 04:58:53 UTC] PHP Fatal error:  Uncaught Error: Call to undefined function the_exerpt() in /Applications/MAMP/htdocs/homepage.com/wp-content/themes/homepage/template-parts/content-archive.php:27
Stack trace:
#0 /Applications/MAMP/htdocs/homepage.com/wp-includes/template.php(725): require()
#1 /Applications/MAMP/htdocs/homepage.com/wp-includes/template.php(672): load_template(\'/Applications/M...\', false)
#2 /Applications/MAMP/htdocs/homepage.com/wp-includes/general-template.php(168): locate_template(Array, true, false)
#3 /Applications/MAMP/htdocs/homepage.com/wp-content/themes/homepage/index.php(20): get_template_part(\'template-parts/...\', \'archive\')
#4 /Applications/MAMP/htdocs/homepage.com/wp-includes/template-loader.php(106): include(\'/Applications/M...\')
#5 /Applications/MAMP/htdocs/homepage.com/wp-blog-header.php(19): require_once(\'/Applications/M...\')
#6 /Applications/MAMP/htdocs/homepage.com/index.php(17): require(\'/Applications/M...\')
#7 {main}
  thrown in /Applications/MAMP/htdocs/homepage.com/wp-content/themes/homepage/template-parts/content-archive.php on line 27
[28-Jul-2020 06:24:51 UTC] PHP Parse error:  syntax error, unexpected \'}\', expecting \')\' in /Applications/MAMP/htdocs/homepage.com/wp-content/themes/cc/functions.php on line 6
[28-Jul-2020 06:24:51 UTC] PHP Notice:  Trying to access array offset on value of type bool in /Applications/MAMP/htdocs/homepage.com/wp-includes/class-wp-recovery-mode-email-service.php on line 339
[28-Jul-2020 06:24:51 UTC] PHP Notice:  Trying to access array offset on value of type bool in /Applications/MAMP/htdocs/homepage.com/wp-includes/class-wp-recovery-mode-email-service.php on line 340
[28-Jul-2020 06:26:51 UTC] PHP Parse error:  syntax error, unexpected \'}\', expecting \')\' in /Applications/MAMP/htdocs/homepage.com/wp-content/themes/cc/functions.php on line 6
[28-Jul-2020 07:03:18 UTC] PHP Notice:  Undefined variable: version in /Applications/MAMP/htdocs/homepage.com/wp-content/themes/cc/functions.php on line 10
[28-Jul-2020 07:03:19 UTC] PHP Notice:  Undefined variable: version in /Applications/MAMP/htdocs/homepage.com/wp-content/themes/cc/functions.php on line 10

1 个回复
SO网友:t2pe

看看您的调试输出,您似乎正在开发一个子主题?如果是这样,则需要函数get\\u stylesheet\\u directory\\u uri()而不是get\\u template\\u directory\\u uri(),因为后者将始终使用父主题,而前者将使用子主题(如果存在)。

因此,请尝试以下方法:

function load_stylesheets(){    
        wp_enqueue_style(\'bootstrap\', get_stylesheet_directory_uri().\'/assets/css/bootstrap.css\', array(), false, \'all\');
        wp_enqueue_style(\'style\', get_stylesheet_directory_uri().\'/style.css\', array(), false, \'all\');
    }
add_action(\'wp_enqueue_scripts\', \'load_stylesheets\');
调试中的其他错误不太可能是缺少CSS的原因,但如果上述错误不起作用,请粘贴部分函数。根据我上面的评论。

Update. 我安装了一个新的WP安装,并应用了上面的功能,将Bootstrap 4中的下载文件放到正确的文件夹中,以模拟您的安装并添加了样式。仅此而已。一切都很好,背景像你所期望的那样变成了黑色。

因此,我认为Wordpress方面很好,甚至CSS设置也可能是正确的。

我认为还有两件事你可以检查:

确保你能看到你的主题风格。css出现在头部引导css之后/之下。它必须在后面/下面,否则它将被覆盖(在您的屏幕截图中看起来很好)

  • 使用检查器查看浏览器使用CSS时的外观。这可能与您的预期不同
  • 在Chrome中-右键单击并检查页面以打开DevTools。切换到网络选项卡,并在顶部应用CSS过滤器。重新加载页面,您应该会看到此处列出的所有正在使用的CSS文件。单击您的样式。css,您可以在右侧看到它的预览。它是否填充了正确的代码?

    除此之外,我不确定我/我们是否能提供更多帮助,因为文件似乎已正确地在头部排队。

    相关推荐