将样式 sheet 加载到 wordpress 插件中

Load a style sheet into a wordpress plugin

所以我正在为 wordpress 创建一个简单的插件,它将加载新的块模式。除了排队样式表的一件事外,我已经完成了所有工作。我做了一些研究并试图找出答案,但我不确定我的代码哪里出了问题。

/**
 * Load CSS
 */

function sebootscout_enqueue_frontend() {
    wp_enqueue_style( 'sebootscout-block-patterns', plugins_url( 'sebootscout-block-style.css', __DIR__ ), array(), '1.0' );
}
add_action( 'wp_enqueue_scripts', 'sebootscout_enqueue_frontend' );

我总是使用类似下面的东西。还要确保我实际上获得了文件的正确路径。浏览器开发人员工具可帮助证明这一点。

function pl_scripts()
{
  wp_enqueue_style('pl-main', plugin_dir_url(__FILE__) . 'css/pl-main.css', array(), 1.0);
}

add_action('wp_enqueue_scripts', 'pl_scripts');

首先你需要注册样式

add_action('wp_enqueue_scripts', function () {
    wp_register_style('sebootscout-block-patterns', plugins_url('sebootscout-block-patterns', __FILE__), [], false, 'all');
});

如果调用此操作的文件是嵌套的而不是在插件的根文件夹中,则替换

plugins_url('sebootscout-block-patterns', __FILE__)

plugins_url('sebootscout-block-patterns', dirname(__FILE__))

终于在任何你想加载特定注册样式的地方

wp_enqueue_style('sebootscout-block-patterns');

确保您正在测试的主题在 header.php 的 </head> 之前有 wp_head(); 在 footer.php

</body> 之前 wp_footer();

这是因为 wordpress 实际上使用这 2 个函数将您的样式挂钩到 DOM,具体取决于是否将其加载到页脚的选项。

希望对您有所帮助,祝您好运。