2017年12月16日土曜日

第71回 WordBench大阪 2017年振り返り座談会&年忘れLT に参加して #wbosaka

会場のファーストサーバーのある建物おクリスマス風に変わってますね!



今回は飛び入り LT を募集するなど、かなり流動的なプログラムでした。
また会場での懇親会は、いつも食べ物余ったりするので飲み物だけになりました!
ちょうど昼は近くのガストで1200カロリーぐらいのハンバーガー定食を食べてしまい、有力は抑えようと思っていたのでちょうど良かったです!



プログラム



座談会


簡単な自己紹介


今年の WordBench 大阪のテーマを振り返って





WordBench 大阪で来年やってほしいテーマ

  • 公式プラグインの作り方をやってほしい
  • WordPress の動く仕組みについて知りたい
  • WP-CLIの使い方を知りたい
  • アンカンファレンスをやってほしい
    ※特定テーマについていろいろなタイプの人たちと話し合ってみたい
また近々 Google フォームあたりで募集するかも。

2017年の印象的だったこと

  • WordPress の REST API 脆弱性(2017年2月)- WordPress 4.7/4.7.1が問題だった
    • アップデートを止めていた(アップデートでコケたときの責任が取れない、予算が取れない等)
    • FTP経由でしかアップデートできない(頻度が低いと・・・)
    • 発表された瞬間ぐらいで不正アクセスされて間に合わなかった
  • どこからのアタックが多い?
    • ウクライナとか...(2名ぐらいの声が...)
      ただ攻撃者は大体身元がわからないように迂回するので、必ずしもウクライナから攻撃されているわけではない。
      ※ 第42回 WordBench大阪「WordPress とリスク管理」(スライド)で筆者が少し説明している。

など話はつきないが時間切れ。

LT(ライトニング・トーク)


WordPress のテーマ開発フローをブログに書いたお話(YAT)



を作った(6万文字!!)。
50時間ぐらいかかった。。書籍ぐらいの分量がある....
  • テーマの作り方をしっかり知りたい人
  • 安全なテーマを作りたい人
  • 100% GPL で公開してます!
  • Local by Flywheel を使ったローカル環境構築から説明してます!

WordPress プラグイン「UpdraftPlus」の紹介(覆面くんさん)一本目


