サイトアイコン Gatespace's Blog

スターターテーマ _s を使ってWordPressのテーマをつくる（準備編・補足）

gatespace
Theme Check
この記事をシェアする

まず、前回の「準備編」で _s テーマのダウンロードは完了しました。

いよいよ各ファイルについて書こうかと思ったのですが、その前に準備しておくべき事がありましたので、「準備編・補足」として記事を更新します。
今回の内容は _s に限らずテーマをつくる上で抑えておきたいポイントです。
[show_underscores]

この記事の対象

目次

  1. テスト環境を用意する
  2. WordPressをデバッグモードにする
  3. テストデータのインポート
  4. テーマチェックプラグインを使う

補足1：テスト環境を用意する

テーマやプラグインの開発・テストを行う場合は必ずテスト環境を用意しましょう。
本番環境で行うとミスがあった場合、サイトが真っ白！ということになりかねません。
もちろん本番環境と同じサーバー環境を用意するのがベストですが、難しいのであればMAMPやXAMPPなどでローカルでもテストを行える環境を用意しましょう。

ローカル環境の構築方法は検索すると数多く出てきますので、説明は割愛します。

補足2：WordPressをデバッグモードにする

WordPressのデバッグモードを有効化しておけば、エラーをその場で確認することができます。
テーマやプラグインの開発を行う時は有効化しておきましょう。
詳しくは以前書いた記事を参照してください。

補足3：テストデータのインポート

_s を使った場合に限りませんが、テーマを作成（編集）する際にはテストデータをインポートしておきましょう。

Codexのテーマユニットテストのページからテスト用のデータをダウンロードし、ダッシュボードの「ツール」→「インポート」でインポートします（状況によってはWordPress Importerというプラグインが必要になりますが、説明は割愛します）。
その際、「Import Attachments」の「Download and import file attachments」にチェックを入れておけば、メディアも同時にインポートされます。

インポート時のオプション

ただし、2013年1月時点で http://wpthemetestdata.wordpress.com/ の画像を直接配置している部分のうちいくつかの画像が抜けてしまっています。どうもCDNが問題のようですが・・・。
（詳細：http://make.wordpress.org/themes/tag/theme-unit-test/）

テストデータには画像やギャラリーを挿入した際に付与されるCSSクラスも入っています。
また、レイアウトテスト用の投稿の他に、予約投稿や下書き、たくさんのカテゴリー・タグが指定された投稿や、タイトルのない投稿など、「作られる可能性のある」様々な投稿が含まれていますのでぜひ利用しましょう

テーマはこの時点でサイト（トップページ）は写真の様になります。

_s の方は装飾がされていないのですが、キャプション付きの画像やギャラリーをみても分かるようにWordPressが付与するクラスについては最低限の対応はされています。

インポートされるデータの具体的な内容は @miya0001 さんの「WordPressでテーマを作る際のテーマユニットテストのススメ | firegoby」という記事もごらんください。
こちらではスクリーンショット付きでより詳しく解説されています。

補足4：テーマチェックプラグインを使う

テーマチェック用のプラグイン「Theme-Check」を使います。

このプラグインはWordPressにインストールされているテーマを公式テーマディレクトリに掲載する際の審査基準に基づいてチェックします。

主なチェック項目は

です。（他にもあります）

もちろん、作成した全てのテーマを公式テーマディレクトリに登録する必要は無いと思いますが、この審査基準に準拠することによって信頼性の高いテーマにする事ができます。
逆の言い方をすると対処療法（モグラたたき）で確認や修正を行うよりはずっと効率が良いのでおすすめです。

プラグインをインストールし、有効化すると「外観」に「Theme-Check」という項目が追加されます。
試しに現時点で _s をチェックするとこのようになります。

Theme Checkを使ってテーマをチェック

ざっくりとですが

となります。

_s を利用した場合、（見た目はともかく）WordPressテーマに必須の機能がはじめから盛り込まれているので、Codexのテンプレートタグや関数を見ながら作成するよりは、ぐっとハードルが下がると思います。

あわせて @miya0001 さんの「信頼性の高いWordPressテーマを作るためのTheme-Checkのすすめ | firegoby」という記事もごらんください。

これで準備は整いました。
次回 _s テーマのHTML構造を学習しながらスタイルシートで見栄えを整えていきます。

参照

この記事をシェアする