作成したプラグインを公式プラグインディレクトリで公開しよう

「WordPressプラグインの解説」第5弾。

さて、プラグインが完成したら、とうとうWordPressの公式ページヘプラグインをアップロードします。
WordPressではSVNというシステムを採用しています。このページでは初めてSVNを使う方でもわかるように解説します。

---

目次

• WordPress.orgでアカウント登録をする
• READMEファイルの作成
• プラグインをwordpress.orgへ申請
• TortoiseSVNのインストールと初期設定
• SVNの仕組みと、TortoiseSVNの使い方

---

WordPress.orgでアカウント登録をする

まずは「WordPress.org」でアカウントを取得します。

更新情報なんかも送られてくるので、Mailing Listsをチェックします。

Username、Emailが必須です。webサイトもある場合は登録しときましょう。

CAPTCHAをチェックしてRegisterボタンで登録。

登録したメールアドレスにユーザーネームと、パスワードが送られてくるので、ログインします。

---

READMEファイルの作成

まずはプラグインのREADMEファイルを作成します。
これはただの解説用ファイルではなく、公式のプラグインページを作成するためのものです。基本はMarkdown記法ですが、わりと書式が厳密でややこしいので、READMEジェネレーターを利用して作成するのをお勧めします。

WordPress.org Readme Generator

それぞれ項目は以下のようになっています。

項目	意味	入力例
Plugin name	プラグイン名	Step by Step Social Count Cache
Contributors	製作者　WordPress.orgで登録したユーザー名	oxynotes
Donate link	寄付用のリンク
Tags	プラグインに関連したタグ	cache, count, sns, social
Requires at least	少なくても必要なWordPressのバージョン	4.2.4
Tested up to	動作テストしたWordPressの最新バージョン	4.3.1
Stable tag	プラグインのバージョン	1.0
License	ライセンス	GPLv2 or later
License URI	ライセンスの詳細を記載したURL　今回の例ではGPL2のURL	http://www.gnu.org/licenses/gpl-2.0.html
Short description	短い解説	（プラグイン名の下に表示される短い解説）
Description	詳しい解説	（Descriptionタブの本文）
Installation	インストール方法	（Installationタブの本文）
Frequently asked questions	よくある質問	（FAQタブの本文）
Screenshots	スクリーンショット	1. Option page.
Changelog	更新履歴	1.0 Initial working version.
Upgrade notice	アップグレードの概要

実際の解説ページに当てはめると以下のようになります。

Screenshotsの項目に複数の写真を掲載する場合は、指定のファイル名で画像をアップし、解説をリスト形式で1.○○、2.○○といった具合に記述します。

書き方に迷ったら既にアップロードされているプラグインを参考にしましょう。

---

プラグインをwordpress.orgへ申請

プラグインをアップロードする前に、どんなプラグインを作成したのかwordpress.orgへ申請する必要があります。

ログインした状態でwordpress.orgのグローバルメニューのPluginから「Developers ＞ Add Your Plugin」と進みます。

すると以下のように○個のプラグインを審査が審査待ちで、○個審査中という表示がでます。

プラグインを審査するにあたって必要な項目を入力します。項目はすべて必須です。

Plugin Name (required)

プラグイン名。これは一意である必要があります。（入力例：Step by Step Social Count Cache）

Plugin Description (required)

プラグインの解説。英語で簡単に解説する。（入力例：Step by Step Social Count Cache is, by the post_modified, you can set…）

Plugin URL (required; must be a link to a ZIP file of the working plugin that includes a completed readme.txt)

プラグインをzipで固めたもの。説明にある通り、リードミーファイルも必要になる。先ほど作ったリードミーファイルをreadme.txtという名前でルートディレクトリに保存してzipで圧縮して適当な場所にアップロードします。そのファイルへのパスを書きます。
（入力例：http://example.com/uploads/sbs-social-count-cache.zip）

「Send Post >」をクリックして審査に送ります。

「審査が通ったらメールで送るよ。迷惑メールに入るかもしれないからホワイトリストに入れておいてね」というメッセージと以下の様なリンクが表示されます。

step-by-step-social-count-cache from oxynotes [plugin] - 2015-8-11 - show

