如何在不使用内联样式的情况下向插件添加CSS选项？

我最近发布了一个插件WP Coda Slider，它使用短代码将jQuery滑块添加到任何帖子或页面。我要在下一版本中添加一个选项页面，并且我想包括一些CSS选项，但是我不希望插件将样式选择添加为内联CSS。我希望这些选项在调用时被动态添加到CSS文件中。

我也想避免使用fopen或写入文件来解决安全问题。

这样的事情容易实现吗？还是直接将样式选择添加到页面上会更好吗？

使用wp_register_style和wp_enqueue_style添加样式表。不要简单地将样式表链接添加到wp_head。排队样式允许其他插件或主题在必要时修改样式表。

您的样式表可以是.php文件：

wp_register_style('myStyleSheet', 'my-stylesheet.php');
wp_enqueue_style( 'myStyleSheet');

my-stylesheet.php看起来像这样：

<?php
// We'll be outputting CSS
header('Content-type: text/css');

include('my-plugin-data.php');    
?>

body {
  background: <?php echo $my_background_variable; ?>;
  font-size: <?php echo $my_font_size; ?>;
}

动态地构建CSS文件然后加载它会给添加CSS文件带来非常低的带宽负担，这会增加巨大的性能负担，尤其是在CSS中有一些变量需要通过WP处理的情况下。由于是为一次页面加载而创建的两个不同文件，因此WP启动两次，并两次运行所有数据库查询，这很麻烦。

如果您的滑块仅位于一页上，并且您希望动态设置样式，那么最好的选择是在标题中添加样式块。

按性能排序：

1. 在标头中添加小块样式，动态创建-非常快
2. 通过wp_enqueue_style添加非动态样式表-中
3. 通过wp_enqueue_style添加动态样式表-非常慢

这是我通常的做法：

function build_stylesheet_url() {
    echo '<link rel="stylesheet" href="' . $url . 'stylesheetname.css?build=' . date( "Ymd", strtotime( '-24 days' ) ) . '" type="text/css" media="screen" />';
}

function build_stylesheet_content() {
    if( isset( $_GET['build'] ) && addslashes( $_GET['build'] ) == date( "Ymd", strtotime( '-24 days' ) ) ) {
        header("Content-type: text/css");
        echo "/* Something */";
        define( 'DONOTCACHEPAGE', 1 ); // don't let wp-super-cache cache this page.
        die();
    }
}

add_action( 'init', 'build_stylesheet_content' );
add_action( 'wp_head', 'build_stylesheet_url' );

我对此类建议的所有建议都遇到了困难-也许我有点胖，或者贡献者失去了共同点。

我决定将其编码在插件php文件中：-

echo "<link href='http://www.brittany-gite-holidays.co.uk/wp-content/plugins/flexavailability/css/css.css' type='text/css' rel='stylesheet' />";
echo "<link href='http://www.brittany-gite-holidays.co.uk/wp-content/plugins/flexavailability/css/public.css' rel='stylesheet' type='text/css'/>";

它似乎有效。它只会在使用该插件的页面上加载。它在h1标签之后加载，这对我来说很好。我看不出它怎么可能更有效或更清晰。

....但也许我错了-我确实说我有点胖。

自Wordpress 3.3起更新

有一个名为wp_add_inline_style的函数，该函数可用于基于主题/插件选项动态添加样式。这可以用来在头部添加一个小的css文件，该文件应该快速有效。

<?php
function myprefix_scripts() {

    wp_enqueue_style('name-of-style-css', plugin_dir_path(__FILE__) . '/css/ccsfilename.css');

    $css = get_option( 'loader_css', 'default css goes here for when there is no value' );

    //or for Example
    $color = get_option( 'custom_plugin_color', 'red' ); //red is default value if value is not set
    $css = ".mycolor{
                background: {$color};
           }";

    wp_add_inline_style('name-of-style-css', $css);

}

add_action( 'wp_enqueue_scripts', 'myprefix_scripts' );