WordPress のバックアッププラグイン です。
WordCamp Tokyo 2017 のアンカンファレンスでバックアッププラグインとして UpdraftPlus が上がってきた。(筆者もそのアンカンファレンスに参加した / 筆者ブログ参照

  • このプラグインは、本体とデータベース両方のバックアップができる。
    # ついでにプラグインやテーマなど個別に復元も出来る。
  • Google ドライブ等クラウドサービスへのバックアップが可能
    # バックアップ先に応じて費用が必要(拡張機能を拡張するプラグインが有料という感じ。Googleドライブは無料)
  • デフォルト保存先
      wp-content/updraftplus フォルダ内に入る

未経験から Web デザイナーを目指して、WordPress サイトを作った話(西村さん)


未経験だったころの話。
マークアップエンジニア。
2015年にデジタルハリウッド大阪校に入学するまで全くWebに関する知識は無かった。

小学校のお便りを作りたいときいて、そういったことをどうやればいいのだろうと思ったら、ピンクの髪の人が WordPress いいんじゃないと言われて CMS関連の情報を初めてチェックした。

  • とにかく調べる
  • とりあえず動かす
  • よく知っている人に聞けばいい
どうやってきく。。。。WordBench にいったらいい!!って気づいた!

しょーたさん


宣言がしたい!

18歳のときに吉本興業の門を叩く...
月収1万円以下だった...

アメリカへ...いったり、サービス業関連のマネージャーをしたり、ECサイトを使った物販してみたりしていたら、コンチ師匠...に出会って、 WordPress についてより深く知ってWeb構築についてを仕事にしたいと思った。。。あと海外との仕事をしたいと思っているから、来年海外に移住するぜ!!

という宣言。

# なかなか異色な方でした。喋るのがとても上手かった!

WordBench 京都への関わりと何を得たか(KONISHIさん)一本目


座談会やモブプログラムなどが盛り上がった。
勉強会とかコミュニティで発表していると、お誘いがくることがある。
登壇することで、登壇駆動でいろいろな勉強ができる。

なので参加するだけでなく、登壇もしてみましょう!!

WordBench 京都 怖い(KONISHIさん)二本目


迂闊なことをやると登壇させられるぞ!!

と聞いたけれど、そんなのは気のせいだよ!!

何故そのような噂が出てきたのか。

登壇に関して、巻き込み、狩り、拉致とかいう言葉を使って登壇者とやり取りをしているからかもしれない。

しかし巻き込まれた人からは、すごく勉強になってよかったという実感の声を聞く。
  • 100回の参加より1回の登壇の方が勉強になる!!
WordBench 京都は、一歩踏み出したい人をサポートするコミュニティです!
是非参加を〜

Quiita 版 WordPress - Advent Calendar  2017 の紹介(覆面くんさん)二本目


クリスマスまで一ヶ月間毎日ブログをアップするイベントのこと。
割りと沢山の種類の Adbent Calendar がある。


これまでの 15日間の記事内容を紹介。

WlrdCamp Osaka 2018 について(GOTENさん)


2017年6月2日-3日あたりを予定(まだ予定)

キックオフミーティングをしたよ!

# WordCamp とは WordPress に関する 公式イベント。

興味があれば実行委員になってみませんか!!


2017年12月16日 @kimipooh

2017年11月16日木曜日

LogBook プラグインを使って WordPress の重要操作ログを手軽に取ってみよう

LogBook プラグインは、WordPressの操作をログとして保存するプラグイン LogBook をリリースしました(TaroSky)で紹介されている通り、ログ関連のプラグインです。

開発した宮内氏は、筆者も WordPress 管理運用をする上で欠かすことのできないコマンドラインツール WP-CLI チームの日本唯一のコミッターです。WP-CLIのコミッターになってからの4週間でやったことと感じたこと(Capital P)での宮内氏の発言をみるだけでも、ものすごく沢山のコミットを積極的にされているのが伺えます(というか GitHUBみたら、最近の1年間は少なくても毎日なにかの更新されてます @@!)。

また見逃していましたが、「WP-CLIをつかってWordPressのDBをコマンド1回で別のサーバーに引っ越す」ってのは、すごすぎですよね!

また WP-CLI で引っかかるメモリ問題に関してもしっかり記事「WP-CLI でメモリ不足のエラーが出る時の対処法(Quiita)」をかいていて、これも活用させてもらってます。

さらには、最近 Google Analytics を埋め込むプラグインが Jetpack と相性が悪いのが動作しなくなったサイトがあったときに、宮内氏が開発されている WP Total Hacks にもお世話になってます。

その宮内氏が、サイトの重要なイベントに対して負荷をあまりかけずにログを記録するというプラグインを開発したとなれば、これはもう使ってみなくちゃいけません!

WP-CLI からプラグインのアップデートしたら





フムフム、サーバー上(127.0.0.1)から、WP-CLI にてプラグインを2度アップデートしたと記録に入っていますネ!その通り!

管理画面からプラグインを停止・有効化してみたら




ホウホウ、筆者端末のIPアドレスから、ユーザー kitani (筆者)で Antivirus プラグインを停止したと。

あれ、「なし」が入っているのはバグかな (^^; って思ったら、こちらの特定1サイトのみの現象でした。これはこのプラグインではなく別の何かに原因がありそうですね。

WP-CLI から バックアップ > プラグイン更新 > コア更新 > 翻訳更新 > プラグイン更新 をしてみたら




むむ、コア更新 > 翻訳更新しか記録されていませんね。
なぜかを検証してみましょう。

まずバックアップから翻訳更新までは、ちょっと特殊な更新方法をしています。
(wp は /usr/local/bin/wp)

  1. wp backwpup --jobid=ID番号
  2. wp plugin list | cut -d '|' -f 2 | awk '{print "/usr/local/bin/wp plugin update "$1}' | sh
     ※アクティブプラグインだけ更新
  3. wp core update 
  4. wp core update-db
  5. wp core language update
  6. wp plugin list | cut -d '|' -f 2 | awk '{print "/usr/local/bin/wp plugin update "$1}' | sh 

という流れになっていて、赤文字のところだけが記録されています。

これを次のコマンドに変更して実行してみました。
  1. wp backwpup --jobid=ID番号
  2. wp plugin --all 
     ※アクティブプラグインだけ更新
  3. wp core update 
  4. wp core update-db
  5. wp core language update
  6. wp plugin --all 
するとプラグインも認識しました。
6番目は更新プラグインがないのでログには記録されていません。
※2度目のプラグイン更新の意味は、時々 WordPress の新バージョンのみ更新可能なプラグイン(プラグイン新バージョンが新しい WordPress を求めている場合)があり、新バージョンにしてから更新リストに出てくる時があるため。



個別のプラグイン更新(wp plugin update ◯◯)はちゃんと登録できているので書き方なんですかねぇ。まぁもうcut を使ってアクティブプラグインだけ更新するのはやめたのでいいんですけどね。
※なお cut などを間に挟むようなことをしていたのは、特定プラグインを除くなどの目的だったのだが、wp plugin update --all --exclude=logbook などで logbook 以外のプラグインすべてをアップデートとかできちゃうので、もう不要なのですよね。

2,3のサイトで数日テストして問題ないようなら、
【備忘録】WP-CLI エイリアスを利用したリモートサーバーの WordPress 管理 #wckyoto2017
を参考に、
wp @all plugin install logbook
wp @all plugin activate logbook
で手持ち端末から WordPress やサーバーにログインせずに、一括インストールと有効化するかなー

ってことで終わりにしようと思いましたが、このプラグイン、日本語化されていないのですよねぇ。個人的には翻訳不要なのですが、翻訳する分量が 70ぐらいなので翻訳してみるかぁと思ってやってみました。

LogBook プラグインの翻訳




最近の WordPress プラグイン翻訳は、https://translate.wordpress.org より手軽にすることができます。自分のプラグインならどのような場面でその言葉を使っているかわかっていますが、他人が開発したプラグインは、その利用場面によって翻訳内容が変わるときがあります。
また翻訳するにあたっては、


を参考に、長音文字、受動態はできるだけ能動態へ変換する、半角文字と全角文字の間には、半角文字1字分のスペースを入れる、などのよくあるものに特に注意を払いながら訳していくことになります。
翻訳(実際には提案)が完了したら、日本語版 WordPress Slack の #requests チャネルで翻訳の承認を依頼します。そうすれば、翻訳の達人の皆さんがチェックをしてくださることでしょう、きっと。最終的には、承認権限をもっている方によって承認されれば、めでたくみんなが使えるようになるってことです。

各プラグインの翻訳トップページに移動するには、各プラグインのダウンロードページにアクセスし、下記のように出てくれば、まだ日本語翻訳されていないことになります。


下図のように表示されれば、少なくても一度は翻訳済みになります。
ただし、プラグインが更新されていくなかで、翻訳が不十分になっているケースもあります。「Help translate it!」あるいは「翻訳の改善のご協力ください」のいずれかのリンクをクリックすることでそのプラグインの翻訳トップに移動します。


LogBook は翻訳して承認待ちなので、Waiting に入っています。



すでに 100%翻訳されていて、承認済みの場合には下記のように 100% の表示になります。



確か 95% を超えて、これが承認されればプラグイン本体に翻訳が反映されるようですね!


2017年11月16日 @kimipooh

2017年10月31日火曜日

コマンドツールで MAMP を SSL 対応しよう! - macOS High Sierra 編 -

筆者は、長らく MAMP を利用してきました。
しかし WordCamp Kyoto 2017 を契機に、 valet というツールも積極的に使うようになりました。この valet のいいところは、VCCW, Wocker などの優れたツール同様、WordPress をインストールしたり削除したりする機能が盛り込まれているので、テスト環境を作成しやすいことです。また標準で 下図のように自己証明書エラーにならない常時SSL(https://◯◯.dev) が利用できます!



【Virtual Host 対応】コマンドツールで MAMP を SSL 対応しよう! - macOS High Sierra 編 - も公開(2018年2月9日)

valet では .htaccess が使えない


valet は Apache ではなく Nginx が利用されているので、 .htaccess が利用できません。WordPress を動作させるだけなら、それでも十分なのですが、SiteGurad プラグインなど、.htaccess が利用できることを前提に作成されたプラグインのテストが出来ません。また WordPress にかぎらず、Apache でテストしたいこともあるでしょう。

そういった場合には他のツールを利用する必要があります。

MAMP に欠けているもの


  1. WordPress の自動インストールと削除
  2. 常時SSL対応
MAMP PRO だとSSLには対応していたと思いますが、それもコマンドでできるわけではありません。コマンド一発でできることが重要なのです!

なお SSL化した場合、しなかった場合、いずれにおいても WordPress の自動インストールと削除ができるツールを
に置いてます。
詳しくはそちらをチェックしてみて下さい。

また MAMP で SSL を利用するためには、 Apache Port を 80 にしなければなりません。macOS の MAMP はデフォルトで 8888 なので、これを変更することになります。


そうするとこれまで http://localhost:8888 にアクセスしていたのが、 http://localhost になり、WordPress をインストールしていたら引っ越ししないと動かなくなります。

まぁそういう場合には、 アプリケーション > MAMP を別名にしておいて、再度 MAMPをインストールし、 2つの MAMPフォルダをつかいわけるとよいかと思います。
アプリケーション > MAMP とフォルダが決め打ちになっているので、利用したいMAMPフォルダをこのフォルダにもっていきます。

MAMP を SSL 対応するコマンドツール 「mamp-enable-ssl.csh」


にある mamp-enable-ssl.csh になります。

なんでそこまでやるのかという問いには、
  • 開発環境を変えるよりは簡単だから
と答えておきましょう。まぁ半分は趣味です。
Chomre 58 以降で必須になった SAN (SubjectAltName) にも対応してみました。

どうやって利用するの?


MAMPがインストールされていることが条件になります。
また openssl がインストールされている必要があります。
HomeBrew か Macports であらかじめインストールしておいてください。

mamp-enable-ssl.csh を仮にデスクトップに置いたとします。

ターミナルアプリを起動して

$HOME/Desktop/mamp-enable-ssl.csh

※それで下記がでなければ、
csh -f $HOME/Desktop/mamp-enable-ssl.csh をタイプしてみてください。

をタイプすると、

Generating a 2048 bit RSA private key
......+++
.......+++
writing new private key to 'private/ssl.key'
Enter PEM pass phrase:

とパスフレーズを聞いてきます。
これは CA認証局用のパスワードです。
まぁ自分しか使わないのでなんでもいいです。入力したら Enter を押して下さい。

Verifying - Enter PEM pass phrase:

と今入力したパスワードの確認が必要になりますので、入力して Enter を押します。

-----
Country Name (2 letter code) [JP]:

次に、CA認証局用の情報入力画面が出てきます。
予め openssl.cnf にて入力済みなので、7回 Enter を押してそのままにしましょう。

State or Province Name (full name [LOCAL]:
Locality Name (eg, city) [LOCAL]:
Organization Name (eg, company) [MAMP]:
Organizational Unit Name [MAMP]:
Common Name (eg, YOUR name) [localhost]:
Email Address []:
Generating a 2048 bit RSA private key
.....................................+++
..............+++
writing new private key to 'server.key'
Enter PEM pass phrase:

すると、またパスフレーズ入力画面で止まります。
先程入力したパスフレーズを入力して Enter を押してください。

Verifying - Enter PEM pass phrase:

と今入力したパスワードの確認が必要になりますので、入力して Enter を押します。

-----
Country Name (2 letter code) [JP]:

次に、SSL証明書のための情報入力画面が出てきます。
予め openssl.cnf にて入力済みなので、9回 Enter を押してそのままにしましょう。

State or Province Name (full name [LOCAL]:
Locality Name (eg, city) [LOCAL]:
Organization Name (eg, company) [MAMP]:
Organizational Unit Name [MAMP]:
Common Name (eg, YOUR name) [localhost]:
Email Address []:

Please enter the following 'extra' attributes
to be sent with your certificate request
A challenge password []:
An optional company name []:
Using configuration from openssl.cnf
Enter pass phrase for ./private/ssl.key:

すると、またパスフレーズ入力画面で止まります。
※これによって、作成した SSL証明書にCA証明局による署名をします。
先程入力したパスフレーズを入力して Enter を押してください。

Check that the request matches the signature
Signature ok
The Subject's Distinguished Name is as follows
countryName           :PRINTABLE:'JP'
stateOrProvinceName   :ASN.1 12:'LOCAL'
localityName          :ASN.1 12:'LOCAL'
organizationName      :ASN.1 12:'MAMP'
organizationalUnitName:ASN.1 12:'MAMP'
commonName            :ASN.1 12:'localhost'
Certificate is to be certified until Oct 29 08:13:51 2027 GMT (3650 days)
Sign the certificate? [y/n]:

すると、署名をしてよいかどうか聞いてくるので、y をタイプして Enter を押してください。

1 out of 1 certificate requests certified, commit? [y/n]

すると、署名を有効にしてよいかどうか聞いてくるので、y をタイプして Enter を押してください。

Write out database with 1 new entries
Data Base Updated
Enter pass phrase for server.key:

これで署名完了です。
最後にまたパスフレーズを聞いてきます。先程入力したパスフレーズを入力して Enter を押してください。

※これは、Apache に埋め込む証明書のパスワードを削除するためです。
そうしておかないと Apache を起動しようとしたときに、最初にいれたパスフレーズを毎回いれなければなりません。それを回避するためです。

writing RSA key

これで設定は完了です。

次に、CA証明書ファイル「MAMPフォルダ > conf > apache > ssl > ssl.crt 」 を macOS のキーチェーンに登録します。

CA証明書ファイル「MAMPフォルダ > conf > apache > ssl > ssl.crt 」を開いて下さい
下図のような画面になりますので、そのまま「追加」してください。
次に追加した CA証明書ファイルを「信頼」する設定をします。
アプリケーション > ユーティリティ > キーチェーンアクセス を開いて下さい。

そして「localhost」で検索すると先程インストールした「証明書」があると思います。
この時点では証明書は信頼されていません。


これをダブルクリックして設定を開いて下さい。
そして「信頼」にある SSL (Secure Sockets Layer) を「常に信頼」に変更してください。


すると、今 macOS にログインしているユーザーのみ、この証明書を信頼したことになります。



MAMPを起動してみよう!


問題なく起動したら、 https://localhost にアクセスしてみてください。


と出てきたら成功です。


と出てきたら、Cookieやキャッシュが残っている可能性があるので、それらを削除した上でブラウザを起動しなおしてみてください。あるいはそれが面倒なら、ゲストモードやプライベートモードを利用してみてください。

もし下記のようなエラーが出た場合には、「キーチェーンアクセス」にインストールした自己証明書が存在しないか、「常に信頼」設定をしていないことになります。再度チェックしてみてください。


もし途中でパスフレーズを忘れてしまった場合


再度

$HOME/Desktop/mamp-enable-ssl.csh

をしてやり直せばよいです。
初期化してやり直してくれます。

SSL 対応をやめたい場合にどうすれば?


いくつか方法があります。

  1. MAMPフォルダ > conf > apache > httpd.conf の下記をコメントする
     # Include /Applications/MAMP/conf/apache/httpd-ssl.conf
     と先頭に # を入れる。そして MAMPを再起動
  2. MAMP設定で nginx に変更する
     ※ nginx は SSL非対応
  3. MAMPを再インストールする
    1. MAMPフォルダの db と htdocs フォルダをバックアップし、 MAMPフォルダをまるごと削除
    2. MAMPをインストールし、バックアップした db と htdocs を戻す

Appendix. このツールはどういう動作をするの?


大まかな流れを説明します。
  1. openssl がインストールされていることを確認(Homebrew or MacPorts or /usr/local/bin/openssl が存在するかどうか)
  2. MAMP の conf/apache/httpd.conf を書き換え、conf/apache/httpd-ssl.conf を読み込むようにする
  3. conf/apache/extra/httpd-ssl.conf --> conf/apache/httpd-ssl.conf にコピーし、必要な置換を行う
    1. 証明書関連
    2. ログ関連
  4. CA 認証局 & SSL 証明書を発行(sha256, 2048bit)
    1. conf/apache/ssl フォルダを作成(存在したら削除し、作成)、サブフォルダ等作成
    2. conf/apache/ssl/openssl.cnf を生成
      ※中身は、本スクリプト内に埋め込み
      ※ここの localhost を別の名前にしたら、独自ドメインなども利用可能です。もちろん別途 /etc/hosts に 127.0.0.1 に対して 独自ドメインを有効にする設定が必要です。
    3. 各種証明書の発行

2017年10月31日 @kimipooh

2017年10月15日日曜日

第69 回 WordBench 大阪「WordPress ログインに Google 認証を使ってみよう」で登壇して #wbosaka #wordpress #google


今回は登壇者として参加しました。
セッションとハンズオン合わせて 3時間ほど時間をもらっていましたが、みんな優秀で 1時間強でセッションとハンズオンが終わってしました @@!
ハンズオン自体はおかげさまで好評だったようで、それぞれの実環境やクライアント環境で導入するというと言ってくださった方々がいたのでやったよかったかなと思います。

雨が降る中、会場となるファーストサーバー大阪本社へ、参加登録していただいた19名(内メンターが2名)について、全員参加していただきました。ありがとうございます!




登壇者って凄いのって思われるかもしれませんが、WordBench 勉強会に関してはそうでもありません。発表することでより深く WordPress について勉強することができるので、◯◯についてもっと詳しくなりたいな!と思ったら、発表者になってみるのもよいですよ!昔、「1週間後にクライアントに納品する WordPress はあるけれど、手持ちには 静的HTMLで作ったデータしかない、どうやって WordPress にしたらいいですか」を参加者に聞くために登壇者になった強者もいました。実際その場で逆ハンズオン(参加者が登壇者に教えていく)をしたわけですが、そういうのもありじゃないかなーと思います。

今回の反省点はこれだけ時間的余裕があるなら、「WordPress のローカル環境を手軽に作成してみよう!」なんてのを合わせてやってもよかったなぁと思いました。人によっては vagrant 環境を以前入れていたが、久しぶりに動作させようとすると動かなかったりした方もおられました。ので、そういうのを合わせてやるといい感じかなと。また機会があれば、WordCamp 等でやってみたいですね。

特に今回のために、 MAMP にコマンド一発で WordPress をインストールしたり、削除したりするツール(GitHUBで公開)を作成したので、MAMPとツールを使ったハンズオンもよいかなと思いました。ただMacしか試してないので、今回のように参加者全員が Mac ユーザーでないかぎり、Windows のことを考えないといけないので、そこはいろいろ試さないといけませんよね。

スライド




セッションとハンズオンの内容もすべて網羅しています。
これを見れば問題なく導入可能かと思います。
ただ2,3戸惑った方がおられたので、そのケースについて下記の紹介しておきます。

スライド19〜21において、Google Developer Console (Google Cloud Console内)のAPI設定におけるいろいろなケースについて紹介しています。
そこで漏れていたのが、ポート指定されたURLです。

http://localhost:8888/demo/  の場合にはどういう指定がしたらよいか


認証済みのJavaScript生成元:http://localhost
認証済みのリダイレクト URI:http://localhost:8888/wp-login.php


となります。
認証済みのJavaScript生成元については、 http://localhost:8888 をいれて保存すると自動的に、http://localhost に修正されます。

Appendix. WP-CLI コマンドで WordPress の自動メンテナンス


時間が余ったので何名かとこの話題について話しました。
ssh ログインが出来るサーバー なら出来る可能性があります。
実際には、WP-CLIコマンドをインストールできて(パスのある場所にダウンロードした WP-CLIを置くだけでいい)、cronが使えたら完璧です。当方は AMIMOTO のマネージドホスティングを使ったりします。ssh でログインできれば大抵のところはインストールできるんじゃないでしょうか。
それができれば上記のように、コマンド一発で、WordPressのバックアップ > プラグイン更新 > 本体更新を自動化できるので、多数の WordPress のメンテナンスを抱えている方々にとっては管理がとても楽になります。

wp @all  core version

なんてのを手持ちの Mac なんかでターミナルから叩くだけで、設定した全サイトの WordPress のバージョン情報が出てきます。これって深刻なセキュリティ脆弱性が報告された際、メンテナンスが必要な WordPress にログインしなくても、それぞれの現在のバージョンが一括で表示できるので超便利ですよ!

これもハンズオンしたら面白いかもしれませんね!

昼食&懇親会


昼食は会場であるファーストサーバー大阪本社から近い所にあるガストで肉を食べました。

ちょっと肉がかたい感じがしましたが、まぁやすいのでそれもまたよし。

懇親会は、GOTENさんが音頭を取って開始!懇親会費は1000円なり〜


結構はやくおわったせいで、ピザがなかなか届かずに、お菓子と飲み物で楽しく歓談できました!


2017年10月15日 @kimipooh

2017年9月17日日曜日

WordCamp Tokyo 2017 に参加して(二日目 コントリビューターDAY) #wordcamp #wctokyo

台風が関西に近づいてます...
その影響でコントリビューターDAYは午前中のみにして、昼から帰ることにしました。
ちょっと残念ではありますが、明日は外せない用事があるので安全を取ることにしました。だからといって、コントリビューターDAYで手を抜くわけではありませんよ!



会場にはお菓子も結構な種類用意されてました!



楽しそうにやってますね!
結構な人数が参加したなぁという感じです。

複数の公開 Google カレンダー をマージして 一覧表示するプラグインを公式プラグインにアップしてみよう!


様々なプロジェクトなどに関わっているとイベントも盛り沢山で、1つの Googleカレンダーで管理するには限界が生じます。ならばマージして一覧表示してしまえばいいんじゃね?という発想です。仕事では現時点では1つの Googleカレンダーの各イベントにハッシュタグを作って、言語判別(#lang)、主催者(#organizer)、種別(#type)などをどんどん追加することで管理するようにしてます。しかし、いずれは破綻するでしょう。そのため複数カレンダーをマージするのは必須なのです。

そこで筆者が仕事で利用するのに開発し公式プラグインにアップしているプラグイン「Google Calendar List View」について公開された複数 Google カレンダーからデータを取得し、それをマージして一覧表示する機能を付与してみたいと思います。

本当は一日あれば、List View for Posts という、これまた筆者が仕事で利用するのに開発した公式プラグイン(固定、投稿、カスタム投稿を纏めてマージして一覧表示、さらにカテゴリーやタクソノミーによるカテゴリー表示もできる)について、RSSもマージしてやるかぁとおもっていたのですが、それはまた別の機会にすることにします。

どうやって実装する?


すでに1つのカレンダーからの一覧表示は完成しています。
そこに複数のカレンダーをいかに設定してもらうかがキーになります。
手軽にやるには、ショートコードにカレンダーIDを複数設定してもらうことですね。できれば Calendar APIもカレンダーごとに複数設定できればよしです。なぜなら、Calendar APIの一日のクエリが 100万クエリと制限(無料で利用できる範囲)されているためです。

[gc_list_view g_id="Google カレンダー ID"  g_api_key="Google Calendar API"]

が基本的なショートコードの形です。
これを複数設定できるようにするためには、次のようにするとよいかなと思います。

[gc_list_view g_id="Google カレンダー ID"  g_api_key="Google Calendar API" g_id_2="Google カレンダー ID 2"  g_api_key_2="Google Calendar API 2" ]

つまり、 g_id_任意  と g_api_key_任意 で名前がユニークならそれをもってGoogleカレンダーからのデータ取得を試みるっていう実装方法ですね。これなら苦労はしなさそうです。

新幹線から参戦!




12時過ぎに大枠では実装できました。
しかし台風が近づいているのでタイムリミット。WordSlack の #plugin に上記コメントを残して 会場を後にしました。

でもふと思いました。新幹線からでも参戦できるじゃん!

そして Twitter に参戦するぜ!ってコメントして、実際に参戦しました。

ネット遅すぎる・・・

と悶ながらも、
  1. プラグインのアップデート
  2. プラグインの翻訳(アップデートしてから20〜30分ぐらいで翻訳可能になる .. GlotPress に対応している場合)
  3. ドキュメント書き換え(日本語と英語)
  4. 本ブログの作成と公開
「4」以外は 15時30分の発表までに間に合ったぜぃという感じです。


で実際のスライドはこちら


そのうち SlideShareに移動するかも。とりあえず時間がなかったので、Google スライドのやつをそのまま公開しました。

なんとか公開までいけてよかったです。。。

2017年9月17日 @kimipooh

2017年9月16日土曜日

WordCamp Tokyo 2017 に参加して(一日目 セッションDAY) #wordcamp #wctokyo

今回の WordCamp Tokyo 2017 の会場は西新宿にあるベルサール新宿グランドコンファレンスセンターでした。
ホテルは少し高いですが近場がいいなぁと思って、ホテルローズガーデン新宿にしました。ちょうど期間限定の安いプランがあったので、それに乗っかりました。西新宿駅(メトロ)の1番出口から左手に少しいったところにあります。新しい別館ではなかったのは残念でしたが、部屋は小さいものの、夜も静かで快適に過ごせました。ただ、「Wi-Fi の暗号が WEP かい!?」「ベッド付近は届きにくいぞ〜」ということはありましたが、まぁ許容範囲です。しかし高いので、次回以降同じ会場なら遠くてもいいので、もう少し安いところにしようと思ったのでした。

前日入り



朝からでようと思うと辛い(一日のイベントならまだしも二日あるので)ので、前泊することに。夕方に、六本木にあるスヌーピーミュージアム東京ってところを見てきました。夕食は、知人がオススメしていた池袋にある美そ乃で焼肉を堪能しました。いろいろな部位を楽しめるということで、19部位を食べたのですが、とてもジューシーで美味しかったです!予算は5000円ぐらいを見ておくとよいです。確かに高いですが霜降り肉を含む焼肉をお腹いっぱい堪能するなら、リーズナブルだと思います。一人でぶらっと入っても大丈夫というのがいいですね! 


9月16日(セッションDAY)



朝から近場のジョナサンでモーニングセット!

WordCamp は東京、関西、京都の3つだけしかいってませんが、いずれも会場までの道順をストリートビューのような形で案内してくれるのは、超方向音痴な筆者にとってありがたいです!前日から何度か迷いましたよ! 西新宿駅からホテルローズガーデン新宿までいくのに、Google Map くんの現在位置がかなりずれていて、目の前にホテルがあったにも関わらず、通過して警察署付近で「あれ〜おかしいなぁ」とかいってました。思わず警察署の外にいた警察署の方に聞いてしまいそうになるのをぐっとこらえて探しましたとさ....





スポンサーブースで配っている粗品の質が高すぎる!!
モバイル充電器やTシャツまで配っているところがありましたよ!

YAT さんに久々にあってまずは一言、「他の人が壺セッションやってますよ!」でした。何?って人は「YAT 壺」で検索してみてね (^^;(本人の名誉のために一言、真に受けないでください、よく知る仲間達の冗談ツイートです)




ランチチケットは売り切れたらごめんという配布方法なので早速ゲット!

ネットが接続できないのが痛かった。WEB認証のようですが、それが通らない。おそらくコネクション数がオーバーしたのでしょう。仕方なしに手持ちの Wi-Fi を使ってみるも電波競合でおそすぎる〜。

開会挨拶




実行委員長からの挨拶。日本でこれまで開催された WordCamp は 8つ!
東京は横浜と合わせて10回目だそうな。

さて以下のセッションはいつもどおり、発表された内容、発言を筆者の理解の元、速記したものです。#や→ は筆者のコメントになります。そのため、筆者の理解がおかしくて発表者の意図しない内容になってしまうことがあるかもしれません。

2017年9月9日土曜日

【備忘録】WordPress の カスタムフィールドの日付で、日別アーカイブを生成するには

WordPress.org 日本語フォーラムで
という質問があり、実際に試して回答しました。
これについての情報が見当たらなかったので、ここで備忘録としてメモしておきます。どういう考えて修正してうまくいったのかも書き出しておきます。SQL文の勉強になるかもですよ! それに筆者も、またどこかで使えるかもしれませんので、残しておくのは役立ちます。

やりたいこと


記事のアーカイブを、各記事に設置した カスタムフィールド(date_field)に沿って、日別アーカイブ表示したいというもの

2017/09/02 (1)
2017/08/19 (2)
2017/07/02 (3)

とかそういう感じに出すってことです。
そして日付をクリックしたら、カスタムフィールド(date_field)の日付が一致したものの一覧がでるということですね。


がちょうど年月のアーカイブができるので、これに日をたせればできるんじゃない?ってことで実際にやってみました。

前提


管理ダッシュボード > 設定 > パーマリンク
で投稿に対して、日付(年月日)が付与されるようにしてください。



利用方法


Step 1. テーマの functions.php に下記のソースコードを追加


ソースコード:https://ideone.com/BavQDi

Step 2. 表示するコードを追加(例  index.php)


ここでは説明のために デフォルトテーマ「Twenty Seventeen」の index.php に書き込み、トップページの記事の一番上に表示するようにします。


下記のコードを図のように if ( have_posts() ) : の下に追加してみてください。

my_get_year_archives( array(
'date_field' => 'date_field',
) );




そうすればトップページに日付一覧が降順に表示されるはずです。

【WordPress】カスタムフィールドの日付でカスタム投稿の年月別アーカイブ(pronet)では、カスタムフィールド(date_field)は、YYYY/MM/DD (2017/07/02)を元にしていました。このあたりはいろいろ変更できます。
さて備忘録なので、実際にどういう変更をしたのかも説明しておきます。

変更点


変更1)カスタムフィールドの値から 年月だけでなく 日も取り出すSQL文に書き換える


$select = "SELECT SUBSTRING($field,1,4) AS `year`, SUBSTRING($field,6,2) AS `month`, SUBSTRING($field,9,2) AS `day`, count(p.ID) AS posts";

$query = "$select FROM $wpdb->posts AS p $join $where GROUP BY SUBSTRING($field,1,4), SUBSTRING($field,6,2), SUBSTRING($field,9,2) ORDER BY $field DESC $limit";


赤い部分の追加です。
YYYY/MM/DD 、1文字 = 1バイト(1バイト英数記号)と仮定すると、
  • 1,4 = 1文字目から4文字分(YYYY)
  • 6,2 = 6文字目から2文字分(MM)
ときたらもうわかりますよね。
  • 9,2 = 9文字目から2文字分(DD)
を付与すればよいということです。

※全角(日本語)のように 2017/08/19 とした場合に、SQLクエリの方でなんとかしたいなら、CATをつかうとよいようです。


変更2)HTMLコード出力に日データを追加


$url = add_query_arg( array( 'meta_key' => $date_field ), get_day_link( $arcresult->year, $arcresult->month, $arcresult->day) );

$text = sprintf( '%d', $arcresult->year ).'/'.sprintf( '%02d', $arcresult->month ).'/'.sprintf( '%02d', $arcresult->day );

->year, ->month, ->day の year, month, day については、変更1)の AS `year`、 AS `month`、AS `day` に紐付いています。

<li><a href='https://demo.dev/2017/09/02/?meta_key=date_field'>2017/09/02</a>&nbsp;(1)</li>
<li><a href='https://demo.dev/2017/08/30/?meta_key=date_field'>2017/08/30</a>&nbsp;(1)</li>
<li><a href='https://demo.dev/2017/07/02/?meta_key=date_field'>2017/07/02</a>&nbsp;(1)</li>

のようなコードが出力されます。

変更3)WordPress の検索クエリのカスタマイズに日を追加


下記の赤文字の部分が追加分です。
WordPress での投稿日付は、年 = year、 月 = monthnum、日 = day に保存されます。
ので下記のような追加になります。

function my_pre_get_posts( $query ) {
    if ( $query->is_day ) {
        $meta_query = array(
            array( 
                'key'     => $query->get( 'meta_key' ),
                'value'   => $query->get( 'year'     ).'/'.sprintf('%02d', $query->get( 'monthnum'     )).'/'.sprintf('%02d', $query->get( 'day'     )),
                'compare' => 'LIKE'
            ),
        );
        $query->set( 'meta_query' , $meta_query );
        $query->set( 'year'             , ''          ); 
        $query->set( 'monthnum'   , ''          );
        $query->set( 'day'   , ''          );
        $query->set( 'date'       , ''          );
        $query->set( 'meta_key'   , ''          );
        $query->set( 'post_type'  , 'post');
    }
}

2017.9.9 @kimipooh

2017年9月3日日曜日

「REST祭 - WordBench大阪&京都&長野@さくらインターネット大阪本社」に参加して #wordbench #wb_rest

今回は遠隔会議(Google Hangouts)を使った三拠点同時開催。
筆者は WordBench大阪(第67回)会場である、さくらインターネット大阪本社へ訪れました。



グランフロント大阪タワーAの35階から眺める景色はなかなかいい感じですね!

プログラム

個人的には「WordPress ログインにVoice Overな2段階認証をつけてみる」あたりに興味ありですが、そろそろ REST API についても詳しくなりたいなぁと思って参加しました。

以下、発表された内容を筆者なりの解釈をして速記したメモです。
筆者自体のコメントは # を付けます。

2017年9月1日金曜日

WordPress 公式プラグインに PHP 対応バージョンを表記できるように(でもまだ必須じゃない)


まだ単なる表記だけのようですが、そのうち必須になる流れなのかなと思います。
現状 PHP7 以降しか使えない三項演算子「??」が使いたくてウズウズしていたので、必須になったら気兼ねなく使えそうですね!




書き方


WordPress公式プラグインリポジトリが対応PHPバージョンの表記に対応(@高橋 文樹 氏)

などに詳しく説明されていますが、筆者自身への備忘録のためここでも説明しておきます。

readme.txt に「Required PHP: バージョン」を追加せよ!
ってことですね。実際には下記のような感じです。
このプラグインは PHP 5.3 以降(三項演算子 ?: 使っているので)が必須ですが、PHPのサポート状況を考えることとテスト環境が PHP 5.6.x と 7.0.x と 7.1.x なので、表記するなら PHP5.6 からかなぁと。




これが Required at least (WordPress のバージョン)のようにインストール時の必須項目になったら、三項演算子「??」をつかいまくってやる!!


と密かに思っているのでした。
ちょうど、 PHP カンファレンス 関西 2017 で三項演算子についてまともに話を聞いて、それから三項演算子ファンになってしまったのでした。ただ PHP 5.3や 5.6では ?? が使えないのですよね。

もし $hoge["foo"] が確実に存在するなら、
$hoge_foo = $hoge["foo"] ? $hoge["foo"] : "none";


$hoge_foo = $hoge["foo"] ?:  "none";

とかけるのだけど、存在しない場合があるなら未定義エラーになります。
ので、下記のように書かざるをえないわけですが、

$hoge_foo = isset($hoge["foo"]) ? $hoge["foo"] : "none";

PHP7から実装された ?? を使えば、

$hoge_foo = $hoge["foo"]) ?? "none";
とスマートになるわけですよね。

そんなわけで、「Required PHP: バージョン」が必須になる日が待ち遠しいのでした。

2017年9月1日 @kimipooh