问题描述
如何在我的 wordpress 插件中包含 CSS 和 jQuery?
最佳解决思路
适用于样式
wp_register_style( 'namespace', 'http://locationofcss.com/mycss.css' );
然后使用:wp_enqueue_style('namespace');
,无论你想要加载什么 CSS 。
脚本如上所述,但加载 jquery 的更快方法只是使用加载在 init 中的入站到要加载的页面上:wp_enqueue_script('jquery');
除非你当然希望使用 google 存储库进行 jquery 。
您还可以有条件地加载您的脚本依赖的 jquery 库:wp_enqueue_script('namespaceformyscript', 'http://locationofscript.com/myscript.js', array('jquery'));
次佳解决思路
将其放在您的插件的 init()
功能中。
function your_namespace() {
wp_register_style('your_namespace', plugins_url('style.css',__FILE__ ));
wp_enqueue_style('your_namespace');
wp_register_script( 'your_namespace', plugins_url('your_script.js',__FILE__ ));
wp_enqueue_script('your_namespace');
}
add_action( 'admin_init','your_namespace');
在我找到 (对我来说) 最好的解决方案是愚蠢的 imho 之前,也花了我一段时间。
干杯
第三种解决思路
将 CSS 和 jQuery 包含在您的插件中很容易,请尝试:
// register jquery and style on initialization
add_action('init', 'register_script');
function register_script() {
wp_register_script( 'custom_jquery', plugins_url('/js/custom-jquery.js', __FILE__), array('jquery'), '2.5.1' );
wp_register_style( 'new_style', plugins_url('/css/new-style.css', __FILE__), false, '1.0.0', 'all');
}
// use the registered jquery and style above
add_action('wp_enqueue_scripts', 'enqueue_style');
function enqueue_style(){
wp_enqueue_script('custom_jquery');
wp_enqueue_style( 'new_style' );
}
我发现这个伟大的剪辑从这个网站 How to include jQuery and CSS in WordPress – The WordPress Way
希望有帮助。
第四种思路
只是为了追加 @ pixeline 的答案 (试图添加一个简单的评论,但网站说我需要 50 个声誉) 。
如果您正在为管理员部分编写插件,那么您应该使用:
add_action('admin_enqueue_scripts', "add_my_css_and_my_js_files");
admin_enqueueu_scripts 是管理部分的正确钩子,前端使用 wp_enqueue_scripts 。
第五种思路
见 http://codex.wordpress.org/Function_Reference/wp_enqueue_script
例
<?php
function my_init_method() {
wp_deregister_script( 'jquery' );
wp_register_script( 'jquery', 'http://googleajax.admincdn.com/ajax/libs/jquery/1.4/jquery.min.js');
}
add_action('init', 'my_init_method');
?>
第六种思路
接受的答案是不完整的。你应该使用正确的钩子:wp_enqueue_scripts
例:
function add_my_css_and_my_js_files(){
wp_enqueue_script('your-script-name', $this->urlpath . '/your-script-filename.js', array('jquery'), '1.2.3', true);
wp_enqueue_style( 'your-stylesheet-name', plugins_url('/css/new-style.css', __FILE__), false, '1.0.0', 'all');
}
add_action('wp_enqueue_scripts', "add_my_css_and_my_js_files");
第七种思路
首先需要注册风格和 css 使用 wp_register_script() 和 wp_register_style() 功能
//registering javascript and css
wp_register_script ( 'mysample', plugins_url ( 'js/myjs.js', __FILE__ ) );
wp_register_style ( 'mysample', plugins_url ( 'css/mystyle.css', __FILE__ ) );
之后,您可以调用 wp_enqueue_script() 和 wp_enqueue_style() 函数将 js 和 css 加载到所需页面
wp_enqueue_script('mysample');
wp_enqueue_style('mysample');
我在这里找到一个很好的例子 http://wiki.workassis.com/wordpress-create-advanced-custom-plugin-using-oop/
参考文献
注:本文内容整合自 Google/Baidu/Bing 辅助翻译的英文资料结果。如果您对结果不满意,可以加入我们改善翻译效果:薇晓朵技术论坛。