Genesisサイトの投稿にPost Classを追加する方法

Genesis には、管理画面から追加できる『Post Class』というものがあります。

Body Classと同じように使うことができるクラスなんですが、Post Classはbodyではなく、それぞれの投稿にクラスを追加できるので、「おすすめ記事」のように他の投稿とは扱いを変えたいときに便利です。

※ Body Classはbodyタグ（ページ全体）にクラスを追加することができます。

Post Classを追加する方法

Post Classを追加したい投稿の編集画面を開き、『Layout Settings』のパネルに移動します。

『Custom Post Class』という入力欄があるので、ここにアルファベットでクラス名を入力します。

ここでは試しにtest-classと入力してみましょう。

設定を保存すると、Post Classを追加した記事にだけ、<article>タグにtest-classというタグが追加されました。

※ お使いのテーマによっては、<article> 以外のタグにPost Classが追加される場合があります。

あとは下のような感じで、お好みに合わせてCSSやJavaScriptなどを追加すれば、その記事だけ扱いを変えることができます。

.test-class {
    background: #fafafa;
    padding: 1em;
    border: 5px solid #eee;
}

ちょっと分かりにくいんですけど、、、投稿の背景がグレーになって、境界線が5pxでできました。
余白も追加されています。

こんな感じで、他の投稿と扱いを変えることができます。