Cocoonで棋譜を表示させるときに困ったのが外部ファイルの読み込み。特定のカテゴリーでのみ外部ファイルを読み込ませる方法をご紹介します。
Cocoonで外部ファイルを簡単に読み込ませる
外部ファイルを読み込ませるときに考えたこと。
- カスタムフィールドの指定するのが面倒。
- 読み込むスクリプトファイルを早く読み込ませたいけれど、header.phpへ書き込みたくない
- Cocoonの詳細設定では、全てのページで読み込まれてしまう。
なぜ、こんなことをしたいのかというと、
ページスピードの低下や、スクリプトの影響でAMPでエラーが発生したりすることがあるので、できるだけ関係ないページではスクリプトを読ませない方が得策
だからです。
Cocoonではユーザーがスクリプトなど読み込むときに利用できるように、別にファイルを用意してありましたので、そちらを使って実現させました。
外部ファイルを読み込ませる方法
前提条件
- Cocoonの子テーマを利用していること
- スクリプトは、FTPファイルでアップロードしていること
手順
１．外観→テーマエディター→tmp-user→head-insert.phpを選択する
２．読み込ませるHTMLを入力する
今回は、カテゴリーIDが30の時にだけスクリプトを読み込ませたいので下記のようになります。
<?php if(in_category(30)) : ?> カテゴリーIDは、下記の方法で確認できます。
１．投稿→カテゴリー
２．該当するカテゴリーをクリック
３．URLバーに表示されている番号を確認する
実際にはこのようになります。
//カテゴリー番号を指定したIF文
<?php if(in_category(30)) : ?>
//カテゴリーが30だったら下記のコードを読み込む
<script type="text/javascript" src="http://soyo.life/***.js"></script>
<script type="text/javascript" src="http://soyo.life/***.js"></script>
<link type="text/css" href="http://soyo.life/***.css" rel="stylesheet">
<?php endif; ?>
//ここまで
<?php
//ヘッダー部分（<head></head>内）にタグを挿入したいときは、このテンプレートに挿入（ヘッダーに挿入する解析タグなど）
//子テーマのカスタマイズ部分を最小限に抑えたい場合に有効なテンプレートとなります。
//例：<script type="text/javascript">解析コード</script>
?>
<?php if (!is_user_administrator()) :
//管理者を除外してカウントする場合は以下に挿入 ?>
<?php endif; ?>
<?php //全ての訪問者をカウントする場合は以下に挿入 ?>
４．ファイルを更新して終了
この方法の良いところ
修正点が一箇所だけで済むのが大変助かります。
個別に指定するよりも、このように大元のファイルで条件を設定してしまえば、指定し忘れることもありません。
なによりも、カテゴリーを選んで保存するだけ、という普段の作業の延長線上で済む、というのが大変助かります。
それゆえに、どこで設定したか忘れやすい、ってこともあるんですけどね😁
忘れたら、こちらのページへ戻ってきて確認してくださいね♪
おわりに
いかがでしたか？
この方法はheader.phpへ書き込む必要がないので、header.phpは読みやすいまま♪
こういう使いやすい設計をしてあるCocoon、本当にすごいテーマです♪
ありがとうございます。
Twitterで日々の生活のことTweetしています。気に入ってもらえたらフォローよろしくお願い致します♪
コンテンツがお役に立てれば幸いです。
コメント