Eu preciso adicionar estilos inline personalizados ao cabeçalho de um tema personalizado que estou criando. Eu me deparei com a função wp_add_inline_style() , que funciona, mas não me serve muito, já que depende de uma folha de estilo específica. Eu precisaria adicionar estilos inline no final da tag head sem uma dependência de folha de estilo.
Eu tentei definir a folha de estilo do tema ou uma folha inexistente. Em ambos os casos, funciona, mas é um pouco IMO (ou carrega a folha de estilo do tema duas vezes ou se refere a um arquivo fantasma ...). Existe uma maneira correta de adicionar estilos inline na cabeça sem depender de uma folha de estilo?
Claro, eu poderia adicioná-los diretamente no arquivo header.php, mas eu gostaria de evitar isso.
Você só precisa adicionar os estilos diretamente ao cabeçalho da página. A melhor maneira de fazer isso é usar o gancho de ação 'wp_head', supondo que você esteja usando um tema que tenha o gancho. Assim:
add_action('wp_head', 'my_custom_styles', 100);
function my_custom_styles()
{
echo "<style>*{color: red}</style>";
}
Confira o Códice do WP para saber mais sobre ganchos de ação.
Você pode simplesmente usar um identificador "fictício":
wp_register_style( 'dummy-handle', false );
wp_enqueue_style( 'dummy-handle' );
wp_add_inline_style( 'dummy-handle', '* { color: red; }' );
Seu tema certamente tem uma folha de estilos padrão (caso contrário, não seria carregado como tema). Use esta mesma folha de estilos como o manipulador do seu CSS in-line. Um exemplo pode ser encontrado no functions.php do tema TwentyFifteen (código ignorado por brevidade):
function twentyfifteen_scripts() {
wp_enqueue_style( 'twentyfifteen-style', get_stylesheet_uri() );
}
function twentyfifteen_post_nav_background() {
wp_add_inline_style( 'twentyfifteen-style', $css );
}