まだ審査待ちの状態ですが、リンクをクリックすると既にプラグインページが作成されています。

ちなみにまだ正式に作成されたわけではないので、ログインしていないと表示されないので注意してください。

プラグインページが作成される

認証は遅いと1週間くらいかかると言われていますが、私の場合は1日で返信がきました。
認証されると以下の様なメールが送られてきます。

oxynotes,

Your plugin hosting request has been approved.

Within one hour, you will have access to your SVN repository at

http://plugins.svn.wordpress.org/step-by-step-social-count-cache/

with your WordPress.org username and password (the same one you use on the forums).

Here's some handy links to help you get started.

Using Subversion with the WordPress Plugins Directory https://wordpress.org/plugins/about/svn/

FAQ about the WordPress Plugins Directory https://wordpress.org/plugins/about/faq/

WordPress Plugins Directory readme.txt standard https://wordpress.org/plugins/about/readme.txt

readme.txt validator:
https://wordpress.org/plugins/about/validator/

Enjoy!

ざっくり翻訳すると「貴方のプラグイン専用のSVNリポジトリ作ったよ。Subversion使ってアップロードしてね。使い方わからない場合はリンクを見てね」とのことです。

---

TortoiseSVNのインストールと初期設定

まずはApache Subversion（アパッチ・サブバージョン; SVN）のクライアントをインストールします。
クライアントは様々ありますが、WindowsではTortoiseSVNが使いやすく評判が良いです。

TortoiseSVNのダウンロードページ
32bitか64bitのどちらかをダウンロードします。

Language packsも用意されているのでJapaneseのファイルをダウンロード。

インストーラーはデフォルトのままでインストール。日本語化ファイルもインストーラー形式なので何もせず次へでインストール完了します。

すると右クリックから「TortoiseSVN ＞ setting」が追加されるのでクリック。

開いたら「General」のメニューが開いてると思います。

「Language」で「日本語」にして「OK」ボタンをクリック。

これで日本語化は完了です。

まずは使えるようにするために設定を行います。右クリックから「SVN チェックアウト」をクリック。チェックアウトについては後述します。

リポジトリのURLに「メールに記載されたリポジトリのURL」を入力。
例）http://plugins.svn.wordpress.org/step-by-step-social-count-cache/

チェックアウト先のディレクトリに、デスクトップに適当にフォルダを作って指定。
例）C:\Users\owner\Desktop\sbs-social-count-cache

そして「OK」ボタンをクリック。

するとディレクトリが同期され、同期マークが表示される。（わかりやすく大アイコンの例）

これで、WordPressの公開ディレクトリと、ローカルのフォルダがひも付けされて、同期する準備ができました。
このフォルダがローカルの開発環境になります。

---

SVNの仕組みと、TortoiseSVNの使い方

まずはSVN（Apache Subversion：アパッチサブバージョン）の使い方を理解しておきましょう。
プラグインのアップロードに必要な操作を覚えるだけなら、5分もあれば十分です。

SVNは簡単に言えばバージョン管理システムです。
専用の場所に保存したコードを、ユーザーのローカルファイルと同期させることができます。
名前が示す通りバージョンごとにファイルを管理したり、ログから古いバージョンに戻したりということもできます。他にも細かな機能はたくさんありますが、要は離れた場所にいる複数人での開発をしやすくするためのシステムです。

最近では同じバージョン管理システムでGitも有名です。それの兄弟みたいなもんです。

今回はWordPressで利用するための知識に限定して解説します。用語の解説をしつつ、プラグインに必要なファイルなんかも作成していきます。
SVCについてさらに詳しく知りたい方は「TortoiseSVN」をご覧ください。

リポジトリとは

リポジトリとはLinux等を利用している方には馴染みのある言葉ですが、ファイル置き場のことです。
WordPressのプラグインの場合は認証時に送られてくるメールにプラグイン専用のリポジトリが記載されています。

リポジトリブラウザー

右クリックからリポジトリブラウザーを立ち上げると登録したリポジトリのファイル構成を見ることができます。（回線の状況によって立ち上がるまで数分かかります）

