Webの記録

WordPress オリジナルテーマでデザインをカテゴリごとに変更したい時

投稿日:

この記事は約 3 分で読めます。

オリジナルテーマを自分で作成していて、それぞれのカテゴリーごとにテンプレートを変えたり、デザインを変えたりしたい時。
いろいろな方法があると思います。

「bodyにカテゴリごとのclassがつける方法」と、「固定ページに独自のテンプレートを作って設定する方法」を試してみました。

いろいろと方法を探すのに時間がかかってしまったので、忘れた時のためにメモとして残します。

WordPress.orgの「Codex」を参考にしていますので、詳しくは「Codex」をチェックしてみてください。

bodyにカテゴリー名を入れる

投稿の個別ページのデザインをカテゴリごとに変えるのに、cssをいじりました。
その為に、bodyのclass名にカテゴリ名が入るように以下を加えました。

headerのbody部分に追加

headerのbody部分を以下のように書きます。
これを入れるとclassに様々なclass属性が追加されます。

<body <?php body_class(); ?>>
functions.phpに追加

functions.phpに以下の文を記述。
(//の行はコメントですので、好きなように書き換えしてください)

// add category nicenames in body and post class
function category_id_class($classes) {
	global $post;
	foreach((get_the_category($post->ID)) as $category)
		$classes[] = $category->category_nicename;
	return $classes;
}
add_filter('post_class', 'category_id_class');
add_filter('body_class', 'category_id_class');

FireBugで見たbody_class()だけを入れたhtmlソースコード
下の例の画像では投稿記事の個別ページを表示しているので、「single」がclass名に入っています!

FireBugで見たfunctions.php追加後のhtmlソースコード
カテゴリ名がclassの中に入りました!!

参考

Codex

固定ページに独自のテンプレートを作って設定する

固定ページで独自の設定(デザイン)をしたい時に、その固定ページ専用のテンプレートを作る方法があると思います。

作り方は簡単!適当な名前のphpファイルを作って、以下の3行をそのphpファイルの先頭に書き込みます。

<?php
/* Template Name: ここにテンプレートの名前を入れます */
?>

その後は、独自のテンプレートとして必要なものを記述してテーマの中に保存します。

保存出来たら、固定ページの「新規追加」もしくは「編集」の画面を開きます。

右側に「ページ属性」という項目があり、その中の「テンプレート」から独自のテンプレートが選べるようになっていると思います。
これを選択する事で、固定ページのテンプレートを使い分ける事が出来るようになります!

-Webの記録
-,

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

This blog is kept spam free by WP-SpamFree.

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

関連記事

no image

MacでもWindowsでもOKな「AMPPS」でローカル環境を作ってみる

この記事は約 1 分で読めます。 以前、ローカル環境では「XAMMP」と「MAMP」の環境を作ってみました。 今回は、MacでもWindowsでも使える「AMPPS」でローカル環境を作ってみました。 …

no image

Facebookページをタイムラインに移行してみた♪

この記事は約 1 分で読めます。 2012年3月1日、Facebookページで大きな変化がありました! いままで「いいね!」を獲得する為に様々な方法がとられていましたが、「タイムライン化」になった事で …

no image

Webサイト移転の時に自動的にジャンプする方法

この記事は約 1 分で読めます。 たまたまいじっていたサイトでサーバーを移転する事になりました。 そんなワケで、ちょこっとメモ。 今回、独自ドメインをとっていなかった為、URLが変わります。 その場合 …

no image

苦手なJavaScriptをイチから勉強してみる【関数編】

この記事は約 1 分で読めます。 苦手なJavaScriptをイチから勉強してみる【イベント編】の続きとしてメモします。 イチから「JavaScript」を学び直しをする為に記録を残しています。少しず …

no image

WordPress 管理画面でメモが自由に書けるプラグイン「Plugin Memorandum」

この記事は約 1 分で読めます。 WordPressには便利なプラグインがたくさんあって、いろいろ試していたら・・・気がつくと大量のプラグインで画面がいっぱい!!「コレ何だったっけ?」というプラグイン …