以前に以下の記事で「特定のページごとに背景色を変更する方法」を解説しました。
しかし、中には
ケケンタ「ページごと」っていう細かい括りじゃなくて、「固定ページ」、「投稿ページ」って感じでもっと大きな枠ごとに設定したいんだよな
という方もいらっしゃるかと思います。
そこで今回は、
固定ページ・投稿ページ・カテゴリーページなど
ページ種類に応じて背景色を設定する方法
をご紹介していきます。
＼Web制作を仕事にしたいなら／
こちらの記事で
Web制作コース独学プラン
についてご紹介しています。
￣￣￣
日時指定便が「無料」で使えるので不在で商品を受け取れないという心配が無くなる
最短で注文した「翌日」に商品が届くので欲しいものがすぐ手に入る
※ご注文の時間帯やお住まいの地域によります。
Amazonプライムの無料体験は「何度でも」利用可能
Amazonプライムの無料体験を何度も利用する方法
- Amazonのカート画面で表示される「Amazon Primeの無料体験の案内」をクリック
- 会員の自動更新を解除しておく＝期限が来たら自動解約
- １～３ヶ月ぐらいするとAmazonのカート画面で再度無料体験の案内が表示される
ケケンタ僕自身、過去に少なくとも３回は無料体験を利用しています。
※条件は不明ですが、解約後に一定期間が経過すると、再び「Amazon Prime無料体験の案内」が表示され、再度利用することが可能です。
ソースコード
早速ですが、ベースとなるソースコードは以下のようになります。
function my_headinputtags() {
$headinputtag = '';
if ( ページ種類の判定条件 ) {
$headinputtag = <<<EOM
<style>
body {
background-color: ここに任意のカラーを設定;
}
</style>
EOM;
}
echo $headinputtag;
}
add_action( 'wp_head', 'my_headinputtags', 99);上記のソースコードに、「ページ種類を判定するための条件分岐タグ」と「任意のカラー」を設定するだけで、ページ種類ごとに背景色を変えることが可能です。
（例）固定ページの背景色を「green」に設定
function my_headinputtags() {
$headinputtag = '';
if ( is_page() ) { // 固定ページかどうかを判定
$headinputtag = <<<EOM
<style>
body {
background-color: green; // カラーに「green（緑）」を指定
}
</style>
EOM;
}
echo $headinputtag;
}
add_action( 'wp_head', 'my_headinputtags', 99);主要な条件分岐タグ
ご参考までに、主要な条件分岐タグをいくつか掲載します。
ケケンタページ種類の判定にご活用ください。
| 条件分岐タグ | 判定内容 |
|---|---|
| is_front_page() | トップページかどうか判定 |
| is_home() | 投稿一覧ページかどうか判定 |
| is_page() | 固定ページかどうか判定 |
| is_single() | 投稿ページかどうか判定 |
| is_category() | カテゴリーページかどうか判定 |
| is_tag() | タグページかどうか判定 |
まとめ
以上がページ種類ごとに背景色を変更する方法でした。
今回ご紹介したソースコードを使用すれば簡単に実装可能ですので、ぜひご活用いただけると嬉しいです。
ケケンタそれでは、最後までご覧いただきありがとうございました。
当ブログではWordPressやWeb制作、PHPに関する情報を発信しています。
他の記事もご覧いただけると嬉しいです。
コメント