WordPressで固定ページにも投稿フォーマットを有効にしてページごとに違うスタイルを適用する。

WordPressの投稿フォーマットを使用すると、投稿毎に異なったスタイルを適用することができるので、超便利です。

しかし、この便利な投稿フォーマットはデフォルトでは固定ページで使用できません。

代わりに固定ページではページテンプレートというのが使用できますが、テンプレートファイルを作ったりCSSを書いたりするのが面倒だったので、固定ページで投稿フォーマットを有効にしてみました。

以下は、テーマファイルのfunctions.phpに記述して下さい。

ステップ1: 固定ページの投稿画面上で投稿フォーマットを有効にする。

管理画面側で投稿フォーマットを有効にするには以下の1行をfunctions.phpに記述するだけでオッケーです。

add_post_type_support('page', 'post-formats');

たったこれだけで以下のように投稿フォーマット選択用のメタボックスが追加されました。

固定ページの一覧画面でも以下のような感じで投稿フォーマットが表示されます。

ステップ2: 投稿フォーマットに応じたclass属性を出力する。

密かにステップ1の作業だけでclass属性が出力されることを期待したのですが、残念ながらこの部分はsingleページかどうかの条件分岐の中に入っていたので、フィルターフックでclass属性を追加する必要があります。

以下のソースをテーマのfunctions.phpにコピペして下さい。

add_filter("body_class", "my_body_class");
function my_body_class($classes) {
    if (is_page()) {
        global $post;
        $fmt = 'page-format-'.get_post_format($post->ID);
        $classes[] = $fmt;
    }
    return $classes;
}

ここまでの作業が完了したら、固定ページ上で任意の投稿フォーマットを選択して、実際のページ上のbody要素にpage-format-asideなどのclass属性が追加されたことを確認して下さい。

あとは、CSSをゴニョゴニョするだけです。