如何从主题文件中加入WordPress插件中的样式?

时间:2020-12-21 作者:Amit Sarker

在我的主题文件中,我将许多css和js文件排队。我想把一些与主题相同的css文件排队。那么,我如何在插件中排队呢?

2 个回复
SO网友:Tony Djukic

IF 我正确地理解了你的问题,你想做的是使用插件将脚本和样式表排队,就像你处理主题一样<如果是这样的话,那真的没什么不同:

function yourplugin_enqueue_frontend() {
    wp_enqueue_style( \'yourplugin-front\', plugins_url( \'yourplugin-front.css\', __DIR__ ), array(), \'1.0\' );
    wp_enqueue_script( \'yourplugin-front\', plugins_url( \'yourplugin-front.js\', __DIR__ ), array( \'jquery\' ), \'1.0\', true );
}
add_action( \'wp_enqueue_scripts\', \'yourplugin_enqueue_frontend\' );
我使用plugins_url( \'path-to-file.js\', __DIR__ ) 而不是__FILE__ 因为我倾向于用很多细节来组织我的插件目录。所以我的所有函数都在单独的文件中includes 目录,我的javascript文件都在js 目录中的CSScss 目录等。。。因此,它只是让我更容易为我排队的每个脚本和样式表提供正确的路径。

主要区别在于您使用的主题:

get_template_directory_uri() . \'theme-stylesheet.css\'
但使用插件时:

plugins_url( \'theme-stylesheet.css\', __DIR__ )
其余的基本上是一样的。

UPDATE

好的,我真的不认为你应该这样做,因为这样你就使得一个插件依赖于一个主题,这意味着如果你改变主题,如果新主题没有它,或者如果新主题在不同的位置有它,你就会失去对文件的访问权。。。例如,我将文件放在一个名为/css/, 但是如果你切换主题,新主题有相同的文件,但这次它在/assets/css/ 然后您的排队将中断。

不管怎样,因为是你要求的,所以它在这里。。。

function yourplugin_enqueue_frontend() {
        wp_enqueue_style( \'yourplugin-front\', plugins_url( \'yourplugin-front.css\', __DIR__ ), array(), \'1.0\' );
        //THIS NEXT LINE ENQUEUES THE SCRIPT FROM THE THEME
        wp_enqueue_style( \'notagoodidea\', get_template_directory_uri() . \'/css/shouldnt-do-this.css\', array(), \'1.0\' );
        wp_enqueue_script( \'yourplugin-front\', plugins_url( \'yourplugin-front.js\', __DIR__ ), array( \'jquery\' ), \'1.0\', true );
    }
    add_action( \'wp_enqueue_scripts\', \'yourplugin_enqueue_frontend\' );
我已经测试过了,它很有效。。。

<link rel="stylesheet" id="notagoodidea-css" href="http://domain.com/wp-content/themes/thisisthetheme/css/shouldnt-do-this.css" media="all">

SO网友:Jacob Peattie

根据您对他人的评论,您希望在主题中注册样式表,并从插件中将其排队。那样的话,你可以打电话wp_enqueue_script() 只有你用过的把手wp_register_script(), 没有其他的论点。

因此,在您的主题中,注册样式表。

add_action(
    \'wp_enqueue_scripts\',
    function() {
        wp_register_style( \'my-stylesheet-handle\', get_theme_file_uri( \'css/my-stylesheet.css\' ) );
    }
);
然后在插件中,您可以将样式表按如下方式排队:

add_action(
    \'wp_enqueue_scripts\',
    function() {
        wp_enqueue_style( \'my-stylesheet-handle\' );
    },
    20
);
您需要注意的一件事是,插件在主题之前加载,所以当您连接到wp_enqueue_scripts 从插件中,您应该指定大于10 以便在主题注册样式表之后运行。

相关推荐