Questions tagged «wp-enqueue-style»

一种将CSS样式文件添加/排队到wordpress生成的页面的安全方法。如果首先使用wp_register_style()注册,则现在可以使用其句柄添加它。

9
如何在某些/ wp-admin页面上加入样式/脚本?
我有两个简单的函数,它们使用wp_enqueue_style()和加载东西wp_enqueue_script(),如下所示: function admin_custom_css() { wp_enqueue_style( 'stylesheet_name', 'stylesheet.css') }; function admin_custom_js { wp_enqueue_script( 'javascript_file', 'script.js') }; ...以及使用add_menu_page()和创建的一些管理页面add_submenu_page() function my_menu() { add_menu_page('Page 1', 'bar', 'something', 'else', 'foo'); add_submenu_page( 'theme_menu', 'Subpage 1', 'Subpage', 'something', 'else', 'foo'); } add_action('admin_menu', 'my_menu'); 如何仅在这些页面上加载两个函数? 现在我正在使用: add_action('admin_init', 'admin_custom_css' ); add_action('admin_init', 'admin_custom_js' ); 但这会在每个管理页面上加载我的文件,这一点都不好。 我可以通过一个简单的行来完成此操作,functions.php还是必须将它们分别放入我的页面中(我强烈建议使用第一个选项,因为我必须编辑很多管理页面创建功能)。 谢谢!


8
有条件地为短代码加载JavaScript / CSS
我发布了一个创建简码的插件,该插件需要一个JavaScript文件和一个CSS文件才能在包含该简码的任何页面上加载。我可以在所有页面上加载脚本/样式,但这不是最佳实践。我只想在调用短代码的页面上加载文件。我发现有两种方法可以这样做,但是都有问题。 方法1在shortcode处理函数中将标志设置为true,然后在wp_footer回调中检查该值。如果为true,则用于wp_print_scripts()加载JavaScript。这样做的问题是,它仅适用于JavaScript,而不适用于CSS,因为CSS应该在内部声明<head>,您只能在类似initor 的早期挂钩中执行此操作wp_head。 方法2提前触发并“向前看”,以查看当前页面内容中是否存在简码。我比第一种方法更喜欢这种方法,但是它的问题无法检测模板是否调用do_shortcode()。 因此,我倾向于使用第二种方法,然后尝试检测是否已分配模板,如果分配了模板,则将其解析为简码。但是,在此之前,我想检查是否有人知道更好的方法。 更新:我已经将解决​​方案集成到了我的插件中。如果有人想看到它在实时环境中充实,可以下载或浏览它。 更新2:由于WordPress的3.3,它现在可以打电话wp_enqueue_script()直接在短码回调里面,和JavaScript文件将文档的页脚中调用。从技术上讲,这对于CSS文件也是可行的,但应将其视为一种不好的做法,因为在<head>标记外输出CSS 违反W3C规范,可能会破坏FOUC,并可能迫使浏览器重新呈现页面。

2
如何使父主题的CSS文件出队?
我的父主题(Starkers)添加了一个我要删除的CSS文件(我想改用@import以便更轻松地覆盖样式)。Starkers在functions.php中具有以下内容: add_action( 'wp_enqueue_scripts', 'script_enqueuer' ); function script_enqueuer() { wp_register_script( 'site', get_template_directory_uri().'/js/site.js', array( 'jquery' ) ); wp_enqueue_script( 'site' ); wp_register_style( 'screen', get_template_directory_uri().'/style.css', '', '', 'screen' ); wp_enqueue_style( 'screen' ); } 我在子functions.php中尝试了以下操作,但是链接和脚本标签仍显示在头部。 add_action('init', 'removeScripts'); function removeScripts() { wp_dequeue_style('screen'); wp_deregister_script('site'); } 我仔细检查了它们是否在父标头中进行了硬编码,而事实并非如此。



2
在插件中包含内联CSS可以吗?
通常在插件中,我会使用wp_enqueue_style添加样式。但是,我当前正在创建一个只需要几行CSS的插件,并且我想知道内联样式以保存请求是否更好。显然,使用wp_enqueue_style有很多优点,但是对于这样一小段CSS,是否值得额外要求?在这方面是否有公认的“最佳实践”?

3
排队主题的样式表有多重要?
我已经在网上寻找了答案,但是由于某种原因,我只能找到实际的示例,但是没有特定的解释,对于脚本来说,这是显而易见的。有人可以向我解释为什么在开发主题时(而不只是<link rel=stylesheet>在header.php中使用)使样式入队很重要/有优势 。 另外,主题的默认样式表又该如何入队呢?

3
在没有样式表的情况下使用wp_add_inline_style
我需要将自定义内联样式添加到正在创建的自定义主题的标题中。我遇到过wp_add_inline_style()功能,该功能可以工作,但由于它取决于特定的样式表,因此并不十分适合我。我需要在head标记的末尾添加内联样式,而不必依赖样式表。 我尝试设置主题样式表或不存在的样式表。在这两种情况下,它都可以工作,但是有点像IMO一样肮脏(要么加载主题样式表两次,要么引用幻影文件...)。有没有适当的方法可以在头中添加内联样式而不依赖样式表? 当然,我可以将它们直接添加到header.php文件中,但我想避免这种情况。

