WordCamp Fukuoka 2010の2次会@APIカフェにて紹介させていただいた、「テーマを学ぶ為のテーマ」、名付けてManabiTheme、を公開します!
このManabiTheme(学びテーマ)は、「テーマを学ぶ為のテーマ」として作成しました。外部に公開するWordPressブログ用のテーマとしても使用可能ですが、それよりは、ローカル環境(XAMPP等)にてWordPressテーマを学ぶ為に使用されることを主たる目的として作成しています。
去年の秋頃だったと思うんですが、@khoshinoさんが、とあるWordPressの勉強会にてこんな趣旨のつぶやきをされました。
「テーマを学ぶ為のオススメのテキストやサイトは?」
このつぶやきに反応して、僕を含めて何人かの方がオススメしたのを纏めると。
「一番良いテキストブックは良いテーマ。」
僕はWordPressのテーマを1.5系からいじっているのですが、ある程度基礎的な事が分かると、あとはダウンロードしてきたテーマのコードを読んで学びました。XHTMLとCSSも、「これは!」と思うサイトのソースを読んでましたね。
で、@khoshinoさんに「ではどのテーマが良いですか?」と聞かれて改めて気がついたのですが、最近は「勉強するならこれがいいですよっ」と1つ進められるテーマがないんですよねぇ。WordPressが多機能になるにつれ、テーマの中身が複雑化しました。例えばサイドバーのウィジット化やコメントのスレッド化です。そして、公式レポジトリにアップされるテーマの数が多くなるにつれ、テーマ作者は競うように高機能化を進めていく。例えば、管理画面から各種設定が行えたり、様々な種類のレイアウトからお好みのを選択できたり。悪くはもちろんないんですが、テーマを独学する為の教材としては敷居が高くなってしまった感は否めませんね。
ならば、それに適したテーマを作ってみよう、と思って作成したのがこのManabiThemeです。他人のソースコードを(良い意味で)盗み、学ぶのは、スキルアップに不可欠だと個人的には思います。このManabiThemeがその入り口となってもらったり、きっかけの1つになってもらったら幸いです。
幾つか特徴をご紹介いたします。
ブログのデザインをちょこっと変えました。これで少しすっきりしたかと。右側の黄色を取っ払おうかどうか考えましたが、結局は以前よりもちょっとだけ細くして、メインコンテンツとの間のホワイト・スペースを増やしました。

その他には、コメントやコメント周りや…
[… Read More]
この記事について:この記事は2007年5月に公開した物を再アップした物です。詳しくはこの記事を参照してください。
ここでは具体的にWordPressテーマのファイルやディレクトリ構造を見ていきます。
最低限必要なテンプレート・ファイルはどれなのか?
モジュールは?
などなど、テーマの中身が分かると思います。
この記事について:この記事は2007年5月に公開した物を再アップした物です。詳しくはこの記事を参照してください。
WordPressの他にサーバ・インストール型のブログ・ツールを使用した事がある方は、テーマのフォルダ内を覗いただけでWordPressテーマの仕組みは大体分かるんじゃないかと思います。
ここでは、前章で述べたウェブ・スタンダードに準拠する形でコーディングされたXTHML+CSSのブログ・デザインが、どの様にテンプレート・ファイル、更にWordPressテーマと成っていくのかを追っていきます。
こ こに一般的なブログのトップページ(ホーム)が有るとします。ブログ・ツールはWordPressでも、Movable Typeでも、Serene Bachでも、何でもかまいません。ヘッダー、サイドバー、フッターがあり、コンテンツ部分には最近の記事が幾つか表示されています。このページは XHTMLでコーディングされ、外部CSSファイルによって見た目がコントロールされています。この何の変哲も無いウェブ・スタンダードな XHTML+CSSが目の前にあると思ってください。そしてCSSはいったん横に置き、XHTMLの方に注目します。
ブ ログでは、状況によって表示内容が変化する箇所が幾つかあります。記事のタイトル、日付、カテゴリ、タグ等はもちろんの事、トップページやアーカイブ表示 は時系列で記事が並んでいるので、新しい記事を投稿するたびに古い記事は下へ下へと移動していきます。さらに、例えばサイドバーにカテゴリの一覧をリスト 表示しているとすると、新たなカテゴリを作れば自動的にそのリスト付け加えて更新、表示してくれれば非常に便利です。
この記事について:この記事は2007年5月に公開した物を再アップした物です。詳しくはこの記事を参照してください。
WordPressテーマの説明に入る前にブログで実践されるウェブ・デザインを知っておく必要があります。正直言って、WordPressテーマ をカスタマイズ、もしくは作成するにあたって重要なのはPHPよりも、XHTML+CSSでコーディングされたウェブ・スタンダードなサイトを作れるスキ ルです。(データベースからの結果を操作する、設定パネルを作る、等のよほど凝ったカスタマズでない限り。)
ここでは、WordPressテーマの構造を理解するのに必要な一般的なブログのレイアウトと、ウェブ・スタンダードとの関連性についてだけを簡単に解説します。XHTMLとCSSのスキルが足りないと感じている方は、ほかのサイトや書籍も参考にして下さい。
最 近は幾つか個性的なデザインも出てきましたが、まだまだ下の画面のようなデザインが一般的ではないでしょうか。ヘッダー(Header)とフッ ター(Footer)にサンドイッチされる形で、コンテンツ(Content)とサイドバー(Sidebar)があります。画面はWordPressの ディフォルト・テーマですが、ここではサイドバーが右に配置されています。テーマによっては、右側に表示されていたり、左右両方に表示されていたりしま す。