投稿記事や固定ページを作成する際、『この記事は他とデザインを少し変えたいな』と思うことがあります。
HTMLタグ内へ直接CSSを記述すると、テキストエディタの本文がごちゃごちゃに見にくくなってしまい、あとから編集するのがちょっと面倒……。
エディタには本文だけが記述されていた方が、編集しやすいしスマートです。
こういう場合、記事ごとにCSSを追加できたら便利になりますよね。
そんなときは記事・固定ページに個別でCSSを追加できるようになるプラグイン【WP Add Custom CSS】がおススメです。
【WP Add Custom CSS】を使用すると、投稿画面に『カスタムCSS』の入力フィールドが表示されるようになります。
こんな場合におススメ
- 特定の投稿記事・固定ページごとにCSSを追加したい
プラグインを使ってできること
- 投稿画面に『カスタムCSS』の入力フィールドを表示し、記事・固定ページごとに個別にCSSを追加できる
スポンサーリンク
使用イメージ
インストール方法
- ダッシュボードから プラグイン > 新規追加 とクリックする
- “WP Add Custom CSS“で検索する
- “今すぐインストール”をクリック。インストール後、有効化する
または、配布サイトからダウンロードして、インストール。
WP Add Custom CSS – WordPress プラグイン | WordPress.org
手動でインストールする方法はコチラ
関連記事
WordPressのプラグインをインストールする方法は、全部で3つあります。 ダッシュボードから検索してインストールする ダッシュボードからZIP形式のファイルをアップロードする FTPでサーバーにアップロードする […]
表示方法
【WP Add Custom CSS】プラグインを有効化すれば、自動的にカスタムCSS入力フィールドが表示されるようになります。
もし、表示されないようでしたら、『表示オプション』内の『Custom CSS』にチェックが入っているかを確認してください。
【WP Add Custom CSS】の設定
プラグインを有効化すると、管理画面に【Add Custom CSS】という項目が追加されるので、そこから行います。
| CSS rules | サイト全体に適用したいCSSを記述する |
|---|---|
| Available post types：CTA | 投稿タイプ：CTAに対して、【Add Custom CSS】を有効にするかの可否 |
| Advanced editor：Enable | 行番号やコードの色付けなど、高機能エディタを有効にするかの可否 |
| Advanced editor layout | 高機能エディタのレイアウトを選択（ダークまたはライト） |
動作確認環境
- バージョン 1.1.5
- WordPress 5.2.2
まとめ
- 【WP Add Custom】は、記事・固定ページごとに異なるCSSを追加できるようにするプラグイン。
- 記事・ページごとに、CSSデザインを変えることができるようになります。