WordPress テーマ解説
テーマ解説書は基本的なテーマ解説、用語説明に的を絞り、初めてWordPressをご使用になる方を対象にしています。HTML、テンプレートタグの解説については他の書籍に譲り、「Default_Theme(英語版)」を使った構造の解説をしています。
2009.01.14 23;32
テーマ(Theme)
WordPressのサイトデザインは「外観」-「テーマ」画面で切替えることができます。「テーマ」画面の中から、好きなデザインを選び、確認して、選択するだけです。また、WordPressをインストールすると、既に、いくつかのテーマ(Classic,Default)が添付されていて、そのまま使用できるようになっています。
サイトデザイン(デザインテンプレート)をWordPressでは「テーマ(Theme)」と言います。
「テーマ(Theme)」は階層化されたテンプレートファイルの総称で、システムが指定するフォルダ(wp-content/themes)に「テーマ (Theme)」をアップロードすると、システムが読み取り、サイトデザインとして反映され、表示されます。
「テーマ(Theme)」にはデザインの基本となる体裁を記述したスタイルシート(style.css)とWebサイトを表示するためのテンプレートファイル(index.php,single.php等)とで構成されています。Webサイトの構成により、ファイルの数も変わり、ファイルの構成も変わります。
テンプレートファイル(index.php,single.php等)にはそれぞれの表示に伴う機能によって、HTMLやテンプレートタグ、phpのコードが記述され、サイト構成によって組み合わされます。
テンプレートファイル(index.php,single.php等)は各ファイルによって、階層的な関係にあります。例えば、トップページを表示するためにはhome.phpを利用できますが、home.phpがない場合にはindex.phpが代行します。index.phpはその他のページ表示にも使用できるので、最低、CSSファイル(style.css)とindex.phpがあれば、「テーマ(Theme)」を構成することができます。
2009.04.08 20;30
Theme Directory
WordPressテーマを誰でもが、自由にダウンロードして、利用できるように、設置されたのが 「Theme Directory」 です。
WordPress.orgが運営しており、GPLライセンスで、いろいろなテーマが提供されています。検索して、見比べ、ダウンロードして、時には改良して使用できるようになっています。
「Theme Directory」にアクセスしてみると、テーマの一覧が表示されます。自分の好みの一覧を探して、気に入ったデザインを選択し、「Preview」でレイアウトを確認します。よろしければ、ダウンロードして、WordPressのthemesフォルダにアップロードしてみましょう。WordPressの管理画面でテーマを選択すれば、もう、使用可能です。
*しかも、選択したテーマがどれだけダウンロードされているかも、人気度も、「Theme Directory」を見れば、確認できます。
ところで、WordPressの普及が加速度的に進むなか、テーマデザインは、日々、多くのデザイナーや制作者によって、企画・開発され、提供されています。 提供の形態はさまざまで、優秀なWebデザイナーの方が有料で提供しているもの、テンプレートとして販売されているもの、GPLで無料提供されるもの、各種コードが公開・解説されているもの、など、いろいろな形式での提供がされています。
このように、簡単にテーマテンプレートが入手できるのも、WordPressの特徴です。WordPressのシステムがデザインテンプレートが提供しやすいこともあり、他のCMSにない長所になっています。「このデザインがすてきだなあ」と思った瞬間に自分のWEBサイトデザインにすることができます。但し、テーマによっては日本語対応していないものもありますので、注意が必要です。
2009.04.09 08;14
「Classic」と「Default」
WordPressをインストールすると、標準として、添付されているテーマが「Classic」テーマと「Default」テーマです。
WordPressのテーマについては、この「Classic」テーマと「Default」テーマが基準とされています。それぞれのテーマには特徴があり、構成も異なりますが、このテーマを基準としてテーマ制作をすることを推奨されています。
具体的には「Classic」テーマと「Default」テーマの内容を修正したり、テーマで使用しているファイル構成、記述を再利用して、新しいオリジナルテーマを作成します。
特に「テンプレートファイル」の投稿表示の記述や「パーツテンプレート」の記述はそのままコピーして、ブログサイトに使用することも可能で、典型的なパターン表現は何度も利用されています。(再利用の方が記述の失敗を防ぐことにもなります)
WordPressをCMSとして、Webサイトを構築する場合は、当然、「Classic」テーマと「Default」テーマはブログ用のテンプレートですから、用途別に構成を変え、記述も変更しなければなりません。また、一覧の表示の仕方、デザインの応用など多くの知識も必要になります。
テーマのテンプレート構成例:「Default」テーマ
| テンプレートファイル | |
|---|---|
| index.php | メインテンプレート |
| single.php | 記事用テンプレート |
| page.php | 固定ページ用テンプレート |
| archive.php | アーカイブ用テンプレート |
| archives.php | アーカイブタイトル一覧用テンプレート |
| 404.php | 404 Not Found用テンプレート |
| image.php | 画像用テンプレート |
| links.php | リンクページ用テンプレート |
| パーツテンプレート | |
| header.php | header記述用テンプレート |
| sidebar.php | sidebar記述用テンプレート |
| footer.php | footer記述用テンプレート |
| comments.php | コメント用テンプレート |
| comments-popup.php | ポップアップコメント用テンプレート |
| serchform.php | 検索フォーム用テンプレート |
| スタイルシート | |
| style.css | スタイルシート |
| 関数ファイル | |
| functions.php | 関数ファイル |
| その他 | |
| screenshot.png | 表示用画像ファイル |
| images | テーマ用画像フォルダ |
「Classic」テーマと「Default」テーマの詳しい解説はあるようでなく、WordPressを知るうえで、なかなか敷居の高いものでした。ファイルごとに1つ1つを読み、確認する作業はタイヘンです。ところが、「Classic」テンプレートと「Default」テンプレートを詳しく解説する書籍が登場しました。本サイトでも「Default」テーマを扱っていますが、詳しい解説を必要とする場合はお勧めです。
(基本からしっかりわかる WordPress 2.7 カスタマイズブック (Web Designing BOOKS) (単行本(ソフトカバー))大藤 幹 (著) )
2009.04.09 22;52
スタイルシート (style.css)
WordPressの「スタイルシート(style.css)」 とはWebサイトのレイアウトを定義するファイルです。
他のWebサイトと同様に「スタイルシート(style.css)」を使用すると、フォントや文字の大きさ、文字飾り、行間などの見栄えに関する情報やレイアウトに関する情報を、Webサイトの内容を記述した「テーマテンプレートファイル」から切り離すことができます。
「スタイルシート(style.css)」は「テーマ」の中の1つのファイルとして提供されますが(テーマごとにstyle.css が必要)、テーマに関する「スタイルシート」情報のに加えて、「テーマ説明(コメントヘッダ)」がファイルの先頭に必要になります。この記述は管理画面の「外観」で「スクリーンショット(screenshot.png)」とともに表示されますので、必ず、記述しないと、「テーマの説明」が表示されずどのテーマなのか識別できなくなってしまいます。
Theme Name: テーマ名
Theme URI: テーマのホームサイトの URI
Description: テーマの説明
Author: テーマの制作者の名前
Author URL: テーマの制作者の URL
Template: 継承テンプレート指定(op:継承がない場合は不要)
Version: バージョン番号(op)
tags:テーマの種類タグ 注意点・留意点・利用許諾の記述など(op)
*/
最も単純なテーマには、style.css ファイルと画像だけで構成されます。その際には「Template: 継承テンプレート指定(op)」で他のテーマテンプレートファイルを含むテーマ名を記述します。また、「テーマ説明(コメントヘッダ)」とともに、テーマを表示する「スクリーンショット(screenshot.png:300×225の画像ファイル)」も必要ですので、必ず、テーマファイルにアップロードしておきましょう。また、「テーマ説明(コメントヘッダ)」は標準で添付されている「Default」テーマ等を参考に作成してみましょう。
2009.04.10 17;21
関数ファイル(functions.php)
WordPressのテーマには、「関数ファイル(functions.php)」を含めることができます。
WordPressは起動する際に、テーマのファイルを読み取って、Webサイト表示をしますが、その際、「関数ファイル(functions.php)」も、テーマ特有の関数として自動的に読み込まれ、WebサイトやWordPress本体に反映されます。
「関数ファイル(functions.php)」にPHPでコーディングされた関数が定義してあると、WordPressはそれを読み込み、サイト表示、管理画面等に反映させます。 例えば、拡張機能を定義して、テンプレートファイルに反映させたり、標準機能としてある機能を反映させずに、表示できなくしたりすることができます。また、追加機能や拡張機能用の管理画面を設置したりできますので、とても、幅広い活用が可能です。
同じような機能拡張である「プラグイン」はWordPress本体とは別のソフトウェアとして組み込まれ、どのテーマでも機能しますが、「関数ファイル(functions.php)」はWordPressの中の「テーマ」の一部として、「特定のテーマ」でのみ機能します。
関数ファイル(functions.php)使用例
「Default」WordPress テーマには、関数と管理画面を定義する functions.php ファイルが入っているので、見本にするといいでしょう。functions.php は基本的にプラグインのように動作するので、このファイルでできることの情報は、「プラグインの作成」を参照してください。
2009.04.11 01;30

