030

2014.01.07

wordpressで投稿記事ごとにCSSを効かせるのは、カスタム・フィールド・テンプレートでもできる!

このエントリーをはてなブックマークに追加

wordplessで投稿記事ごとにCSSを効かせたい!と思った時、Googleで検索をかけると「Add css to post」という便利なプラグインを使う方法や、「functions.php」にそれ用のコードを記述する方法がヒットします。基本的にそのパターンでOKです。ども、WEB&グラフィックデザイナーのヒロ@札幌です。

上記で全然OKなんですが、今回の場合、これ以上プラグインを増やしたくなかったことと、「functions.php」内も混み合っててもう記述を増やしたくなかったので、あらかじめ入れておいたカスタム・フィールド・テンプレート(Custom Field Template)で代用してみました。

 

手順はこんな感じです▼
1 管理画面の「設定」からカスタム・フィールド・テンプレートを開きます。
  テンプレートコンテンツ:の覧に下記を記述します。
  ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
  [CSS]
  label = この記事に独自のCSSを適用したい場合は↓ここに記述してください。
  type = textarea
  rows = 10
  cols = 80
  ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー

 

2 管理画面の投稿ページを確認すると、
  CSS記述用のボックスができています。

CFT-CSS_img

 

3 single.phpなど、記事が表示されるページに

  ↓下記を記述してCSSを呼び出せるようにしておきます。

 

4 管理画面投稿ページのエディタをテキスト側にして、
  CSSを効かせたい文章をidやclassタグなどでくくります。

 

5 あとは上記2のCSSボックスに記述すればOKです。
  例えば罫線で囲みたい場合はこんな感じで!

 

囲む

  • アーカイブ

このエントリーをはてなブックマークに追加