見ていただければわかるように、他のプラグインのファイル構成も見ることができるので、どのような構成になっているか見ると参考になります。

チェックアウト

リポジトリのコードを開発環境（自分の環境）にもってきて、紐付けすること。

チャックアウトに使用するフォルダに制限はありませんが、中身は完全にリポジトリ側のものに置き換えられます。中にファイルを置いておくと消えてしまうので注意。

1度ひも付けされたフォルダは保存場所を移動しても開発環境として動作します。

ファイル構成

チェックアウトすると以下の様なファイル構成になります。

trunk（トランク）

ソースコードを保存するメインのディレクトリ。
プラグインファイルは「trunk」に保存します。
また、スクリーンショットもここに保存します。スクリーンショットの名前は決められていて複数ある場合は「screenshot-1.jpg」「screenshot-2.jpg」という連番にします。1文字でも変更するとスクリーンショットとして認識しないので注意してください。※

※2017/9/13 追記

WordPress公式のPlugin HandbookのHow Your Plugin Assets Workというページによると、スクリーンショットは後述するassetsディレクトリへ保存する方法が推奨になったようです。現状はtrunkに保存しても動作しますが、新しくプラグインを作る際はassetsディレクトリへ保存してください。（assetsへ保存した際の動作は確認していません。）

branches（ブランチズ）

枝分かれした別のバージョンなどを保存する。ベータ版やイレギュラーの対応をした場合などに利用する。（特定のプラグインと相性問題で一時的にアップロードなど）
WordPressのプラグインではあまり利用しないはず。

tags（タグズ）

ソースコードのスナップショットを保存する。正式リリースに合わせて過去のバージョンを保存する。

assets（アセッツ）

WordPress独自のディレクトリ。
プラグインページのアイキャッチ用画像を保存する。2つのファイルサイズに対応しており、「banner-772x250.jpg」と「banner-1544x500.jpg」の二種類。
また、アイコンもここに保存する。アイコンはプラグインを検索した時に表示される。ファイル名は「icon-128x128.png」と「icon-256x256.png」。
どちらも名前を変更すると機能しないので注意。
また、アイキャッチ画像とアイコンのデザインが異なるとユーザーは同じプラグインなのか迷う原因になるので、可能な限り似通ったデザインにするべきです。

リビジョン

リビジョンは更新履歴です。一意のナンバーが割り振られ、0から始まり、更新する毎に1ずつ数字が増えていきます。
リビジョンには誰が更新したのか、ファイルのどの部分を変更したのかなどの情報が保存されます。

コミット

ローカルの開発環境のコードをリポジトリにアップロードして反映することです。

新しいファイルを作成・追加

必要な知識は解説したので、テスト用のファイルを作って追加してみましょう。

まずチェクアウトした開発環境にある「trunkフォルダ」に適当なファイルを作ってください。この解説では「new_test.txt」としました。

「new_test.txt」上で右クリックから「TortoiseSVN ＞ 追加」でアップロードの準備をする。

すると「new_test.txt」のアイコンにエクスクラメーション・マークが付きます。

続いて「trunkフォルダ」を右クリックして「SVN コミット」でアップロードできます。

この時に追加用のメッセージを入力しないとエラーが出てコミットできません。メッセージには変更点や修正内容を書いておきます。

追加していないファイルは「バージョン管理外」という扱いになりコミットされませんが、このウィンドウで変更した項目にチェックすればコミットすることができます。（しかし基本は追加してください）

初回にコミットをするとパスワードとユーザーIDを求められます。これはWordPressのDeveloper登録で使ったIDをとパスワードです。

正常にコミットされると「完了: リビジョン 1219119 になりました」等と表示されます。「new_test.txt」も緑のチェックマークになっていることを確認してください。

このリビジョンのナンバーはWordPressのプラグイン全体で管理しているます。つまりWordPressのプラグインのリポジトリは約120万回更新されたということですね。

コミットされると登録したメールに通知がきます。

大体5分位で反映されるようです。

今回は「SVN コミット」でコミットしましたが、ディレクトリを選択し「SVN 更新」をクリックすれば、リポジトリのものが開発環境にダウンロードされます。

新規フォルダの扱いに関する注意

