web-dev-qa-db-ja.com

スタイルシートなしでwp_add_inline_styleを使う

作成しているカスタムテーマのヘッダーにカスタムインラインスタイルを追加する必要があります。私はwp_add_inline_style()関数に出くわしました。それはうまくいきますが、それは特定のスタイルシートに依存するので、私にはあまり向いていません。スタイルシートに依存せずに、headタグの最後にインラインスタイルを追加する必要があります。

テーマスタイルシートまたは存在しないスタイルシートを設定しようとしました。どちらの場合も、うまくいきますが、ちょっと汚いハックのIMOです(テーマスタイルシートを2回読み込むか、ゴーストファイルを参照してください)。スタイルシートに頼らずにインラインスタイルをheadに追加する適切な方法はありますか?

もちろん、それらをheader.phpファイルに直接追加することもできますが、これは避けたいと思います。

13
terzag

あなただけのページヘッドに直接スタイルを追加する必要があります。あなたがフックを持っているテーマを使っていると仮定して、これをする最も良い方法は 'wp_head'アクションフックを使うことです。そのようです:

add_action('wp_head', 'my_custom_styles', 100);

function my_custom_styles()
{
 echo "<style>*{color: red}</style>";
}

アクションフックの詳細については WP codex をご覧ください。

19
SkyShab

あなたは単に "ダミー"ハンドルを使うことができます:

wp_register_style( 'dummy-handle', false );
wp_enqueue_style( 'dummy-handle' );

wp_add_inline_style( 'dummy-handle', '* { color: red; }' );
13
Flix

あなたのテーマはたいていデフォルトのスタイルシートを持っています(そうでなければそれはテーマとしてロードされさえしないでしょう)。インラインCSSのハンドラーとしてこのスタイルシートを使うだけです。例はテーマTwentyFifteenの functions.php にあります(コードは簡潔にするためにスキップしました)。

function twentyfifteen_scripts() {
    wp_enqueue_style( 'twentyfifteen-style', get_stylesheet_uri() );

}
function twentyfifteen_post_nav_background() {
    wp_add_inline_style( 'twentyfifteen-style', $css );
}
3
Casper