<?xml version="1.0" encoding="UTF-8" standalone="yes"?><oembed><version><![CDATA[1.0]]></version><provider_name><![CDATA[iDeasilo]]></provider_name><provider_url><![CDATA[https://ideasilo.wordpress.com]]></provider_url><author_name><![CDATA[Takayuki Miyoshi]]></author_name><author_url><![CDATA[https://ideasilo.wordpress.com/author/miyoshita/]]></author_url><title><![CDATA[Sandbox テーマ]]></title><type><![CDATA[link]]></type><html><![CDATA[<h4>Sandbox テーマとは</h4>
<p><a href="http://www.plaintxt.org/themes/sandbox/">Sandbox</a> という画期的なコンセプトのテーマが最近注目されていて、WordPress の<a href="http://factoryjoe.com/blog/2006/08/06/wordpress-makes-a-move-towards-hatom-gets-upgrades/#comment-14246">次期デフォルト・テーマの有力候補とも</a>目されています。</p>
<p><strong>Update: 2007年12月25日に公開された Sandbox 1.2 について<a href="https://ideasilo.wordpress.com/2008/01/03/sandbox-12/">こちらに書きました</a>。</strong></p>
<p>従来 WordPress のテーマというのは PHP テンプレートと CSS のスタイルシートがパッケージ化されたものでしたが、Sandbox ではこれらを明確に分離して、スタイルシート部分を &#8220;スキン&#8221; という新導入のレイヤーに置き換えました。テンプレートは単一のまま、スキンは複数から選ぶことができます。ちょうど現在テーマを複数から選んでいるように、Sandbox テーマの中でスキンを選ぶことができるようになるというわけです。</p>
<p>従来のテーマでは PHP と CSS の両方を理解していないとテーマの中身をいじることが難しかったので、デザイン担当とコーディング担当に分業するような場合に少々都合が悪かったですが、Sandbox ではその辺がやりやすくなると思います。</p>
<p>単にスキンが選べるようになるだけではありません。Sandbox ではテンプレートの主要な要素の class 属性に豊富なセマンティック情報を盛り込んでいて、そのおかげで CSS のセレクタ指定の自由度が格段に高くなっています。実際に見た方が早いですが、</p>
<pre>&lt;body class=&quot;wordpress y2006 m08 d16 h03 single s-y2006 s-m08 s-d06 s-h10 
    s-category-uncategorized s-author-admin loggedin"&gt;</pre>
<p>例えばこの body 要素に見られるように、今表示しているページにどのような情報が含まれているかを示すかなり細かい情報がクラスとして盛り込まれます。</p>
<p>クラス指定の全種類とそれぞれの意味について最後に一覧でまとめています。</p>
<p>Sandbox は <a href="http://microformats.org/wiki/hatom">hAtom マイクロフォーマット</a>をサポートしています。hAtom についてはまだ良くわかっていませんが、ブログやニュース記事などが持つセマンティック情報を class 属性などの形で XHTML そのものの中に埋め込む仕様のようです。この辺はもう少しわかったら詳しく書きたいと思います。<br />
<!--more--></p>
<h4>インストールと日本語化</h4>
<p>Sandbox テーマは 2.0 以降の WordPress に対応しています。<a href="http://www.plaintxt.org/themes/sandbox/">ここからダウンロード</a>したら、普通のテーマと同じように &lt;WP_INSTALL&gt;/wp-content/themes/ 以下に展開して、管理パネルにログインして [Presentation] » [Themes] から Sandbox を選択します。スキンの選択は [Presentation] » [Sandbox Skins] から行ないます。</p>
<p>スキンの CSS ファイルは Sandbox を展開したディレクトリの中の skins ディレクトリに配置されています。オリジナルのスキンを作成する場合はここに CSS を置いて、他のスキンを参考に冒頭のコメント部分にスキンの説明を加えます。</p>
<p>表示されるテキストを日本語化したい場合は、gettext の日本語翻訳を行ないましたので<a href="http://www.miyoshitakayuki.com/wp-content/uploads/sandbox-ja.zip">こちらの翻訳ファイルをダウンロード</a>してお試し下さい。ja.mo を &lt;WP_INSTALL&gt;/wp-content/themes/sandbox に配置して使います。<br />
<a href="http://codex.xwd.jp/index.php/WordPress_Localization#WordPress.E3.81.AE.E3.83.AD.E3.83.BC.E3.82.AB.E3.83.A9.E3.82.A4.E3.82.BC.E3.83.BC.E3.82.B7.E3.83.A7.E3.83.B3.28.E7.8F.BE.E5.9C.B0.E8.AA.9E.E5.8C.96.29.E3.81.AE.E8.A8.AD.E5.AE.9A">(※ wp-config.php での WPLANG の定義が ja ではなく ja_UTF の場合は ja.mo のファイル名を ja_UTF.mo に変えて使って下さい。)</a></p>
<p>誤訳や不適切な部分がありましたらコメントでお知らせ下さい。また自分なりに言い回しを少し変えて使いたいという方は<a href="https://ideasilo.wordpress.com/2006/08/14/edit-language-files-with-poedit/">こちらを参考に ja.po を編集して</a>お使い下さい。</p>
<h4>セマンティックなクラスがセットされる要素</h4>
<p>class 属性にセマンティック情報がセットされる要素は次の3種類です。</p>
<ol>
<li>トップレベルの body 要素
<p>例: </p>
<pre>&lt;body class="wordpress y2006 m08 d17 h10 archive category
    category-uncategorized loggedin"&gt;</pre>
</li>
<li>ポストの div 要素
<p>例: </p>
<pre>&lt;div id="post-7" class="hentry p1 post private author-admin
    category-uncategorized category-blogroll y2006 m08 d11 h09"&gt;</pre>
</li>
<li>コメントの li 要素
<p>例: </p>
<pre>&lt;li id="comment-2" class="comment c0 byuser commentauthor-admin
    bypostauthor c-y2006 c-m08 c-d11 c-h10 alt"&gt;</pre>
</li>
</ol>
<p>以下、セットされるクラスとその説明の一覧です。</p>
<h4>ボディのクラス</h4>
<p>テンプレート関数 <code>sandbox_body_class()</code> により生成されます。</p>
<table border="1">
<tr>
<th>クラス</th>
<th>説明</th>
</tr>
<tr>
<td>wordpress</td>
<td>常にセットされる。</td>
</tr>
<tr>
<td>y{YYYY}</td>
<td>現在の年(ローカルタイムゾーンに基づく)。例: y2006</td>
</tr>
<tr>
<td>m{MM}</td>
<td>現在の月(01～12、ローカルタイムゾーンに基づく)。例: m12</td>
</tr>
<tr>
<td>d{DD}</td>
<td>現在の日(01～31、ローカルタイムゾーンに基づく)。例: d31</td>
</tr>
<tr>
<td>h{HH}</td>
<td>現在の時(00～23、ローカルタイムゾーンに基づく)。例: h23</td>
</tr>
<tr>
<td>home</td>
<td>ホームページが表示されている(<code>is_home()</code> が真である)場合にセットされる。</td>
</tr>
<tr>
<td>archive</td>
<td>アーカイブのページが表示されている(<code>is_archive()</code> が真である)場合にセットされる。アーカイブにはカテゴリーや日付、執筆者を基準にしたアーカイブがあり、これら全てを含む。</td>
</tr>
<tr>
<td>date</td>
<td>日付を基準にしたアーカイブ(例えば「8月の月間アーカイブ」など)のページが表示されている(<code>is_date()</code> が真である)場合にセットされる。</td>
</tr>
<tr>
<td>search</td>
<td>検索結果のページが表示されている(<code>is_search()</code> が真である)場合にセットされる。</td>
</tr>
<tr>
<td>paged</td>
<td>ページ分割された何らかのページ(例えば「8月の月間アーカイブの2ページ目」など)が表示されている(<code>is_paged()</code> が真である)場合にセットされる。</td>
</tr>
<tr>
<td>attachment</td>
<td>アタッチメントのページが表示されている(<code>is_attachment()</code> が真である)場合にセットされる。</td>
</tr>
<tr>
<td>four04</td>
<td>404 エラーページが表示されている(<code>is_404()</code> が真である)場合にセットされる。</td>
</tr>
<tr>
<td>single</td>
<td>単一ポストのページが表示されている(<code>is_single()</code> が真である)場合にセットされる。次の6種の s-* クラスが single に付随する。</td>
</tr>
<tr>
<td>s-y{YYYY}</td>
<td>ポストの公開年(ローカルタイムゾーンに基づく)。例: s-y2006</td>
</tr>
<tr>
<td>s-m{MM}</td>
<td>ポストの公開月(01～12、ローカルタイムゾーンに基づく)。例: s-m12</td>
</tr>
<tr>
<td>s-d{DD}</td>
<td>ポストの公開日(01～31、ローカルタイムゾーンに基づく)。例: s-d31</td>
</tr>
<tr>
<td>s-h{HH}</td>
<td>ポストの公開時(00～23、ローカルタイムゾーンに基づく)。例: s-h23</td>
</tr>
<tr>
<td>s-category-{カテゴリー・スラッグ}</td>
<td>ポストを含むカテゴリーのスラッグ。カテゴリーの個数分セットされる。例: s-category-books</td>
</tr>
<tr>
<td>s-author-{執筆者ログイン名}</td>
<td>ポスト執筆者のログイン名。例: s-author-admin</td>
</tr>
<tr>
<td>author</td>
<td>執筆者を基準にしたアーカイブのページが表示されている(<code>is_author()</code> が真である)場合にセットされる。次の author-* クラスが author に付随する。</td>
</tr>
<tr>
<td>author-{執筆者ログイン名}</td>
<td>執筆者のログイン名。例: author-admin</td>
</tr>
<tr>
<td>category</td>
<td>カテゴリーを基準にしたアーカイブのページが表示されている(<code>is_category()</code> が真である)場合にセットされる。次の category-* クラスが category に付随する。</td>
</tr>
<tr>
<td>category-{カテゴリー・スラッグ}</td>
<td>カテゴリーのスラッグ。例: category-books</td>
</tr>
<tr>
<td>page</td>
<td><a href="http://codex.wordpress.org/Pages">ページ</a>が表示されている(<code>is_page()</code> が真である)場合にセットされる。次の page-* クラスが page に付随する。</td>
</tr>
<tr>
<td>page-author-(authorlogin)</td>
<td>ページの執筆者のログイン名。例: page-author-admin</td>
</tr>
<tr>
<td>loggedin</td>
<td>ログイン中のユーザがアクセスしている場合にセットされる。</td>
</tr>
</table>
<h4>ポストのクラス</h4>
<p>テンプレート関数 <code>sandbox_post_class()</code> により生成されます。</p>
<table border="1">
<tr>
<th>クラス</th>
<th>説明</th>
</tr>
<tr>
<td>hentry</td>
<td>全てのポストでセットされる。hAtom の仕様。</td>
</tr>
<tr>
<td>p{位置}</td>
<td>リスト中の位置。例: p5</td>
</tr>
<tr>
<td>alt</td>
<td>位置が奇数の場合にセットされる。</td>
</tr>
<tr>
<td>{post type}</td>
<td>ポストの post_type プロパティ。post / page / attachment のいずれか。WordPress 2.0.* 以前ではセットされない。</td>
</tr>
<tr>
<td>{post status}</td>
<td>ポストの post_status プロパティ。publish / draft / private / inherit / future のいずれか。WordPress 2.0.* 以前では static / object / attachment も。</td>
</tr>
<tr>
<td>author-{執筆者ログイン名}</td>
<td>ポスト執筆者のログイン名。例: author-admin</td>
</tr>
<tr>
<td>category-{カテゴリー・スラッグ}</td>
<td>ポストを含むカテゴリーのスラッグ。カテゴリーの個数分セットされる。例: category-books</td>
</tr>
<tr>
<td>y{YYYY}</td>
<td>ポストの公開年(ローカルタイムゾーンに基づく)。例: y2006</td>
</tr>
<tr>
<td>m{MM}</td>
<td>ポストの公開月(01～12、ローカルタイムゾーンに基づく)。例: m12</td>
</tr>
<tr>
<td>d{DD}</td>
<td>ポストの公開日(01～31、ローカルタイムゾーンに基づく)。例: d31</td>
</tr>
<tr>
<td>h{HH}</td>
<td>ポストの公開時(00～23、ローカルタイムゾーンに基づく)。例: h23</td>
</tr>
</table>
<h4>コメントのクラス</h4>
<p>テンプレート関数 <code>sandbox_comment_class()</code> により生成されます。</p>
<table border="1">
<tr>
<th>クラス</th>
<th>説明</th>
</tr>
<tr>
<td>{commnet type}</td>
<td>コメントの comment_type プロパティ。comment / trackback / pingback のいずれか。</td>
</tr>
<tr>
<td>c{位置}</td>
<td>リスト中の位置。例: c5</td>
</tr>
<tr>
<td>alt</td>
<td>位置が奇数の場合にセットされる。</td>
</tr>
<tr>
<td>byuser</td>
<td>ログインしたユーザからのコメントの場合にセットされる。</td>
</tr>
<tr>
<td>commentauthor-{ログイン名}</td>
<td>コメント送信ユーザ名。例: commentauthor-admin</td>
</tr>
<tr>
<td>bypostauthor</td>
<td>ポスト執筆者とコメント送信ユーザが同一の場合にセットされる。</td>
</tr>
<tr>
<td>c-y{YYYY}</td>
<td>コメントの送信年(ローカルタイムゾーンに基づく)。例: c-y2006</td>
</tr>
<tr>
<td>c-m{MM}</td>
<td>コメントの送信月(01～12、ローカルタイムゾーンに基づく)。例: c-m12</td>
</tr>
<tr>
<td>c-d{DD}</td>
<td>コメントの送信日(01～31、ローカルタイムゾーンに基づく)。例: c-d31</td>
</tr>
<tr>
<td>c-h{HH}</td>
<td>コメントの送信時(00～23、ローカルタイムゾーンに基づく)。例: c-h23</td>
</tr>
</table>
<p>Sandbox 0.6.1 のコードをベースにまとめました。</p>
]]></html></oembed>