WordPress

WordPressでカスタムフィールドを使って任意のコードやファイルをhead内に読み込ませる

以前「WordPressで特定の記事やページにカスタムフィールドで指定したCSS・JSファイルを読み込む」という記事を書いたんですが、こちらは指定したファイルを読み込ませるものでした。で、今回はカスタムフィールドに設定した値をそのままhead内に読み込ませるカスタマイズです。なので、フルパスで何かを読み込ませてもいいし、CSSやJavaScriptを直書きしても反映してくれるようにしてみます。

[ads_center]

カスタムフィールドの値を読み込ませる

以下をfunctions.phpに記述します。

// header内に任意のコードを読み込む
function head_original_load(){
    if(is_single() || is_page()){
        if($head_original_code = get_post_meta(get_the_ID(), 'head_load', false)){
            foreach($head_original_code as $head_code){
                echo $head_code . "\n";
            }
        }
    }
}
add_action('wp_head', 'head_original_load');

前回のコードを少し削っただけですが、これで好きなコードを読み込ませることができました。

カスタムフィールドの名前にhead_loadと指定して、あとは値に自分が読み込みたいファイルやスクリプトを記述するだけです。カスタムフィールドを設定した数の分だけ読み込むので、複数設定しても大丈夫です。

WordPressカスタムフィールド

例えば上記画像のように、グーグルフォントを読み込んだり、JavaScriptを記述したり、CSSを直接設定したりと自由度が高くなりますね。

カスタムフィールドは設定した記事のみ反映されるので、とても便利です。

jQueryでウィンドウサイズによって処理を変えるjQueryで$.inArrayを使えば配列の中に指定した値が何番目に入ってるか知ることができる前のページ

あとで読む「Readability」にChrome/iPhone/Reederなどから簡単に情報を送る設定方法や使い方色々次のページ

関連記事

  1. WordPress

    WordPressでウィジェットのアーカイブを一発でドロップダウンにする超簡単な方法

    知らなかったですこれ。前からずっとアーカイブをドロップダウンにできない…

  2. Daily Dish

    WordPress

    写真が映える2カラムのシンプルでスッキリしたWordPressテーマ「Daily Dish」

    Daily DishというWordPressテーマがとてもカッコよかっ…

  3. WordPressのログイン時のツールバー

    WordPress

    WordPressでキーワードを登録しておくと自動でリンクをつけてくれるプラグイン「WP Keywo…

    なかなか便利だったのでご紹介します。WordPressで自分が登録した…

  4. WordPressのログイン時のツールバー

    WordPress

    the_tagsを使ってWordPressの投稿タグを表示させたり表示形式を替えたりしてみる

    WordPressで各記事につけた投稿タグを表示させたい場合にはthe…

  5. WordPress

    Google XML SitemapsプラグインでWordPressにサイトマップ作成

    WordPressにはロボット向けのXMLサイトマップを自動生成してく…

  6. WordPress

    WordPressでコメント欄などに表示されるアバター「Gravatar」に登録してみる

    毎回、今更感全開の記事ですが時間が少しあったのでGravatarに登録…

コメント

  1. この記事へのコメントはありません。

最近の記事

  1. 甘柿
  2. 冬用のふとん
  3. 田沢湖
PAGE TOP