个性化阅读
专注于IT技术分析

如何强制wp_enqueue_style在head标签的最底部显示CSS以覆盖所有CSS规则?

我目前正在研究如何通过插件创建Wordpress管理模板, 根据Wordpress Wiki, 你可以使用admin_head, wp_admin_css和/或login_head之类的钩子手动回显链接html标签:

echo "<link rel="stylesheet" type="text/css" href="' . get_option('siteurl') . '/wp-content/plugins/blue-steel/login.css" />'."\n";

由于链接标记在php逻辑中进行了硬编码, 因此该示例显然是一件坏事。

理想的情况是使用wp_enqueue_style()插入CSS。但是, 它有自己的想法, 即何时插入CSS, 并且仅对它喜欢的钩子做出反应。例如, wp_enqueue样式在admin_head内响应不佳。到目前为止, 我只能在wp_print_styles和init中使用它, 但是在所有默认CSS都加载后, 你再也不能真正显示CSS:

<link rel='stylesheet' href='http://localhost/wordpress/wp-admin/load-styles.php?c=0&amp;dir=ltr&amp;load=plugin-install, global, wp-admin&amp;ver=9e478aac7934ae559830ecb557b6511d' type='text/css' media='all' />
<link rel='stylesheet' id='pinq-admin-css'  href='http://localhost/wordpress/wp-content/themes/ardee/css/pinq-admin.css?ver=3.0.1' type='text/css' media='all' />
<link rel='stylesheet' id='thickbox-css'  href='http://localhost/wordpress/wp-includes/js/thickbox/thickbox.css?ver=20090514' type='text/css' media='all' />
<link rel='stylesheet' id='colors-css'  href='http://localhost/wordpress/wp-admin/css/colors-fresh.css?ver=20100610' type='text/css' media='all' />

我只希望pinq-admin-css显示在head标记的底部(最好恰好在闭合头之前), 以便它可以覆盖已加载的所有与Wordpress相关的CSS。

有什么想法吗?


#1


嘿。 wp_enqueue_style有一个名为$ deps的参数, 你应该尝试一下。你也许可以提及你的样式表取决于所有其他样式表, 因此将其置于其他样式表的下方。除此之外, 你还可以继续!important。有关依赖项的更多信息:http://codex.wordpress.org/Function_Reference/wp_enqueue_style


#2


我知道这很古老, 但这是从我的网站剪切和粘贴的一些实际代码。这在我的子主题的functions.php文件中:

 add_action('init', 'add_custom_styles', 99);
 function add_custom_styles() {
     wp_enqueue_style(
         'custom-styles', get_stylesheet_directory_uri() .'/custom.css', array('storefront-style', 'wc-bundle-style', 'storefront-child-style')
    );
 }

“自定义样式”只是子主题目录中名为” custom.css”的文件, 其中包含我最后要加载的所有自定义样式。

另外, 要在你的custom.css样式表上方找到要放置的样式表的句柄, 请使用此处概述的技术:

http://crunchify.com/how-to-print-all-loaded-java-scripts-and-css-stylesheets-handle-for-your-wordpress-blog/

赞(0)
未经允许不得转载:srcmini » 如何强制wp_enqueue_style在head标签的最底部显示CSS以覆盖所有CSS规则?

评论 抢沙发

评论前必须登录!