4
从“十二十二”主题中删除开放无题
我正在为Twenty Twelve v1.0创建一个子主题,并且想要删除Open Sans字体。 Open Sans被添加到Twenty Twelve的functions.php中: wp_enqueue_style( 'twentytwelve-fonts', add_query_arg( $query_args, "$protocol://fonts.googleapis.com/css" ), array(), null ); 我尝试在childtheme的functions.php中注销/退出样式表(请参见下面的示例),但没有任何效果: function example_scripts_styles() { wp_deregister_style( 'twentytwelve-fonts' ); wp_dequeue_style( 'twentytwelve-fonts' ); } add_action( 'wp_enqueue_scripts', 'example_scripts_styles' ); 有什么想法可以删除此文件吗?谢谢!

4
在管理面板中设置自定义列的样式(尤其是调整列单元格的宽度)
我正在将Wordpress用作广泛使用自定义帖子类型的项目的CMS。我需要以不同的方式在管理面板中为每种自定义帖子类型显示列。 我已经创建了必要的列并填充了它们。我需要做的是稍微调整CSS。最重要的是,我正在尝试调整某些列的宽度。例如,我不需要列出帖子ID的列就可以与帖子名称一样宽。 我在管理面板中为自己的自定义帖子类型排队了一个样式表,但无法正确设置列宽的样式。 我试图调整th或td元素的最大宽度,但这是无效的。从firebug中,我可以看到css样式存在,但是它什么也没做。 虽然我可以找到很多教程来添加/编辑自定义列,但是我并没有真正收集有关如何设置此类列样式的信息。有什么提示吗? 谢谢!

2
仅在使用时如何加载Widget javascript + CSS文件?
我想将我的小部件使用的javascript和CSS样式保留在自己的文件中(而不是将它们添加到主题中)。 但是当侧边栏上实际使用该小部件时,我似乎无法让wordpress添加它们。 我已经试过了: 在类声明中,我添加了2个函数 class EssentielleRubriquesPosts extends WP_Widget { function addFrontendCss(){ wp_enqueue_style('erw-frontend-css', ESSENTIELLE_RUBRIQUE_WIDGET_PLUGIN_PATH . 'css/EssentielleRubriqueWidget-frontend.css'); } function addFrontendJavascript(){ wp_register_script('jq-hoverintent', PLUGIN_PATH . 'js/jquery.hoverintent.js', array('jquery'), '1.0',true); wp_enqueue_script('jq-hoverintent'); wp_enqueue_script('jq-tools', PLUGIN_PATH . 'js/jquery.tools.js', array('jquery'),'1.0',true); wp_enqueue_script('erw-frontend-js', PLUGIN_PATH . 'js/widget-frontend.js', array('jquery', 'jq-hoverintent', 'jq-tools'),'1.0',true); } 在widget()函数内部: function widget($args, $instance) { add_action( 'wp_print_scripts', 'addFrontendJavascript' ); add_action( 'wp_print_styles', 'addFrontendCss' …

2
如何在wp_register_style中添加交叉来源和完整性?(字体真棒5)
我正在将Font Awesome 4升级到版本5,该版本将完整性和跨域属性引入了<link rel="stylesheet">标记。 目前,我正在使用: wp_register_style('FontAwesome', 'https://example.com/font-awesome.min.css', array(), null, 'all' ); wp_enqueue_style('FontAwesome'); 输出为: <link rel="stylesheet" id="FontAwesome-css" href="https://example.com/font-awesome.min.css" type="text/css" media="all" /> 有了Font Awesome 5,它引入了两个新的属性和值(integrity和crossorigin),例如: <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.5.0/css/all.css" integrity="sha384-B4dIYHKNBt8Bc12p+WXckhzcICo0wtJAoU8YZTY5qE0Id1GSseTk6S+L3BlXeVIU" crossorigin="anonymous"> 所以,我需要找到我怎么能既完整性和crossorigin添加到wp_register_style,我都试过,但我会尝试使用wp_style_add_data都失败了,它似乎是这种方法仅支持conditional,rtl并且suffix,alt和title。

3
如何获得所有排队的脚本和样式的列表?
我正在创建一个插件,我想获取其他插件使用的所有脚本和CSS的列表。 这是我的功能: function crunchify_print_scripts_styles() { $result = []; $result['scripts'] = []; $result['styles'] = []; // Print all loaded Scripts global $wp_scripts; foreach( $wp_scripts->queue as $script ) : $result['scripts'][] = $wp_scripts->registered[$script]->src . ";"; endforeach; // Print all loaded Styles (CSS) global $wp_styles; foreach( $wp_styles->queue as $style ) : $result['styles'][] = $wp_styles->registered[$style]->src …

2
在排队的样式和脚本上阻止版本URL参数(?ver = XXX)
用例 我一直在尝试使用Chrome的开发工具工作区功能。它具有直接在开发工具中编辑文件并保存已保存的样式表的能力,甚至可以刷新自身(甚至编译然后刷新!)。 但是,如StackOverflow问题“ SASS重新编译CSS时Chrome的“自动重新生成CSS”不会重新加载页面”中所述,样式表URL上的URL参数阻止Chrome注意到更改。 期望的结果 这意味着,仅在开发期间,我才希望?ver=X.X.X从常规样式表<link>输出中删除wp_enqueue_style()。换句话说,我想要默认值href: http://localhost/mysite/wp-includes/style.css?ver=4.1.1 改为: http://localhost/mysite/wp-includes/style.css

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.