カテゴリー: WordPress

  • WordBench 長野 vol.5で WP REST API で遊んだ話をしました。 #wbnagano

    WordBench 長野 vol.5で WP REST API で遊んだ話をしました。 #wbnagano

    というわけで先週の土曜日に、WordBench 長野 vol.5 を開催しました!非常に楽しい会だったので、今度こそ継続的にやれたら良いなと思います。また今回は誰もPHPに全く触れないというなかなかロックな会だったので、次はPHPの話をしたいです。

    せっかく今回、松本付近の方々にも多く集まって頂いたので、10/19にもくもく勉強会を開催します。近所の方もそうでも無い方もぜひご参加下さいませ。

    さて、今回僕はWP REST APIを使って、スマートフォンアプリを作ってみたり、投稿画面を全く別のものに作り替えてみたり、また業務で実際に使った事例の話を紹介させて頂きました。

    torounit/wp-app-torounit-com

    torounit/wp-markdown-blogging

    フロントエンド周りが戦国時代になってきて勉強しなきゃいけないことが多いなーと感じる昨今ですが、扱える領域が増えたのはやっぱりWEB制作者としては楽しいなーと思う今日この頃です。

     

    というわけで今週末は渋谷で秋のJavaScript祭 in mixi 〜秋のJavaScript収穫祭〜でおしゃべりさせて頂きますので、そちらもよろしくどーぞ。

    来週末はWordWine 2016という勉強会やってワインを飲むという謎の会もありますので、そちらでもお待ちしております。

  • WordBench 長野 vol.5 やります。#wbnagano

    ブログ書かねばと思い続けて気がついたらもうこんな時期です。やばいです。WordCamp Tokyo 2016 のブログも書いてないです。ブログを書くまでがWordCampなので、僕のWordCampはまだ終わってないです。

    というわけで、明日10月8日に、 WordBench 長野 Vol.5 を本当に久しぶりに開催します。

    いつもの・・・と言って良いのかは解りませんが、テクニカル以外のセッションも有ったりで、いろんな人に楽しんで頂ければ良いなと思っております。

    僕自身は、WP REST API を使って遊んでみた話とか仕事で使った話とかを中心にお話しします。

    その後座談会とかで、WordCamp Tokyo 2016や今後のWordBench長野のはなしもできたらなーと。遠方から来て頂ける方もいらっしゃるので。(北信方面とか南進方面とか埼玉方面とか)

    その後、会場での懇親会も予定していますのでそちらもご参加頂ければと思います。

     

     

     

     

  • WordPressのテーマを作ったので公開しました。

    WordPressのテーマを作ったので公開しました。

    「WordPress/HTML/CSS が好物です。」と常々言っているワケですが。

    そんな人間がWordPressのテーマを公開していないというのは「お前の愛はそんなものなの?」と思われてしまうなと。それはまずい。というわけで、テーマを作る宣言をしたわけです。

    それから約一年の月日が流れてしまいましたがようやく形になったので、公開しました。

    まぁ元々Github上で開発してたので元々公開されてたんじゃないかというのは有りますが。

    デモサイト: https://torounit.com/vanilla

    Github: torounit/vanilla

    公式テーマにも申請中なので、そのうちWordPressからもインストール出来るようになるはずです。

    機能

    • ドロワーメニュー(カスタムメニュー対応)
    • カスタムロゴ
    • 色のカスタマイズ
    • medium みたいな固定ヘッダー(上にスクロールすると戻ってくる奴)
    • モバイルファースト

    名前の由来

    とにかくシンプルで、子テーマなどを作りやすいという方向性で作ったので、バニラです。とあるカードゲームでの俗称です。

    CI

    Travis CIでプッシュ時にテストを実行したり、ビルドを自動化したり、タグを付けると自動リリースされるようにしたりしてます。やっぱりCIサーバー有ると便利ですよね。

    CSS

    最近お気に入りのStylusを導入したり、ITCSSやったりしています。

    作った感想

    WordPress のテーマは業務でいくつも作ったりしてきたのですが、ちゃんと公式ディレクトリへの公開を念頭に作るということは初めてでした。

    意外に知らなかったことも多かったり、カスタマイザー等はなかなか苦労したり。人のテーマを見ていろいろ参考になることなど、いろいろやってみると勉強になること多いですね。

    なにか不具合など有ればプルリクエストくださいませ。

    というわけで次はテーマレビューもやらないとですね。

    今週末のWordBench長野でここら辺の話も懇親会とかで出来たら良いかなと思っておりますのでぜひぜひそちらもどうぞ。

  • WordCamp Tokyo 2016 で「コアコントリビューターへの道とその先」というセッションをします!#wctokyo

    WordCamp Tokyo 2016 で「コアコントリビューターへの道とその先」というセッションをします!#wctokyo

    https://2016.tokyo.wordcamp.org/session/road-to-core-contributor-and-future-20min/

    9/17・18 に行われる WordCamp Tokyo 2016 にて、Wocker の作者で、WordPress のコアコントリビューターでもある Kite さんと一緒にセッションをやらせて頂きます。

    2人でオープンソースに関わることの楽しさとか得たものなどの体験談などをゆるゆるとくっちゃべります。ぜひお越し下さいませませ。

    また、懇親会や、2日目のコントリビューターデイにも参加しますので、なかなか普段お会いできない方々とお話させて頂ければなーと思っていたりしてます。

    よろしくどうぞ!

  • Custom Post Type Permalinks 2.1.2 と、Simple Post Type Permalinks 2.0.0 をリリースしました。

    いろいろ更新しました。

    Custom Post Type Permalinks 2.1.2 をリリースしました。

    結構いろいろ直したりしたんですが、register_post_type のパラメーターで、 rewirte が false になっているものに対してパーマリンクの変更が行われるバグを修正しました。

    また、タクソノミーについても同様に、register_taxonomy のパラメーターで rewirte が false なものについては処理をスキップするようにしました。

    Github: torounit/custom-post-type-permalinks

    プルリクエストとかいろいろ下さーい。

    Simple Post Type Permalinks 2.0.0 をリリースしました。

    こちらは、結構大規模にがっつり直してます。

    • パーマリンク構造タグ %year%, %monthnum%, %day%, %hour%, %minute%, %second%, %author% に対応。
    • ページ分割などが効かないバグなどを修正。
    • クラス構造の変更。

    Github: torounit/simple-post-type-permalinks

    プルリクエストとかいろいろ下さーい。

  • WordPress のプラグインも composer に対応させて packagist に登録するといいよ!

    WordCamp Kansai 2016 でもこんなセッションがありました。

    WordPress 本体やプラグイン・テーマを Composer で管理すると様々なメリットがあります。WordPress + Git でサイト制作するときの悩みだった「どのディレクトリをGitで管理するの?」 という話がかなりすっきり片付くのはとても大きいんじゃないかと。また自動デプロイなどもかなり簡単に行えるようになったり。

    こんな感じで、WordPressを用いたプロジェクト管理がかなり簡単になったりします。

    Github で公開しているプラグインやテーマも Composer に対応させよう

    WordPress Packagist もありますし、あまり苦労はしませんが、それでも、プラグインやテーマを Composer に対応させておくといろいろ便利で楽しいです。npm でやるのと、同じようなノリでプラグインを使ったり、フォークしたりが出来ます。開発版とかを使ったりも簡単にできるので、テストとかにも便利だったり。

    プロジェクトのディレクトリに入った後に、

    $ composer init
    

    とすると、いろいろ聞いてくるので、名前や説明などを入れつつ、Package Type を聞かれるので、プラグインであれば、

    Package Type []: wordpress-plugin
    

    テーマであれば、

    Package Type []: wordpress-theme
    

    としてやればOKです。もし、composer.json が既に存在する場合は、そこに一行、

    "type": "wordpress-plugin",

    と足してあげればOKです。参考:Automattic/jetpack

    ここまで出来たら、あとは、ライブラリ | Composer ドキュメント日本語訳 のチュートリアルのように WordPress のテーマやプラグインを Composer で管理出来るようになります。

    Packagist に公開する

    ここまで来たら Packagist にもついでに登録しましょう。composer.json にいろいろ書かなくても一行追記するか、コマンドを叩くだけで取ってこれるようになります。

    Packagist にログインした後、Submit を開いて、レポジトリのURLを入れるだけです。めちゃくちゃ簡単です。

    packagist

    こういったエコシステムをうまいこと使えるとなかなか楽しいですよー

     

  • WordCamp Kansai 2016 で、プラグイン作成のハンズオンもしてきました。

    WordCamp Kansai 2016 で、プラグイン作成のハンズオンもしてきました。

    先日の WordCamp Kansai 2016登壇させて頂きましたが、それとは別に、WordPress プラグイン作成のハンズオン の世話役も担当させて頂きました。といっても内容はほとんど一緒に世話役をやった宮崎さんに丸投げしたような記憶があります。

    WordCamp Kansai 2016 プラグイン作成のハンズオンで進行役などをしてきました! | memocarilog

    当日の資料はこちら。wckansai2016/plugin-hands-on

    「この記事は○分で読めます」みたいなプラグインを作ると言うことで、自分は話のネタ用のプラグインを作りました。

    wckansai2016/plugin-hands-on-sample

    とりあえず、add_actionadd_filteradd_shortcode の3点セットの話が出来れば良いかなーということで作ったので結構ガバガバです。なのでおかしいところを発見したらプルリクエストくださいー。

    フォローアップというか補足みたいなもの

    プレフィックスについて

    三好さんも指摘していたことですが、WordPressのプラグインやテーマは普通に実行中に include されるので、一般的な名前を使うと関数名、アクションフック、フィルターフック等が衝突したりします。関数名の衝突が起こると、画面真っ白になりますしフックが衝突するとよからぬ挙動が発生します。

    なので、必ずプレフィックスをつけることをオススメします。今回のプラグインだったら、

    function plugin_hans_on_sample_func()
    

    みたいな感じですかね。すべての関数にこれを付けたりするのが面倒だという場合は、クラスを活用したりするという手があります。

    もしくは PHP 5.3 以前をサポートしないならば、名前空間を使うという手もありますが、WordPress 本体が PHP 5.2 を現状サポートしているので、使うならば、古い PHP の場合に白い画面にならない工夫や、エラーメッセージの表示など、気をつけないといけないことがいろいろ出てきます。

    管理画面に機能を追加する

    当日の質問で時間が足らずにお答え出来なかったのですが、この話をやり出すと時間が1時間以上かかってしまう気がするので、とりあえず サイトの拡張性を飛躍的に高める WordPressプラグイン開発のバイブル の8章あたりを読んでみるといいと思います。

    また、megumiteam/hatamoto を使って開発を始めるのもアリでしょう。シンプルな管理画面がはじめから付いているので、CSRF対策の具体的な方法を勉強するにはちょうど良いサンプルかなと。具体的な使い方は宮内さんの記事を参考にどうぞ。

    https://firegoby.jp/archives/5604

    あとこれとは別に、Settings API なんてものもあります。既存の管理画面に項目を追加したりする場合に用います。

    ちゃんと使うと値の保存とかバリデーションとかも出来るようですが、結構大変だったりします。使いこなすとめちゃくちゃ強力だと思いますが、まずは普通にプラグイン専用の管理画面を作れるようになれば十分かなと思ったりします。

    WordPressの管理画面に独自のオプション保存をするためのSettings APIの使い方 – Shinichi Nishikawa’s

    プラグインの国際化

    公式ディレクトリへの登録や配布などを考えたときにプラグインを翻訳を考える必要が出てきたりします。やっぱり公開するとフィードバックが欲しくなるもので、そうなると国際化ってとても大事なテーマかなと思います。

    今回のハンズオンでは取り扱いませんでしたが、Codex に詳しい資料があるので興味のある方は見てください。

    I18n for WordPress Developers – WordPress Codex 日本語版

    また、サイトの拡張性を飛躍的に高める WordPressプラグイン開発のバイブルの13章にも詳しい解説があります。

    このプラグインの作りかた

    本題とずれまくるので今回は説明しなかったことをつらつらと。

    このプラグインは、WP-CLI 使ってプラグインのひな形を作成しています。

    $ wp scaffold plugin plugin-hans-on-sample
    

    地味ですがすっごい便利だったりします。そこから生成されたファイルにコードを書いてます。

    また、PHPUnit によるテストも書いています。

    ここら辺の環境構築をサクッと行いたい場合は、VCCW が便利です。

    まとめ

    プラグインそのものを作るのはホントに簡単です。コメントを書いたPHPを用意して、せいぜいreadme.txt を用意するだけでOKです。Hello Dolly や Nothing Much のような何もしないプラグイン、Hello Kushimoto といった完全にネタとしか思えないもの(実はそんなこと無いんですが・・・w)もあったりします。

    ですが、WordPress が用意している API も山ほどありますし、本当に出来ることも多いです。WooCommerce や、BuddyPress など WordPress サイトにかなり大幅な機能追加をするプラグインもあったりします。

    MySQL の知識や、高度な PHP や、JavaScript の知識が必要なカスタマイズなども様々です。

    とりあえず、バイブル や Codex を読みつつ、自由な発想でプラグインを作れば良いんじゃ無いかと思います。

    これを機会にプラグイン作ったよーってひとが居たらぜひぜひお声かけくださいませませ。

    プラグインとか作ると楽しいよーってセッションもしたのでこちらもどうぞ。

    Custom Post Type Permalinksを公式ディレクトリに公開しました。

     

  • WordCamp Kansai 2016 でオープンソースの楽しさみたいな話をしてきました。

    WordCamp Kansai 2016 でオープンソースの楽しさみたいな話をしてきました。

    先日行われた WordCamp Kansai 2016 に参加してきました。今年は初めて実行委員として、主にセッションチームの仕事を、またセッションとハンズオンをそれぞれスピーカーとして担当させて頂きました。

    懇親会で飲み過ぎて二日酔いだったり、そもそも移動の疲れや大阪の蒸し暑さで体力ゼロでした。そんな体が悲鳴を上げる中で、ワクワクしてセッションを聞きに行ったり、「裏番組のセッションとかハンズオンも絶対面白いじゃん!どうして体が2つ無いの!」って思いながら当日過ごして居たので、それはとても良かったのかなーと思う次第です。おかげさまで昨日は熱出して寝込みました。

    WordPress.tv に後日動画がアップロードされるので、ゆっくり見ようと思います。

    実行委員・スピーカー・そのほか支えてくれた皆様お疲れ様でした。ありがとうございました。

    実行委員としての話はながーくなるので、とりあえず、自分の担当セッションのフォローアップ的なものを。

    「WordPressのプラグイン作ったりコアコントリビューターになった話。 そして、その楽しさと意義。」

    自分のオープンソースへの取り組み、というと大げさですが、そういったことに関わったことでの個人的な感想・体験などを共有出来ればと思いました。

    オープンソースにすることやコントリビューションすることで発生するコミュニケーションってのは楽しいですし、また、いろんな人の小さなコントリビューションの積み重ねでいろんなものが便利になっていくってのは、とってもステキなんじゃ無いかと思ったりするわけです。

    今回だと、GitHub と Travis CI で WordPress テーマをテスト、ビルド、そして自動化 というテーマで今回登壇して頂いた羽野さんの amethyst というテーマにプルリクエストを送ったりしていたんですが、めちゃくちゃ勉強になりました。また、当日初対面だったのですが、その件でいろいろ話し込んだりすることが出来たのがすっごい楽しかったです。

    去年の WordCamp Kansai でも実は初対面だったキタジマさんと飲みに行ったり。

    初対面の人に話しかけたりすること等が苦手で、テレビとかに出てくるナンパ師みたいなコミュ力お化けみたいな人からは全力で逃げるタイプの人間ですが、そんな僕とってのコミュニケーションの方法がオープンソースなのかなと、終わってみて改めて気づいた今回の WordCamp Kansai でした。

     

    プラグインを公開したときの記事があったのでそちらもどうぞ。

    Custom Post Type Permalinksを公式ディレクトリに公開しました。

  • Composer WordPress Development Kit 3.0.2 をリリースしました。

    Composer WordPress Development Kit という、Composer と PHP のビルトインサーバーを使って、WordPress 環境をサクッと立ち上げるものを以前作ったんですが、バージョンアップしました!

    Composer で WordPress 環境をさくっと立ち上げるやつを作りました。

    使ってみていろいろ気になったところなどが出てきたのでかなり大幅に変更しました。

    変更点などなど

    ドキュメントルートをディレクトリ直下に変更しました。なので、サーバー上 で WordPress を立ち上げるときも同じコードをそのまま使えるようになりました。Git の Webhook を使って、レポジトリが変更されるたびに、自動デプロイ出来るようになったりしてます。デプロイ自動化などは、第2回 Gitリポジトリからテスト環境への自動デプロイ – CPIエバンジェリストコラム 等を参考にすれば良いんじゃ無いかなと。

    WordPress を丸ごと composer で管理出来るといろいろ便利ですね。

    そのほかコマンド追加など

    $ composer import-theme-unit-test

    で、テーマユニットテストがコマンド一発でインポートできるようにしてあったりしてます。

    $ composer provision

    でWordPressのインストールをするように変更したり、

    $ bash ./bin/server.sh
    

    でビルトインサーバーの起動をするように変更しました。

    そのほか、サーバ上で運用するために、config.php ファイルというのも新しく作ったり、config.json を local-config.json って名前に変えたりしてます。

    詳しい使い方はドキュメントを参照してください。

    気づいたこと

    以前、WordPress Packagist を使うと、WordPress のプラグインも Composer で管理出来ることは知っていたのですが、プラグイン側の composer.json に、

    "type": "wordpress-plugin"

    と書いておいて、Packagist に登録しておくと、ちゃんと WordPress のプラグインとしてインストール出来るようです。
    https://github.com/Automattic/jetpack とかもちゃんと書いてありますね。

    使うには、composer.json にディレクトリの指定を書いたりする必要があります。こんなかんじ。ベータ版などを試すときとか地味に便利そうです。

    WordPress でも PHP のエコシステムをうまいこと使っていければ、かなり便利に開発を進めていけそうですね。

    レポジトリ

    何かあれば issue とかプルリクとかくださいー。

     

  • WordBench 山梨 Vol.2 でライトニングトークしてきました。

    先週の土曜日に行われた、WordBench 山梨 Vol.2 で、ナツミーヌさんに「LTしないとお前もベジェ曲線にするぞ」とデーモン閣下風に脅されたので(嘘)LTしてきました。

    とろゆにっとさんは非常にまじめな人間です。ですので当然、まじめなLTをやるはずだったのに、芸人枠と紹介されたのは非常に心外です。抗議も辞さない!

    というわけで当日のスライドです。

    カスタムフィールドの便利さと、技術的負債、そして愛について熱くしゃべってきました。WordPress をただ使うのでは無く、いろんな選択肢の中から WordPress を「選択する」ためのヒントになれば良いなーと思います。

    ウケたかどうかは良く解りませんがなんとかやりきりました。実はLTってあんまりやったこと無かったりするので、楽しかったです。

    ほかにも、たぬきさんや、なま&はげのはげの人(はげてない)や、人狼の人など、全般的に妙な方向に濃かった会だった気がします。

    http://www.slideshare.net/GOUTEN/ss-58786247

    質問コーナーなどもあってそれも妙に濃い話になってたのが僕的には面白かったです。割とかみ砕いて話したつもりなんですけど、実際どうだったんでしょうかね。

    とりあえず、懇親会も楽しかったです。WordBench 長野も頑張ろうと思いました。ナツミーヌさんありがとうございますー。

    おまけ

    カスタムフィールドの闇は深い。

  • Powerful Posts Per Page 0.9.0 をリリースしました。

    Powerful Posts Per Page 0.9.0 をリリースしました。

    管理画面から、カテゴリー・カスタム投稿・タクソノミー等のアーカイブの表示件数を、管理画面から変更できるプラグイン Powerful Posts Per Page (PPPP)  をバージョンアップしました。

    screenshot-1
    管理画面こんな感じ。

    最新版でテストをしたり、PHP 5.3 でテストしたり、ついでにカバー画像を変えたりしました。

    たぶんコーポレートサイトで製品紹介とかやるときとか、ギャラリーをやったりするときとかで使えるんじゃ無いかなーとか思ったりしてます。

    プルリクくださーい。

  • Composer で WordPress 環境をさくっと立ち上げるやつを作りました。

    普段は VCCW を好んで使っているんですが、ちょっとお手軽環境もほしいなぁとか、Composer をもっと積極的に WordPress に導入する方法は無いんだろうかとかいろいろ考えてた訳ですが。

    というわけで、Composer WordPress Development Kit なるものを作りました。

    Composer WordPress Development Kit

    まぁ名前通りそのまんまですが、Composer で WordPress の開発環境作ったよ的な奴です。WordPress Packagist を使うと、WordPress のテーマやプラグインも Composer で管理出来ます。

    プラグイン・テーマの検証とかフォーラム回答とかで、さくっと起動してさくっと使い捨てる環境ほしいときに便利です。たぶん。

    また、WordPress と外部の PHP ライブラリや、JS フレームワークを組み合わせたアプリケーションのひな形的なものとして使えれば良いなーと思って作りました。

    使い方

    とりあえず、php・mysql・jq・composer を動くようにしてください。OS X の人は homebrew を使えば楽です。別に composer は phar をダウンロードして使っても大丈夫です。

    $ brew install mysql jq composer

    その後、適当なディレクトリに、composer create-project をすると、ひな形が作成されます。

    $ composer create-project torounit/composer-wp-dev-kit path/to/project

    その後、config.json を編集し ./bin/provision.sh 実行すると、PHPのビルトインサーバーで、WordPress 環境が立ち上がります。

    $ cd path/to/project
    $ atom config.json
    $ ./bin/provision.sh

    また、ディレクトリ構成を通常の WordPress からいじってあります。本体は、www/wp にインストールされますが、wp-content は www/wp の外側に出してあります。テーマとかプラグインをレポジトリに突っ込んで管理するにはやりやすいのかなーとは思います。

    また、Composer でインストールされたものは、 mu-plugins に突っ込んで有り、autoload されるようになってるので、Composer で適当なライブラリをゴリゴリ放り込んでつかうのも有りかなとは思っています。

    Built-in Server Helper

    また、これを使ってると、WP-Cli で PHP のビルトインサーバーが起動するんですが、パーマリンクの設定画面を見ると、index.php が入ってしまうんですよね。

    これをどうにかするためのプラグイン、Built-in Server Helper を作成しました。プラグインディレクトリにも公開してありますし、Composer WordPress Development Kit にも同梱してあります。

    一応 PHP -S のほうでのビルトインサーバーのほうにも対応してますが、ルータースクリプトが無いので、URLに拡張子がついていると、そのファイルへのアクセスになります。そうすると 404 になるので、その場合は index.php 付きの URL をセットします。まぁ、WP-CLI 使えばいいと思います。

    そのほか

    とりあえず、WordMove にも申し訳程度に対応してますが、mu-plugins を使っているので、preバージョンの 1.4 からの対応です。

    とりあえず、プラグインの検証とJS フレームワークと REST-API を組み合わせたアプリケーションのひな形として使っていこうかなと思ってます。

    何かあれば issue とかプルリクとかくださいー。