WordPress 公式テーマディレクトリにテーマをアップロードしました
この記事は WordPress Advent Calendar 2015に参加したかった人達の Advent Calendar 2015の4日目の投稿になります。本当なら12月4日に公開してないといけなかったのですが、2日遅れてしまいました。。。
2015年10月3日に Amethyst(アメジスト)という WordPress のテーマを WordPress.org の Theme Derectory にアップロードしました。アップロードして2ヶ月経ったこのタイミングで…という感じもしますが、公式テーマについてつらつらと書いていこうと思います。まだ承認されていませんが、レビューを楽しみに待っている途中です。
どんなテーマ?
ブログ用途のシンプルなテーマ
ブログを書いたり、写真を投稿するなどの個人で使う用途で作りました。ビジネス用途には不向きかもしれません。すべてのデバイスでコンテンツの可読性、視認性を重視したシンプルなテーマです。文章であれば読みやすく、写真を投稿する場合は印象に残るように装飾をほとんど排除しています。子テーマで CSS カスタマイズしやすいよう、Sass のソースコードも含めました。
仕事で構築することがほとんどないということもあり、このテーマ開発で初めて php をまともに触りました。そのため多機能、高機能ではないですが、カスタマイザーなど必要最低限の機能は備えています。
_s と Foundation ベース
自分でコーディングをしたものを WordPress のスターターテーマ _s に移植する形でテーマを構築していきました。_s は必要な物はすべて揃っているので、既存のマークアップを元に CSS を書くだけで済むのですが、敢えて書き換える方法をとりました。CSS フレームワークは Foundation を使っています。Sass の mixin がとても豊富で便利です。主にグリッドとメディアクエリで活用していました。ちなみに開発当時はバージョンが5.xでしたが、今は6になりましたね。6になってからざっくり中身を見てみたら、ディレクトリ構造やらなんやかんや変わっている模様です。
テーマを公開した理由
公言したから
去年の WordCamp Tokyo の「習得レベル別に考える これからの勉強法と勉強会」というセッションで登壇の機会をいただいたのですが、その時にこれからやりたいこととして「自分でオリジナルのテーマを作りたい。どうせつくるなら公式テーマディレクトリに掲載したい」と公言しちゃったんですよね。当時は子テーマで CSS カスタマイズしかできなかったので、いつか自分でテーマを作れるようにはならないとなあと思っていました。
作ったら公開するのは自然なこと
WordPress は 100%GPL のオープンソースの世界です。私は WordPress と関わってから2年ほど経ちますが、私は学生のときに Web に興味を持って、勉強しているうちに WordPress やそのコミュニティを知りました。なので、最初からオープンソースの世界にいたというのもあり、自分の中でオープンソースはとても自然なことで当たり前のことになっていました。「なにか作ったら公開したい(する)」という意識がどこかにあるんだと思います。実際公開しているモノの数は少ないですけどね。
苦労したこと
私の WordPress のレベル
仕事で構築をすることがほとんどないため、私の WordPress のレベルは子テーマで CSS のカスタマイズの域をなかなか出ませんでした。自分ひとりでテーマを作ったのは今回が初めてです。php もほとんど分からないし、WordPress のテンプレートタグなどもほとんど分かりません。具体的な例を挙げると、基本的なテンプレートタグ the_title() と get_the_title() があります。よく聞くタグだし存在は知っているのだけれども、両者の違いがわからないのです。後者は「get」が付いているし、「title」の単語の意味から推測はできますが、結局は「似てるし何が違うの…?」そんなレベルでした。
当然何をするにも実装方法がわからないし、すでにコーディングが完成している _s のコードを読んでも、知らないテンプレートタグがたくさんあって意味がよくわからなかったです。そのため Codex をひたすら辿ったりその都度テンプレートタグでググッて調べたりしました。あとは既存のテーマやデフォルトテーマのコードをよく参考にしていました。
地味に悩んだこと
実装方法がわからなかったこと以外に、地味に悩んだことを挙げてみます。
テーマの名前
名前 description は結構悩みます。。テーマは黒と白のシンプルなものにしようと決めていたので、当初は「Othello(オセロ)」のつもりでした。
ただこの名前、みなさんもご存知のとおりボードネームやらお笑いコンビやらと被ってしまうので結局見送ることに。
「シンプル」などその類の名前はすでにいくつもあり、他のテーマと似たような名前にはしたくなかったので結構悩んだ気がします。でも、結局いい名前が思いつかず。。最終的に自分の誕生石の Amethyst(アメジスト)にしました。意外にも同じ名前のテーマはなかったです。テーマに全く関係ないけど今はこれでいいと思っています。
テーマの description
description も地味に悩みました。英語での表現方法でももちろんですが、意外と日本語でもいい感じの文章を思いつかなかったりします。description はもうちょっと文章のレベルを上げたいですね。
CSS の設計
公式テーマに掲載されると、子テーマとして使用されることもあるため再利用性とメンテナンス性は意識する必要があります。そのため CSS は結構気を使って書きました。(「え、こんな書き方してんのダッサー」とか言われるかもだけど。。。)
と言いつつ今見返したらもうすでに汚い。_header.scss とか汚い。
コードレビューお待ちしています
WordPress の公式テーマディレクトリにテーマを公開するメリットのひとつに、コードレビューがもらえるというのがあります。こちらについては Habakiri の作者の北島さんが WordPress 公式テーマディレクトリで、仕事で使うベーステーマを公開するメリットとデメリット に書いてくださっていますが、本当にその通りで、テーマの公開時点では WordPress のテーマのあるべき品質になっています。その品質は、テーマレビュアーがガイドラインにそってきちんとフィードバックしてくれたからこそ得られるものです。
自分で調べてコードを書くのもとてもいい勉強になりますが、第三者に目を通してもらえるのもとてもありがたいことです。自分が知らなかったことを教えてもらえたり、気付かなかった間違いを指摘してもらうことでさらにプラスになると思います。
とうわけで、今はテーマレビュアーがつくのを首を長くして待っているところです。GitHub にもソースをあげているので興味がある人は見てみてください。ソース見られるのこわいし恥ずかしいですけどね。。。