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プラグイン「RSS Footer」

    RSS FooterというWordPressのプラグインなんですが、こ…

  2. WordPressテーマ「Ignite」

    WordPress

    レスポンシブ対応のクリーン&エレガントなフリーのWordPressテーマ「Ignite」

    個人的にとてもいいなーと思ったWordPressテーマがあったのでメモ…

  3. WordPress

    WordPressで自分だけのショートコードの作り方

    WordPressのショートコードが便利なのでちょこちょこ使い始めてま…

  4. Last Updated Shortcode

    WordPress

    最後に更新された日付時間をショートコードで表示できるWordPressプラグイン「Last Upda…

    WordPressの記事内に最後に更新した日付時間を表示できるWord…

  5. Quote Tweet

    WordPress

    選択したテキストをツイートできるWordPressプラグイン「Quote Tweet」

    Quote Tweetはサイト内で選択したテキストを簡単にツイートする…

  6. WordPress

    予約投稿をカレンダーで一覧管理できるWordPressプラグインEditorial Calendar…

    こちらの記事を見て予約投稿っていいなぁって思ったので初めて使ってみまし…

コメント

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

最近の記事

  1. オータムスイートポテトフラペチーノ
  2. 紅葉
  3. ナノケア EH-NA0E
  4. スターバックス コロンビア サンタンデール

アーカイブ

PAGE TOP