開発環境で新規フォルダを作成して、そのフォルダにファイルを作成した場合、「trunkフォルダ」を選択してコミットしても反映されません。
フォルダ自体をコミットしていない場合、フォルダ以下のファイルはリストにも表示されません。面倒でも新しく作成したフォルダを選択して「追加」をした後にコミットを行うようにしてください。

私はこれを知らず「後で全体をコミットするから平気だろ」と踏んでいたら、利用者からファイルがないとエラーが出るという指摘をいただきました。

ファイルを更新する方法

作成した「new_test.txt」を編集して保存してください。
すると「trunkフォルダ」の表示がチェックマークから、エクスクラメーション・マークに変化します。このように前回リポジトリからデータを取得した状態から変化があるとアイコンが変化します。

この状態で「trunkフォルダ」を選択してコミットすればリポジトリのファイルも更新されます。

ファイルを移動する方法

「trunkフォルダ」のファイルを「assetsフォルダ」へ移動してみてください。
その状態で全体をコミットすると以下のようになります。

片方が紛失、もう片方が新しいファイルなのでバージョン管理外になっています。
紛失にチェックを入れるとリポジトリの「trunkフォルダ」のものが削除され、バージョン管理外にチェックを入れるとリポジトリの「assetsフォルダ」へファイルが作られます。

ファイル名を変更する方法

ファイル名の変更はTortoiseSVNの右クリックからのメニューで変更する。
反映にはコミットが必要。

ファイル名を「newtext2.txt」にしてみました。

コミット時には以下のように、削除と、追加（+）となる。

ファイルを削除する方法

削除も右クリックのメニューから実行します。

削除時は以下のように表示される。

ログを表示する方法

開発環境のフォルダを右クリックしてTortoiseSVNから「ログを表示」をクリック。
すると以下のようにファイルを削除したり、追加した履歴を閲覧することができる。

tagsにスナップショットを保存する

スナップショットとは古いバージョンを保存することです。
過去のバージョンを残しておきたい場合に利用します。
まず「trunkフォルダ」を右クリックしてTortoiseSVNから「ブランチ/タグの作成」をクリック。

宛先パスは選択したフォルダになっているので「/プラグイン名/trunk」となっています。
これを「/プラグイン名/tags/1.0」とtagsフォルダを指定して、バージョンのフォルダ名を付けます。
ログを残すのもメッセージがないとエラーになるので、適当にバージョン数でも入れておきます。
WordPressのリポジトリは常に新しいリビジョンをつけるので「リポジトリ内の最新リビジョン(HEAD)」にチェックを入れて「OK」ボタンをクリックします。

ログを保存してもリポジトリ側に保存されただけで、開発環境には保存されていません。ローカルにも反映させるには「tagsフォルダ」を右クリックして「SVN 更新」をクリックします。

すると保存したバージョンのフォルダが作成されます。

---

以上の解説でプラグインのアップロードは問題なく出来るはずです。

これでWordPressプラグインの作り方の解説は終了です。
私がプラグインを作成するにあたって必要になった知識を中心に解説しました。
本来なら翻訳ファイルの解説もあったほうが良いかもしれませんが、私のプラグインは純日本製と割りきって翻訳ファイルを作成していないので解説は控えます。以下のサイトで丁寧に解説されています。

プラグイン 日本語化 に挑戦！ | パソコン教室Pasonal（作り方はこちら）
WordPressの翻訳用のファイルがどうやって読み込まれているのかを調べてみた | Shinichi Nishikawa（仕組みはこちら）

カスタマイズのしやすいWordPressですが「オリジナルの設定を実装したり、セキュリティに配慮したものを作ろうとすると一気にハードルが高くなるな（難易度ではなく、面倒な設定が増える）」というのが実感です。
この解説をプラグインを作成時に参考にしていただけたら幸いです。

この解説でもセキュリティには配慮したつもりですが、プラグインを公開する前に、以下のサイトを一読することをお勧めします。プラグインのセキュリティについて詳しく解説されています。

プラグイン作者必読！実例に学ぶ脆弱なWordPressプラグインの作り方、又はwp-adminを守る理由 | ゆっくりと…