Como adiciono opções de CSS ao meu plug-in sem usar estilos embutidos?

Lancei recentemente um plug-in, o WP Coda Slider , que usa códigos de acesso para adicionar um controle deslizante jQuery a qualquer postagem ou página. Estou adicionando uma página de opções na próxima versão e gostaria de incluir algumas opções de CSS, mas não quero que o plug-in adicione as opções de estilo como CSS embutido. Quero que as opções sejam adicionadas dinamicamente ao arquivo CSS quando for chamado.

Também gostaria de evitar o uso de fopen ou a gravação em um arquivo por questões de segurança.

É algo fácil assim ou seria melhor adicionar as opções de estilo diretamente à página?

Use wp_register_stylee wp_enqueue_stylepara adicionar a folha de estilo. NÃO basta adicionar um link para a folha de estilo wp_head. Os estilos de enfileiramento permitem que outros plugins ou temas modifiquem a folha de estilo, se necessário.

Sua folha de estilo pode ser um arquivo .php:

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

my-stylesheet.php ficaria assim:

<?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; ?>;
}

Criar dinamicamente um arquivo CSS e carregá-lo adiciona uma ENORME carga de desempenho ao que deveria ser uma oferta de largura de banda muito baixa para adicionar um arquivo CSS, especialmente se houver variáveis ​​no CSS que serão processadas pelo WP. Como são criados dois arquivos diferentes para o carregamento de uma página, o WP inicia duas vezes e executa todas as consultas do banco de dados duas vezes, e é uma grande bagunça.

Se o controle deslizante estiver em apenas uma página e você desejar definir os estilos dinamicamente, sua melhor aposta será adicionar um bloco de estilo ao cabeçalho.

Em ordem de desempenho:

1. Adicione um pequeno bloco de estilos no cabeçalho, criado dinamicamente - Muito rápido
2. Adicionar uma folha de estilo não dinâmica via wp_enqueue_style - Médio
3. Adicione uma folha de estilo dinâmica via wp_enqueue_style - Muito lenta

É assim que eu costumo fazer:

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' );

Eu tive dificuldades com todas as recomendações deste tipo - talvez eu seja um pouco grossa, ou talvez os colaboradores tenham perdido o toque comum.

Eu decidi codificar isso no arquivo php do plug-in: -

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'/>";

Parece funcionar. Ele é carregado apenas nas páginas que usam o plugin. Carrega após a tag h1, o que é bom para mim. Não vejo como isso poderia ser mais eficiente ou mais claro.

.... mas talvez eu esteja errado - eu disse que estava um pouco grossa.

Atualização desde o Wordpress 3.3

Existe uma função chamada wp_add_inline_style que pode ser usada para adicionar estilos dinamicamente com base nas opções de tema / plugin. Isso pode ser usado para adicionar um pequeno arquivo css na cabeça, que deve ser rápido e eficiente.

<?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' );