2014年10月18日土曜日

第34回WordBench大阪に参加して（「WordPressのプラグインを開発して、公式ディレクトリに登録しよう」）

さーて今回は、プラグイン開発〜って勢い込んでたら、風邪引いて熱ありそうでフラフラ〜、、、マジか、、、で、でもかんばります〜。

仕事でちょいと使いたい、Googleカレンダーからデータをとってきて一覧表示するプラグインを作ってやろうと参戦しました。これってないんですよねぇ。何故だろうってWordCamp Kansai 2014とかWordCamp Tokyo 2014のアンカンファレンスでつぶやいていたんですが、
今、探してみたら、
が使えそうじゃないですか T_T;。私がやりたいなと思っていた機能の多くは実装してそう。 まっ、まぁ上記を使いこなすには設定が多すぎてちょっとみたぐらいではわからないから、作りますか...（汗）、せっかくだし。頭にSimpleでもつけとこう。



そういえば写真撮るの忘れてて、懇親会の写真載せときます。
お寿司とピザを食べながら、歓談。@miya0001さん、GPLやオープンソースについて熱く語られてお疲れかな (^^; YATさんはいい感じですよねぇ〜。
懇親会でもいろいろなお話をしました。体調不良であんまり飲めませんでしたけど...

プログラム


いつものごとく、下記は発表者の発言や資料を私なりの解釈でメモったものです。
ですので発表者の意図と異なる場合があります。その点はご了承ください。
「※」は筆者の追加メモや補足です。

セッション1「はじめてのプラグイン制作」（Dashboard for Beginner）

昨年あたりからWordBench大阪に参加、我らがウェブデザイナー（WordCamp Kansai 2014での広報BOSSだった）。このプラグインは、その6月に開催したWordCamp Kansai 2014の2日目、コントリビューターデイで作成され、8月に公開したとのこと。。

Dashboard for Beginnerとは？


管理画面にログインした後のダッシュボードをシンプルにするプラグイン。
初心者に「まずは投稿する機能だけを覚えてもらいたい」という意図から作成した。

今回用意したファイルは？

  1. dashboard.php
  2. readme.txt
※ readme.txtについては、Readme validatorでチェックすること（これエラーでると審査通らないよ〜）

登録にはSVNが必要（GUIとしてはTortoiseSVNがオススメ）


http://tortoisesvn.net/

※http://www.gside.org/Gentoo/subversion/subversion_client.html
あたりが分かりやすいか？

SVN登録は
- https://wordpress.org/plugins/about/svn/

作ってみて失敗したこと１


申請時に必要なzipファイルがダウンロードできない〜審査側に英語で言われた。
英語で返事するのが大変....

作ってみて失敗したこと２


登録したプラグインの名前を間違えた〜（Dashboard for Beginerにしちゃった....）
これは変更不可ということ。

感想


コアファイルやインストールしたプラグインのソースコードを見る機会ができ、新たな体験ができたということ。今後もアップデートや国際化ができたらよいなとのこと。

セッション２「虎の威を借る狐」的なプラグイン作成」（WooCommerce For Japan）

プラグインを拡張するプラグインの作成。ECにて代引きシステムを入れ込むためのものらしい。WooCommerceプラグインの拡張。WooCommerceの日本語レビュアーとのこと。

なんのためのプラグインを作るのか
WordPressをより使いやすくしたい。
投稿をより使いやすくしたい
いろいろな表示形式に対応できるようにしたい

探せば意外と希望に近いものはある


でもすべての要望が満たされるものはなかなかない

そこで

プラグインのプラグインが必要


作る前の注意点


プラグインを作る基本的なことを勉強する必要がある。
※プラグインを拡張するためには、そのプラグインを知っておく必要があるため。

特にアクションフックとフィルターフックは...


がオススメ（本日登壇される宮内氏も筆者の１人）。

何故「WooCommerce」を選んだのか


Extensionを増やす気まんまんのプラグインだったし。
※とまぁ確かにそれは重要ですね。

公式プラグインでのコツ


MVP（Minimun Viable Product）＜実用最小限の製品＞から作りましょう。
公開するなら使ってもらえるように、作りながら機能を追加していくのがいいのでは？

セッション３「公式ディレクトリ用プラグインを公開しちょう」（@miya0001さん）

WordPressプラグイン開発バイブルの執筆者の１人。

なぜオープンソースなのか？


考えてみたことありますか？で始まりました！熱い話が！

ウェブサイトの価値（コンテンツ、コンテナーの２つ）


コンテンツ：記事、写真、映像等
コンテナー：入れ物（CMSやサーバー等情報基盤やシステム）

大体大きくわけてこの２つでしょう。
  • ウェブサイトとしての価値：コンテンツ＞＞＞コンテナー
  • 現実的なコスト：コンテンツ＜＜＜コンテナー

オープンソースとしう仕組みを利用して開発コストや開発人数を最大化しよう


コンテナーはコンテンツを発信するにあたっての手助けにはなるけど、それ自体はお金を稼ぐわけではない。ということはコンテナーのコストをいかに下げられるかが重要になった。だからオープンソースとしう仕組みを利用して開発コストや開発人数を最大化しようという考え方が大事ではないか。

ダタで使うだけでなく、このオープンソースの枠組みに入りませんか！


※枠組みというのは開発だけじゃなくて、テーマやプラグインのレビュー（よかった！だけでも開発者のモチベーションアップに繋がる）、利用して問題が見つかったり、何か要望があった場合のお知らせ（公開プラグイン等のページから投稿できるよ！）。フォーラムで回答するだけでも枠組みに入ったことになりますよ！

でもちょっとまって開発側に回るなら「GPL」の理解が必要だよ

利用する側は、このGPLライセンスによって自由に利用できるため特に知る必要はない。
しかしその代わりに、開発側は気をつけなければならないことがある。

つまりざっくり言うと、
  • 再配布を禁じてはいけない。
  • 用途制限を設けてはいけない。
が必要なのだ（GPLの主なルール）。

CSSやJavaScript、画像などPHPファイル以外の部分はGPLである必要はない


この部分的なGPLのことを「スプリットライセンス」と呼ばれていて、それもアリです。
しかし、スプリットライセンスは
  1. 公式ディレクトリに登録できない
  2. コミュニティイベントでの登壇や宣伝が出来ない
となっているので気をつけよう。

※つまりWordPressは、単なるGPLライセンスではなくこれら画像等PHPファイル以外もすべて、GPLを適応したい（100% GPLライセンス）と思っている。筆者もそれまで考えてなかったけど、WordCampの実行委員していて、そのことを勉強しました

この100% GPLについては先日開催されたWordCamp Tokyo 2014で説明されていた内容が分かりやすいかなと思います。

日本のWordPress地域コミュニティ「WordBench」の最近、WordCampと同じルールが適応されましたしねぇ。

似たようなプラグインがあっても全く問題なし


パクられて、そのまま掲載されたらムカっとくるけど、まぁそういうことはいえないよね。似ているかどうかの線引きは人それぞれだし。

かの有名な「伽藍とバザール」（Eric S. Raymond）＜リンク先の文字コード「EUC-JP」＞
では、オリジナルから派生されたものが、オリジナルより栄えることはないよといっている。

似たようなプラグインがあるとノイズになるのでは？


沢山あるからノイズになるのは間違いだし、若手が出てきにくくなってよくない。

※ウェブで探すのは「検索」メインであり、またレビューや更新度合いなど複合的に使えるか判断する。そのため沢山あったとしても特に問題にはならない。むしろ、その中から使えるものが出てきたらよいと思う。１つしかなかったら、それが廃れた時が怖いよね。

国際化（WordPress i18n Tools）


プラグインの国際化に必要です。
何故18かは、internationalizationの先頭のiと末尾のnを除いた文字数（nternationalizatio）が18だからだよん。

国際化しておくと、そのプラグインが役立つものの場合、世界で利用してもらえるよ。

PHP_CodeSnifferを使って（WordPress定義を入れて）WordPress Cording Standardをチェックしよう

間違いではないけど、皆がある程度コーディングルールをまもると後から手も入れやすいしいいよね。

※導入の参考（Mac編）

qUnitによるコードチェック



WP-CLIを利用した簡単プラグインフォルダ/テンプレートの作成


※WP-CLIの導入方法は、第32回WordBench大阪の筆者（木谷）メモもあるよ。

cd wp-content/plugins
wp scaffold plugin hogehoge

というテンプレートを作成するためのコマンドがある。hogehogeはプラグイン名だ。

wp plugin activate hogehoge

で有効化できる。

wp plugin list

でプラグインリストが表示される。

テーマとプラグインチェック「theme-check&plugin check」

も是非是非つかいましょう。

どんなテーマやプラグインを開発したらいいのだろう



を見てみよう。ものによってはやってほしいなと思うもののリストが載ってるよん。
それをやると、より多くの人たちへのコントリビュートすることになるので、モチベーションがあがるんじゃない？

WordPress開発者向けの最新ドキュメントは？



に移行中なんで、そこも参考にしたらいいかも。まだコードサンプル的になかったりするけど。

プラグイン登録時の注意「Plugin Nameは間違わないように！！」


日本語で入れてもいいけど、おかしな名前になる場合があるかもしれないよ。
想定としては、プラグインのディレクトリ名（フォルダ名）と思ったほうがいいよ。

プラグイン名は変更できるけど、ディレクトリ（フォルダ）名は変えられないよ〜。

大抵して考えずに適当に名前作ってアップしたら、そこそこ有名になった困った（プラグイン機能と全く関係ない名前にしたし）ことあったよ...

詳しくは
に載っているから是非見てね！

※筆者は購入したよ〜、まだあんまり読んでないけど（時間が...）

kintone APIプラグイン


※公式プラグインへ公開予定とのこと。

デジタルキューブとサイボウズのコラボプラグインとのこと。
開発を楽にするツールらしい。APIについては、GPLで公開ってことなので楽しみかな〜。

そして開発へ

公開されたGoogleカレンダー（イベント告知情報を想定）から、データを自動取得し、WordPressのイベント新着情報としてリストでの一覧表示させるショートコードの作成

当然複数カレンダー（イベント内容によって）あるので、それ全部マージして降順（新着順）に表示したいし、カテゴリーごとにアイコンで色分けしたいよね。将来的にはリスト一覧表示以外の出力もサポートしたいし、投稿や固定ページへ保存、あるいはThe Event Calendarプラグインへの自動投稿（やっぱそのほうが表示がやりやすいし）機能があるとなお便利だよね！って夢は広がります。

そうGoogleカレンダーには写真表示ができないんですよね。となると既存のカレンダープラグインに写真ものせたデータを用意（あるものは）しておいて、そこへのリンク（アイコン）を作りたいもの。ならば、Googleカレンダーの詳細データ内に何らかのルール（現時点では@@URL@@を入れといたら、それはWordPressの記事（投稿か固定）って思ってる）して、うまくリンクさせてあげるといいなぁと漠然と思ってる。

まっ、まぁそこまで広げられたら嬉しいけど、まぁボチボチで。

２時間で出来た内容としては

  1. 設定ファイルの実装（公開GoogleカレンダーのXML指定と、カレンダー名手動変更可能）
    　　XML URL名（必須）,  カレンダー名（オプション）
    としておいて、カレンダー名が空白なら、XML URL先から自動取得するって感じ。
  2. ショートコード（日時 タイトル サマリー Read more.. なデータ一覧を表示）
    ※１つのみ（入力ボックスは用意したけど、複数カレンダーをマージするまでは実装できず。それっていろいろ面倒だし、時間ないよ〜。）

全体的な処理




  1. 初期値をセット（init_settings関数の呼び出し）
  2. インストール時の処理（installer関数の呼び出し）
    ※現時点ではバージョンの保存（今後修正時に何かしないといけないときに実装しとく）
  3. 設定の追加（add_to_settings_menu関数の呼び出し）
  4. 国際化対応（enable_language_translation関数の呼び出し）
  5. ショートコードの作成と表示（sgcs_add_shortcode関数の呼び出し）
という流れ。それぞれフックとアクションが付与されている点に着目。
たとえば、init_settingsをクラス内で呼び出す場合には、

$this->init_settings();

でいい。なぜadd_actionを使うのか。それはプラグインを拡張するプラグインを誰かが作った場合、あるいはfunctions.phpに設定を上書きしたいものあった場合、関数の上書きができる（拡張できる）ようにするため。
これはアクションフックという仕組みであり、このあたりは第28回WordBench大阪でも話されていましたし（振り返り記事や私が書いたブログとかで少し触れてます... あっアレ、私のブログ記事へのリンクがおかしくなってた.T_T;..振り返り記事書いたの私だったので、訂正.. ^^;）

設定


まず苦労したのは「１」の実装部分。
ってか面倒なんですよ。。。。設定更新したら、画面上部に「Update」が表示されるようにし、あとは10個のボックスを用意。これ＋で増やせればいいんですが、その実装は優先度低いので後〜。。現時点ではプラグイン内の設定でボックス数は増やせるようにはしてる。最悪、この設定画面でボックス数を設定できたらいいんじゃない？とか適当に思ったりして。。。

もちろん現時点で適当な英文になっているけど、全部国際化しているので後で翻訳します。



とまぁここまで何をしたいか、手法を考えて、実装したのが１時間３０分。
なおコーディングはオブジェクト志向（クラス）を使った。（あとで使いまわしたいとかいう思いがあって）

GoogleカレンダーのXMLデータ解析


とりあえず使う部分だけわかればいい。

 <title>Calendar Name</title>

 <entry>
        <id>XML URL</id>
  <title>Title</title>
  <summary>Some Words in Detail</summary>
  <link href="Google Calendar URL"/>
  <gd:when startTime="" endTime=""/>
 </entry>

がとりあえず必要な部分。
でgd:whenだけ特殊なので時間ないで「simplexml_load_file」関数で取得したデータから見つけることができなかった（残り30分だし）のですが、それ以外については実装（XML読み込みと表示のみセキュリティ対策コードを無視した（esc_htmlとか、esc_attrとかは入れずに、、時間が〜って感じで））。まぁIP制限したローカル環境（MAMPでやってた）なのでいいでしょう。

ショートコード作成


大体下記ぐらいから始まります。
先頭で、設定データを呼び出して、「$xml_files」に入れ、ついでショートコードに対して属性（現在は typeを設定して、type="list"がデフォルトの値）を設定します。
ここでは、[sgcs] としておけば、[sgcs type="list"]と同じという意味です。



その後、実際の表示処理を行います。

とりあえず出来た表示


gd:whenデータ取得までいけなかったのとテスト的な意味合いで

カテゴリー名：カレンダー名
<li>カレンダーのサマリー  Read More...（Googleカレンダーの該当データへリンク）</li>

の列挙までにしました。



で1つ目のRead More...をクリックすると



のようにGoogleカレンダー（編集権限があるので、保存と出てますけど、閲覧専用にしている）の情報をみることができます。

とまぁこんな感じです。
今後開発を進めていったら、別記事で紹介するかもしれません。
いずれにせよリポジトリ公開を目指して頑張ります！


2014年10月18日　木谷
2014年10月19日　加筆・修正
2014年10月20日　加筆


投稿者 時刻:
ラベル: , ,

0 件のコメント:

コメントを投稿

登録: コメントの投稿 (Atom)