品川にあるマイクロソフトさんの会場をお借りして、福井のカニをしゃぶり尽くすステキイベント『WordCrab Tokyo 2012〜あの素晴らしいカニをもう一度〜』を開催しました。コーディネートはむゆうさん、まぁさん、星野さんにおまかせだったのですが、セッションのトップバッターで「一番いいのを頼む」と今回は言われてないのですが言われた気になって、『新作スクープ!! WordPress 3.4』というタイトルでもってお話させていただいた……はずです。はい、これ書いている今、まだイベント前です(爆)

このエントリーは、そのときのスライドを用いながら、講演では地味すぎて紹介してもつまらないような細かい追加要素もちょこっと追加した Extended Version です。なお、タイトルは雑誌ファミ通の新作ゲーム記事的なところを狙ってつけてみました。それでは元気よくいってみましょう～！

恒例の自己紹介ですが、地味にいろいろ変えておりまして…まだレポートしてませんが、先日の Nexus 祭に乗じて Android を Galaxy Nexus に変えたり、PSP が Vita に変わったりしております。

最近の活動としては、まがりんとか星野さんとかタモツとかが書いた『速習Webデザイン&速習デザインシリーズ WordPress 3.x』のダメ出しとか校正とかをしてました。

WordPress 3.4

…とぼくのことは置いといて、WordPress 3.4 について少しずつ概要が見えてきたので、現時点で blessed になっている機能や改善項目をお話ししたいと思います。

なお、"※画面は開発中のため変更される場合があります"。

WordPress 3.4 は1月4日に開催された development chat から開発がスタートしています。

開発の舞台はこの chat と Trac というチケット管理システム。

» WordPress Trac 

Trac のロードマップには WordPress 3.4 の項目ができていて、400超えるチケットについて議論が交わされています。

» Roadmap – WordPress Trac

WordPress 3.4 のチケットを表示してみると、こんな感じ。今日お話するのも、すべてこの中にある項目になります。

今回コアチームは12のプロジェクトチームを結成したそうです。

ヘッダー関連、クエリ関連、XML-RPC、テーマプレビュー、マルチサイト、RPC バグハント、管理画面ブラウジング関連、エディター関連、Twenty Tweleve、i18n（internationalization）関連、favicon アップロード、タブレット対応の12です。

それぞれかっこいい名前がついているので、気になる方は wpdevel でご確認を。

» Version 3.4 Project Teams and Status « WordPress Development Updates 

テーマプレビュー

一つ目はテーマプレビューです。

…とその前にテーマの管理を選ぶとこのように利用できるテーマが並んでいますが、この画面にもわずかな変更があります。

従来はテーマの説明がデフォルトで表示されていたのですが、3.4 からはデフォルトでは非表示となりました。

テーマの説明を見たい場合は、「説明」のリンクをクリックすると表示されるようになります。

さて脱線しましたが、「プレビュー」を選択すると新しくなったプレビュー画面「テーマカスタマイゼーションフレーム」（…とチケットには書いてあります）を見ることができます。

このように、左のサイドバーにテーマをカスタマイズするためのメニュー、右カラムにテーマのプレビューが表示されます。

メニューには、テーマが対応している機能が並び、例に選んだ Twenty Twelve であればこの画面にて、タイトルの文字の色、背景色、メインメニュー、静的フロントページなどなどをカスタマイズすることができ、それはリアルタイムでプレビューに反映します。

最後に「保存」をクリックすると、テーマが適用されます。

テーマプレニューをまとめると、リアルタイムにプレビュー、リアルタイムにカスタマイズできる、どんどん増えるカスタムメニューもサイドバーに格納できる、ガンダルフっていうのはテーマプレビュー機能を担当しているチームの名前です。

Twenty Twelve

それでは次に、さきほど適用した Twenty Twelve について見てみましょう。

WordPress 3.4 からのデフォルトテーマになります。

これがトップページ。非常にミニマルです。また静的なフロントページを WordPress が自動的に選択する機能も入るようです。

シングル記事を表示してみました。必要最低限のデザインになっているので、カスタマイズはしやすいと思います。

そしてもちろん、Twenty Twelve もレスポンシブ・デザインに対応しています。

Twenty Twelve はいままでの、Twenty Ten、Twenty Eleven とは異なるアプローチを目指しているそうです。

ミニマルで、ブログはもちろん、CMS としても使ってもらえるよう、強く意識しているとのこと。

静的フロントページの自動選択と、レスポンシブ・デザインに対応しています。

管理画面ブラウジング

管理画面のブラウジングでも、いくつか変更点があります。

テーマのインストール画面は、次のページのテーマを見たい場合、1、2、3 という数字のページネーションが用意されていましたが、Ajax を利用して無限にスクロールできるようになりました。

そしてブラウジング関連ではもうひとつ。テーマに複数のスクリーンショットが掲載できるようになるようなんですが、現段階では未実装につき画面がありません(笑)

クエリ関連

ちょっと難しい話になりますが、プラグイン開発者やクエリをいじる方には動向を注目していただきたいのが、WP-Queryの変更になります。

WP-Query が投稿クエリを構築する際に (SELECT wp-posts.* でもって）wp-posts.* をこれまで選択していたのですが、これだと wp-posts テーブルが大きくなればなるほど、パフォーマンスに影響が出るようになっていました。

3.4 ではこれを、クエリに合致する ID のリストを選択するパートと、選択された ID に基づいて実際に投稿を選択するパートへと2つに分割することで、WP-Query のパフォーマンス改善を狙っています。

実際にパッチベースで64%のパフォーマンスが改善されたと報告されていたり、そのパッチを試したプラグイン開発者が「オレのプラグインは全部問題なく動いたぜー」と言っていたりしますが、プラグイン開発者の方はぜひお早めにチェックしてみることをオススメします。

i18n は internationalization の略で国際化、日本語チーム的に言うと日本語化を指します。WordPress の歴史は、各国語化の歴史でもあるのですが、いろいろな言語で使われるようになる中で、各言語特有の問題が出てきています。

各国の翻訳チームはいろいろと工夫と苦労を重ねてきましたが、3.4 でそうした各言語特有の事情をコアでもって吸収しようという取り組みがされています。

投稿欄の下に文字数がカウントされていますが、マルチバイトの文字を用いる言語を中心に、文字数のカウントが正しく動作しない言語がありました。もちろん日本語もです。

これを修正する、ということと、ロケール独自の調整をコアで持つようになります。そのひとつは、日本語版にも同梱している WP Multibyte Patch のようなプラグインもそうですし、たとえばフォントファミリー。

日本のサイトの多くはサンセリフ系のフォントを使って文章を表示することが多いですが、Twenty Eleven でもそうだったように欧米ではセリフ系のフォントもよく使われています。

日本語版ではサンセリフのフォントに設定する、といったことがこれでできるようになると思います。

WordPress 本体やテーマ・プラグインを日本語で使えるようにする言語リソースを mo ファイルというのですが、WordPress の機能が充実するにつれて、mo ファイルも巨大化するようになってきました。

マルチサイト機能を使っていない環境では、マルチサイト機能のための翻訳文字列は不要なものですから、ms-ja.mo という形で別個の mo ファイルが用意されていたのですが、今回同様のアプローチでもって mo ファイルを分割することでブログのフロントエンドに管理画面の翻訳文字列を読みこませないようになりました。

従来 ja.mo というファイルに管理画面の翻訳文字列も、フロントエンドでも使われる翻訳文字列も含まれていたのですが、3.4 からは管理画面でのみ使用される翻訳文字列は admin-ja.mo というファイルに入るようになりました。

001 Prime Strategy Translate Accelerator プラグインは作った本人が大丈夫と言っていたので大丈夫でしょう(笑)

その他

さらに…ということで

WordPress をサブディレクトリにインストール・配置をすると従来、マルチサイト機能が正常に動作しませんでしたが、動作するべきだ！というチケットが確約で立っていますので、きっと動作するようになるんでしょう。

そして、これは 3.3 から漏れたチケットだったと思うのですが、テーマインストーラとテーマディレクトリが子テーマをサポートすることになるようで、テーマインストーラから子テーマを探して直接インストールできるようになる…はずです！

管理画面の設定にはいくつか input のフォームに数字を入力する項目がありますが、これを HTML5 の input type=number に置き換えるようです。

実装されれば、この画面のように、マウスクリックで数字を変えられる UI になります。

one more thing...

One more thing... ってやりたかっただけなんですけど。WordPress にログインしていると画面上部に管理バー（アドミンバー）が表示されるようになっていますが…

こんなふうに書いて、管理バーを非表示にしている人、いません？ これからはこんなことしちゃダメダメ！('∇')

画面をスクロールさせていても

管理バーをクリックすると…

最上部まで戻ることが出来るようになっています。スマートフォン的な UI ですね。

リリーススケジュール

今のところ、3月14日よりベータテストを開始、4月4日にリリース候補版、18日にリリース予定となっています。

日本語版はその後もう少しお時間をいただく、という感じですね。そしてさらにさらに…

なんと 3.5 の予定も見えてきています。5月に（場合によっては4月に）開発を開始し、8月にリリースを予定しているとのこと。

今後もウォッチしていきたいと思います。ご期待ください！

© 2012 Odysseygate.com This Feed is for personal non-commercial use only. If you are not reading this material in your news aggregator, the site you are looking at is guilty of copyright infringement. Please contact odysseygate@gmail.com so we can take legal action immediately.

鼻からカフェモカ。

去る1月21日に福井市で開催された蟹の祭典 WordCrab Fukui 2012 に今年も参加してきました。毎年予想外の展開になるこのお祭り、今回も何が起こりますやらとにかくいってみましょう！

長いので目次です。お好きな所からお読みください！

1. 中央道疾走編
2. 一乗谷探訪編
3. WordCrab のおまけの勉強会編
4. いよいよ本番！ WordCrab 編
5. おみやげのカニをもとめて
6. 気比の松原編

中央道疾走編

人はそれを無謀だ、というかもしれない。しかし、我々は東京から福井へ、今年も車で向かった。そこに蟹があるからだ。

…というわけで、2台体制の昨年から少し学習して、今年は7人乗りの車をレンタカーしまして、浜マッチョ浜松町に集合。メンバーはまがりん、hibikiさん、星野さん、webnist さん、確認さん、そしてぼく。9時過ぎにはまがりん邸を出発したのですが、なんとまぁあいにくの天気で東京は雪。

しんしんと降っているという感じでしたが、八王子を超えたあたりからだんだんと雪が積もり始めました。

さてなぜ中央道なのか、というとトラックが少ないから。これに尽きます。なにしろこの日は金曜日。東名を通れば当然大量のトラックがいてイライラするべーというわけ。

車中ではもちろん WordPress の話！……ももちろんしましたが、恋バナで大盛り上がり。他にもノマドで個人事業主な方たちの仕事論も面白かったです。

諏訪湖でこの通り。もう完全に雪国突入です。ここで昼食を取りました。

寒くてももくもくタイム( ´ー｀)y-~~を取る webnist さんに感心。

味噌こんにゃくを頬張る確認さん。盛大に汁をこぼしてましたが、美味しかったそうです。

諏訪湖といえば、スタバの店員さんがかわいいということで一部の WPer の間では有名なのですが、残念ながらその子は不在。ざんねーん。

姥捨にて再び休憩。ここねー、ぼくのオススメ風景なんですよ。曇ってるけど、それでもステキでしょ？

新潟に住んでいた頃、よく岐阜県に帰る途中こうして止まっては、この風景に癒されていました。もちろん夜景もオススメなので、男子諸君は「君の為に用意した夜景だよ」とかカノジョにやるように。もちろん周りに他のカップルがいっぱいの可能性が高いけどね。

新井 PA まで来ると雪がこんなに。

…ちょっとまて、新井？と思ったあなた。正解です。実は岡谷ジャンクションで名古屋に向かわず、新潟周りを選んだんです。こっちのほうが空いているだろう、と思って。

新潟県に雪による災害救助法が出ていることをすっかり忘れてました(^^ゞ。すいません、すいません。

で、新井。妙高の山の中です。除雪はされていますが、雪の量はかなりやばいです。

道の駅までの通路がこんな感じ。2メートルは積もってます。

先に見えたのは Webnist さんでした(´∀｀)

こんなに積もってるなら雪質を確認せねば！

まず星野さんがダイブ！

さらに確認さんがダイブ。

※危険です！よく確認してからダイブしましょう！

そんなこんなで、福井についたのは19時過ぎ。去年よりは1時間以上早いですね。

なにしろ…。

福井市内にまったく雪がない…。去年がウソのようです。

※この一週間後には大雪になったそうです。

昨年おいしい料理を頂いたお店は満員となっていたため、ぐるぐると探しまわって猿の盃へ。どじょうの唐揚げやあん肝、安納芋をおいしくいただいていたら、森川さんや西川さんが登場してびっくり！お店の場所をつぶやいただけで、場所がわかっちゃうんですねぇ(笑)

ホテルに戻った後はまがりんのお部屋でもくもく部。確認さんが酔ってプラグイン談義で絡み、星野さんはまっさきにまがりんのベッドで撃沈してしましたとさ。

一乗谷探訪編

朝もやの福井市内です。3時まで騒いでたのに8時に起きてるんだから、旅行の魔力ってすごい！

…と思ったら、約束の時間通りにロビーにいたのはまがりんと星野さんだけでした（遠い目

みんな眠そうですが、なんとか全員集合！……と思いきや、確認さんは昨晩の深酒が祟って、ホテル待機で午前の予定キャンセル。ぼ、ぼくたちは別にお酒すすめてないんだからねっ！

というわけで午前中の目的地は一乗谷。天正元年に織田信長と朝倉義景の間で行なわれた戦国時代の合戦『一乗谷城の戦い』の舞台となった一乗谷城があった場所です。

朝もやただよう山を目指して、車を走らせました。福井駅から30分くらいでしょうか。

見えてきました。一乗谷。っていうか、半分位もやですけど。

一乗谷見学をご一緒することになった @show_web さんがピカチューと記念撮影。……をさらに撮影する星野さん。

ちなみに、見学にはまがりんの会社の土肥さんも合流しました。

このあたりまで来ると雪が結構積もっていました。

合戦で斬られた浪人（？）に扮する webnist さん。冷たくないの？

さらにそれを踏みつけるまがりん。靴は脱いで踏みつけるアタリが優しさ。

橋の欄干に鷺がとまっていました。でかい、さすがにビビる。

みんな Webnist フォーム。

上から攻撃をしかける土肥さん。おのれ。

朝もやの林はいかにもな雰囲気ですね。

遊んでないで散策、散策。

一乗谷朝倉氏遺跡の入り口です。

といってもまぁ、入り口くらいしか残ってなくて、ここに家があったよ、的なことが書いてあるくらいなのですが。

ここは通常の居としていた場所で、3kmほど歩いた山奥に山城があったようです。

どうしてこうなった…。

一乗谷朝倉氏遺跡はこのようにわりとあっさりな感じだったのですが、奥に一乗滝というのがあり、こちらもチェックしなければと、奥まで車を走らせたところ…

出ました。やっぱり雪。

去年の永平寺に続き、ぼくたちはまたもや雪中行軍することになったのでした。

今日は土肥さんがダイブ（転んだわけではありません）。

さて、それでは剣豪宮本武蔵対佐々木小次郎をご覧下さい。

見合って。

振りかぶった！

武蔵の胴が決まったー！

というわけで、いきなり佐々木さんを dis ってはじまったわけですが、ここ一乗滝は佐々木小次郎が秘剣『燕返し』を習得した場所でもあるそうです。

※佐々木小次郎の出自には謎が多く、そもそも福岡出身じゃねーのという説もあったり。

さて、それではお待ちかねの一乗滝です。どうぞー！

高低差はそれほどでもないですが、とても力強い流れと水量です。

誰ですか、こんなものをお供えしたのは。

土肥さんがネタキャラ化していてとても良いです。まがりんを超えるポテンシャルを秘めてる気がする。実にいい。

のんびり歩いてくる星野さん。

お昼が近づいてきたので、一乗滝を後にして、福井市街に戻りました。

WordCrab のおまけの勉強会編

WordCrab Fukui 2012の会場はこの AOSSA というビル。下層フロアに商業施設が、上層に公共施設が入っていて、駅の隣の好立地。ぼくらみたいに遠方から訪れた人にとっては助かりますね。

WordCrab Fukui 2012 の誘導サイン。「直接書かないようにお願いします」と釘を打たれているので印刷してはりつけたんですね！

こちらが WordCrab Fukui 2012 のおまけの勉強会の方の会場。あくまで主役は蟹。

組長と tai さんも到着。

ゆりこさんもお酒持参で到着。午前中は城下町を散策してきたそうな。そっちも見てみたかったなー。

AOSSA 6階から見た福井市の遠景。このビルよりも高いビルはないみたいなので、遠くの山まで見渡せますねー。天気がよければよかったんだけど。

こうして時間をつぶしていたら、いよいよおまけの勉強会のほうが開始になりました。

まずは南部さんの挨拶から。

トップバッターは森川さんの『恋する <3 WordPress - ぼくが WordPress を使う理由 』。WordPress コミュニティのこれまでを振り返り、WordPress の長所を紹介されていました。

そうですねー、確かに知り合いになるまではよそよそしかったし、質問すると親切に教えてくれたりして、今から考えると結構なツンデレでしたね(笑)

Webnist さん爆睡。コラコラ(笑)ｂ

時刻も4時を過ぎた頃になって確認さんがやっと勉強会に登場（※ホテルから会場までは歩いても10分くらいです）。一体彼は何をしに福井まで来たんだろう…って蟹ですね、わかりまｓ

神戸を捨てて東京に出てきた確認さんに組長が業務内容をレクチャー（ここで！？∑(￣□￣;)）

笑顔だとそうは見えないですが、もっと真剣に仕事の話を詰めておられました。気になる～。

コンタクトフォーム師弟ががっちり握手。

wokamoto さんが直近のプロジェクトについて熱く語る。やられた～という表情のまがりん。ちょっと見せてもらいましたが、これは本当に便利そう。発表が待たれる！

勉強会の方は『悩めるクリエイター・ユーザーのための大質問大会』へ。

質問に答えるだーす・まがりん。左手に注目！

いろいろな質問が出ていましたが、なんだか答えにくいものが多かったですねぇ。気持ちの持ちようでなんとでもなるんじゃないかなーと思ったり←いやまじで。

今回は特段話をする予定もなかったのですが、ただのほほんと勉強会を観覧して帰るのも申し訳ないなと（←いまさら）思ったので、飛び入りライトニングトークで日本語版作成チームとモバイル App 系の手が足りてないのでよろしこ！というお話をしてきました。

とくにスマートフォンは実機を持っていないとなかなかイメージが湧きませんので、端末をお持ちの方はぜひご協力を！

いよいよ本番！WordCrab 編

なんとまぁ驚いたことに WordCrab カニカニ懇親会の会場はお昼にイタリアンをいただいた同じ AOSSA の3階にあるナナイロというお店でした。確認不足です。

このお店、とてもおいしいタパス（パスタじゃないよ、小皿料理だよ）がたべられるんですけど、こんなおいしそうな前菜も今や時間稼ぎにしかなりません。ちがう、蟹だ、カニを持てい！（コラコラ）

というわけで乾杯！

待ってました、カニｷﾀ━━━━(ﾟ∀ﾟ)━━━━!!

このカニは地元でよく取れる水ガニだそうです。ブランド的には越前ガニに及ばずなんでしょうけど、カニフォークなんかなくても手で割いて食べられちゃう。身も締まってておいしいんです！

みんな写真撮りまくりです。

こちらはブランド勝ちの越前ガニ。やっぱり越前もうまーーーーーΨ(｀∇´)Ψーーーーーーい！

そんなわけで、おいしく食べました～～～('∇')～～～～～！

で、このおいしいカニをなんと東京でも食べられるステキな会が企画されているわけですよ。その名もWordCrab Tokyo 2012 〜あの素晴らしいカニをもう一度〜！

…と思ったらすでに一杯になっちゃってますねぇ。まぁおまけの勉強会のほうはまだ余裕があるぽいので、こちらもどうぞ！

抽選会では webnist さんがわぷータオルを当ててました。いいな～。

これにて WordCrab Fukui 2012 終了！ありがとう、ありがとう！また来年も来れるといいな～。

おみやげのカニをもとめて

妻と子を置いて福井に行く条件が、おみやげにカニを送れ、というものだったので、カニを求めて敦賀湾までやってきました。

どんより敦賀湾。

飲み過ぎ Webnist さん。

テントみたいな、要するに砂漠のバザーみたいな感じの建物が海沿いに建っていて、そこで蟹を調達しました。

そして合わせて自分用に最後の蟹＝つまりお昼ごはんをば。蟹ドーン（丼）です。うまい！

ここで買い物をすると金額に応じて抽選券をくれたので、土肥さんがガラガラを回すと見事に蟹3匹を当ててしましました。

東京まで蟹臭いのは…と蟹は宮さんのところへ（宮さんも蟹臭かろう…）

気比の松原編

最後は敦賀湾沿いの気比の松原に立ち寄り。

海岸とその向こうの山々に目がいってしまいますが、メインは松なんですよね…(笑)

反対側には火力発電所も。

松だねぇ。

このあと再び9時間かけて東京へ。疲れたけど、やっぱりまた行きたくなるステキな旅行でした。しばらく蟹はいいかな(´∀｀)

© 2012 Odysseygate.com This Feed is for personal non-commercial use only. If you are not reading this material in your news aggregator, the site you are looking at is guilty of copyright infringement. Please contact odysseygate@gmail.com so we can take legal action immediately.

鼻からカフェモカ。

みなさん、クリスマスプレゼントはもう開けてみましたか？ 実家には煙突もなく、靴下に入り切らないものばかり欲しがっていたのに、小学5年生までサンタさんを信じていたおでっせいです。こんにちは。

 今日は、12月25日。1日からはじまった WordPress Advent Calendar 2011 の最終日になります。何を書こうかとてもとても悩み、Evernote （ネタ帳）に書きためていたら、@rie05 さんや @Webourgeon_com さん、 @mypacecreator さんに先を越されてしまいまして（ぼくが書くよりもずっとステキな内容だったから、ま、いいけどね｡･ﾟ･(ﾉ∀`)･ﾟ･｡）、イヴ前日担当の星野さん（ @khoshino ）と談合して、最後はカスタマイズ TIPS ではなく、WordPress ユーザーライフを豊かにする内容で〆ようということになりました。

先日の WordCamp Tokyo で Nao さん（ @naokomc ）が WordPress は出会い系と言ったとか言わないとか（どっちや）。ぼくをはじめとする WordPress 6年生の間では、日本最初の WordPress 本のタイトルになぞらえて、「WordPress でつくる！最強の出会い系サイト」というネタをよく使っていたりするのですが、出会い系サイト的なものがどんどんシュリンクしていくのに対して、WordPress のコミュニティはどんどん広がっていってるように思います。それはつまり、きちんと出会えているからでしょう。

WordBench をはじめとする勉強会や集まりでは懇親会が付き物ですし、WordCamp Tokyo では懇親会が本番だと数多くの酔っぱらいが言うくらい、学びの時間だけでなく出会いや交流の時間も重要だということなのですが、でも懇親会とか交流会苦手なんだ、という声もよく耳にします。本を書いていらっしゃるような著名な方ですら講演した後の懇親会でボッチになることがあるそうです。もしかして悩んでいる人は多いのかも？

このエントリは人見知りのくせに、WordPress コミュニティで伴侶を見つけ、子供まで授かった僕が、「懇親会どうしたらいいのよ、営業でも人好きでもないのよ」ってなあなたにお送りする WordPress 懇親会攻略ライフハックです。

怪物を友人へと変えよう

人好きな人に言わせると懇親会のような場はまったく怖くないそうですが、むしろ苦手というあなた、なんとなく怖かったり不安だったりしませんか？

懇親会だけではありません。思い返してみると、学校に入学したとき、クラス替えがあったとき、就職したとき、部署を異動したとき、その時々のなんとなく怖い、なんとなく不安だ、という気持ちは懇親会のときの気持ちに通じるものがあったりしませんか？

これはつまり見ず知らずの他人が怖いということに他なりません。でも重要なのは、怖いのはあなただけじゃないってことです。（あまり難しいことを書くつもりはありませんが）心理学では他人が怪物に見えるとき、他人からもあなたのことが怪物に見えている、のだそうです。

では、怪物を友人に変えるにはどうすればよいのか。それは相手のことを知ることです。では、相手のことを手っ取り早く知るには？それは共通項を見つけること。一度共通の話題で話をしておくと、人間関係の障壁が（お互いに）ぐっと下がる、と言われています。幽霊の正体見たり枯れ尾花、ではありませんが、怪物と話してしまえば、共通点のある同じ人間だった、というわけです。

共通項はきっとある。同じユーザーだもの。　おでこ

WordPress に関する懇親会・交流会に参加しているのですから、少なくとも同じ WordPress ユーザー（のはず）。まずは、「なぜこの会に参加されたんですか？」とか「WordPress はどのように使われているんですか？」といった質問でジャブを打ってみます。

お客さんに納品してて…とか、会社のウェブサイトを WordPress で更新してて…とか、趣味のホームページを…などと返事が返ってくればシメたもの。そこから「わー、URL 教えてください！」とつながえていけば、かなり相手を知ることができるはず。

相手を観察せよ！

しっかし、困ったことに中にはたまたま告知を Twitter で見つけただけで…とか、WordPress はまだ使ったことがなくて…とか、ペットのジョゼフィーヌが行けというから…といった人もいたりします。いやいや、これは困る。WordPress の話ならとりあえずできたのに…。

だからといって「そうですか」と話を終わらせるのも気まずいもの。戦略を立てなおして、次の作戦発動。そう、人間観察です。 人間観察といっても、外見からその人の人となりを探るような高度なスキルは必要ありません。

あ、この人のケータイのストラップ、『アイルー』だなー、『モンハン』好きなのかなー、くらいで十分。相手の持ち物、服装、外見、すべてを駆使して自分との共通項を探します。意外と見つかるものだし、もらった名刺に書かれたことについて質問するよりずっと距離を深めることができます。

最後は人に頼る！

懇親会に友人や知り合いが参加しているなら、群れる…という手もあります。友人同志の女の子たちが固まっていることがよくありますが、一人だったら恥ずかしい。でも3人いれば、恥ずかしさも分け合える、というわけです。

でももっと良いのは、その友人を通じて誰か別の人を紹介してもらうこと。文字通り『友達の輪』を広げる。WordPress フォーラムで助けてもらったり、Twitter では話したことがあるけど、まだリアルでは対面したことがない人、きっといると思います。そういう人に出会えるのも、WordPress の交流の機会です。ぼくもよく友人に、「@○○さんってどなた？」と紹介してもらっています。

3人の新しい友人を作れ！

WordPress の創始者 Matt くんが WordCamp Tokyo 2009 で日本を訪れた際に、懇親会では（知り合いとばかり話をしていないで）新しい人3人と知り合いになるとよい、と言っていました。10人だとちょっと苦しいけど、3人ならがんばれるかも…という程よい難易度設定ですね（笑） WordCamp 以後、WordPress コミュニティの懇親会ではこの『3人ルール』が伝統（恒例？）になっています。

先にも述べたように WordPress のコミュニティはとてもとても大きくなりました。その中にはほんとうに様々な人がいて、同じ会社に勤めていた人と隣同士の席になったり、茨城まで写真を撮りに行く社外の友人が出来たり、福岡までモンハンしに行ったり、兼業農家の方からお米を分けて戴いたり、仕事でもないのに人様の会社に遊びに行ったり、大学の隣のクラスにいた（はずの）人と知り合ったり、伴侶となる人と出会ったりできるかも。ぼくのように。

WordPress のような機能をもつ CMS、WordPress よりも便利な CMS は今もあるかもしれないし、今後きっと出てくることでしょう。でも、他の CMS が一朝一夕に実装できない（真似できない）のは、このすばらしいコミュニティに他なりません。このコミュニティでの出会いを通して得られるものは WordPress の知識やテクニックだけではない、もっともっとかけがえなのないものだと思っています。ぜひ、"WordPress で出会い"ましょう。

これをもって WordPress Advent Calendar 最終日のエントリと代えさせて頂きます。週末はお近くの WordBench で！

© 2012 Odysseygate.com This Feed is for personal non-commercial use only. If you are not reading this material in your news aggregator, the site you are looking at is guilty of copyright infringement. Please contact odysseygate@gmail.com so we can take legal action immediately.

鼻からカフェモカ。

麹町にある KDDI ウェブコミュニケーションズさんの会場をお借りして、WordBench 東京勉強会を開催しました。コーディネートは星野さんや大曲さん、micc さんにおまかせだったのですが、セッションのトップバッターで「一番いいのを頼む」とのことだったので、『Twenty Eleven でレスポンシブサイトをつくろう、そうしよう』というタイトルでもってお話させていただきました。

このエントリーは、そのときのスライドを用いながら、セッションを再構成したものになります。直に動画も公開されると思いますので、あわせてご活動いただけたら幸いです。

というわけで自己紹介をしました。質問があったのでここで答えますが、実はサラリーマンのレベルは毎年1つずつあがっています。サラリーマン10年目なので今はレベル10、来年は11になる予定です。←非常にどうでもいい話。

で、言わずもがななのですが、8bitOdyssey.com というサイトでブログをやっており、このサイトのデザインがこの日お話ししたことを通じてできあがったものでした。

まったくもって私事ですが、この日の前日、息子が誕生しまして、パパになりました。写真は息子が、WordPress の "W" マーク風にしてくれたところを撮影してみたものです。

というわけで、『おやバカ』に転職してレベル1からがんばりたいと思います。

自己紹介はこのあたりにして、では行ってみましょう。

ウェブとデバイスの歴史を振り返る

少し時計の針を戻して、ウェブとデバイスの歴史を振り返ってみましょう。

1998年には、ブラウザは Internet Explorer と Netscape とありましたが、ウェブ…ホームページのほうが一般的な呼び名でしたが…を見るものといったらブラウザでした。「インターネット」というアイコンをクリックして見る、といっていた人もいましたね。

これが翌年、iモードサービスがはじまることで携帯電話というデバイスが登場します。ただ、まだこの年には携帯電話用のサイトといえば公式サイトが中心で、いわゆる勝手サイトというものはまだまだ少数でした。

これが2003年になると、各社バラバラの仕様に対して、専用の携帯サイトが作られるようになります。ブラウザのほうはというと、WordPress が登場したのがこの年になります。

2007年になると、ケータイに対して素晴らしい救世主が登場します。WordPress に Ktai Style プラグインをインストールしておけば、とりあえずなんとかなってしまう、という優れもの。

しかし翌年さらなる黒船がやってきます。スマートフォン、iPhone の登場です（注：日本ではじめて発売された年、としています）

翌年にはさらに、Android ケータイと BlackBerry が加わります。

さらに翌年、iPad と Galaxy Tab という2つのタブレットが登場し、スマートフォンカテゴリがさらに賑やかに。

そして、今年。Windows Phone が加わり、もうごちゃごちゃに。

つまり、手間が増えているということです。あきらめるわけにもいかないし、手間と時間は無限じゃないし…。

がんばってスマホ対応したらしたで、あなたのサイトこう思われてませんか？

Facebook とかね(笑)

今日のお話はブラウザーとスマートフォン、タブレットをまとめてなんとかしてみよう、というお話です。

本日のアジェンダ

何を話していくか整理しておくために、本日のアジェンダを用意しました。

この順番でお話ししていきたいと思います。

レスポンシブ・サイトとは？

ここで、Twenty Eleven を画面に表示して、ブラウザ幅をググっと縮めてブラウザにフィットする様子をお見せしました。これだけだとただのリキッドレイアウトですが、レスポンシブと言われる所以を以下でご説明。

ではレスポンシブ・ウェブデザインとは？

HTML と CSS は主に、HTML 5とCSS 3になります。PC サイトには PC サイト用の HTML と CSS、ケータイサイトにはケータイサイト用の HTML と CSS…ではなくて、PC サイトも、ケータイサイトも、ひとつのページに対してはひとつの HTML とCSS になります。

今後登場するデバイスが、HTML 5 と CSS 3 に対応していれば大丈夫。もちろん WordPress もです。

逆にデメリットも。

CSS 3 未対応のデバイスでは「難しい」。「できない」と書いてないのは、JavaScript をかましたりすればなんとかなるからなんですが。

そして、これはどの携帯電話会社にも言えることですが、スマートフォンが登場してから通信量は飛躍的に増えています。ご自宅や会社では光ファイバーや ADSL でそれこそ50メガ100メガの回線を独り占め、なんて方もいるかと思いますが、スマートフォンでは、多くても14メガとか7メガをみんなで共有するため、通信速度は遅くなりがちです。レスポンシブ・ウェブデザインはそんな回線の遅い（細い）スマートフォンに、320px の横幅があれば十分なデバイスに、PC 用の1000 px のような大きな画像を読みこませる、という手法になります。

そして、最後。自分で作るときっと気が狂う、ということです。この後にも出てきますが、長さの指定や条件分岐など作り込みには非常に気を使います。Twenty Eleven の開発スタッフたちも、涙なしには語れないと言っていました。

つまり、

レスポンシブ・ウェブデザインは自分で作るもんじゃない。インスパイアするものだ！と僕は思っています。

でも、それはあなたのサイトをレスポンシブ・ウェブデザインにするのが大変なのではありません。

そう、WordPressならね。そこで、Twenty Eleven の出番です。

Twenty Eleven

これは Twenty Eleven テーマを適用して、PC で表示した時。

こちらは、iPad で表示した時です。

Twenty Eleven は WordPress 3.2 からのデフォルトテーマ。WordPress 3.3 にももちろん同梱され、Beta 3 でも問題なく動作しています。

テーマ機能の見本市になっていて、テーマ作成者の方は参考にすると良い機能がたくさん盛り込まれています。このあたりは、7月の WordBench 東京勉強会でお話しした内容を公開していますので、ご参照ください。

そしてもちろん、レスポンシブ・ウェブデザインです。

どのように実現しているの？

ここからちょっとソースコードや細かい数値が出てきますが、そうした部分にはとらわれず、エッセンスをつかんでもらえればと思います。

  長さ・高さの指定は % あるいは em で指定しています。

これは、Twenty Eleven の style.css の68行目からを引用したものです。

この中に #page というボックスの指定があって、よくサイト全体を囲うボックスに wrapper とか container とか名前をつけると思いますが、それと同じ役割をしています。

ここでは、#page ボックスに上下 2em 左右オートのマージン、ブラウザ幅が 1000px 以上の時に、長さの最大値 1000px が指定されています。

#page ボックスの中の要素の長さ・高さはすべて、この #page を基準に決まります。

#page の中には #primary と #secondary というボックスがあって、それぞれブログの記事部分とサイドバーの役割になっています。

#primary には float: left が指定されているので左に、#secondary には float: right が指定されているので、右になっています。

#primary は長さ100%ですが、右側に26.4%のネガティブマージンが指定されているので、右側には 1000px の 26.4%、つまり 264px 分の空白ができます。この空間に、#secondary が入ります。

#secondary にも右側に 7.6%、つまり 76px のマージンがあり、長さは 18.8% = 188px という指定なので、右図のようになります。

これが、長さが決まる基本になります。

続いて、CSS 3 Media Queries。

CSS でも条件分岐できる、ということですが、JavaScript なんて要らない！ということでは（残念ながら）ありません。

非対応ブラウザは、JavaScript で対応します。

css3-mediaqueries-js - css3-mediaqueries.js: make CSS3 Media Queries work in all browsers (JavaScript library) - Google Project Hosting

上記は style.css の2240行目以降を（わかりやすく）抜粋したものです。

これが通常適用される CSS。

これがブラウザ幅が 800px 以下の時に適用される CSS。実際には、@media (max-width: 800px) 以下で指定を上書きすることになりますので、ここの指定が優先されます。

最後に、こちらがスクリーン型の媒体でかつデバイス幅が 320px 以上 480px 未満の時に適用される指定になります。これは主に、iPhone や Android などのスマートフォンに対して適用されます。

では、どのように上書きされるのか、ブラウザの幅が 1000px 以上あるときと、800px 以下のときとを比較して説明します。

ブラウザ幅が 1000px 以上の時、#primary の中には、#content というボックスがあり、長さは58.4% = 584px、右に34%=340px・左に7.6%=76pxのマージンがあります。

ブラウザ幅が800px以下のとき（※未満となっていますが、以下と訂正いたします）、#content ボックスの長さは自動となり、右のマージンが34%から7.6%へと上書きされています。

#secondary ボックスは float: right から float: none となり、#content の真下に来るようになり、左にも 7.6%のマージンができるようになり、上述のようになります。

このようにしてサイドバーの位置を変えるようにあらかじめ指定してあるのです。

最後に画像もフレキシブルに。

このように、画像に対して親要素の97.5%になるような指定がされています。

さきほども説明した通り、親要素の #content ボックスはブラウザの幅に合わせて拡縮するので、画像もそれに沿って大きさが変わります。

ウェブサイトを作り始めた頃、大きなサイズの画像を用意して HTML や CSS の指定で縮めたりしないように言われたことがあるかもしれませんが、レスポンシブ・ウェブデザインではそういったことをあえてやっている、ということです。

子テーマのつくり方をおさらい

では、ここまでの内容を踏まえて、自分のサイトを Twenty Eleven を使ってレスポンシブにしてみましょう。既存のテーマを使ってサイトをつくるときには、子テーマの利用をお勧めしています。

実はぼく、自称子テーマのエヴァンジェリストでして、ここでお伝えする内容は、2010年の WordCamp Fukuoka でもお話しした内容の抜粋版になります。

親テーマの良いところはそのまま、変更したいところだけ変更できる、というのが子テーマのメリットです。

現行の WordPress では本体も、テーマもプラグインも、更新というボタンを押すと、最新のファイルになりますよね。あれはとても便利ですが、本体・テーマ・プラグイン、いずれにおいてもそれに加えた改変もクリアされてしまいます。

ところが、子テーマを作って子テーマをカスタマイズしておけば、親テーマに更新があっても、親テーマだけが最新のファイルとなり、子テーマはそのまま残すことができます。

さて、子テーマのつくり方です。超濃縮版でお届けします。

まずは、親テーマと同じ階層に子テーマのディレクトリを作成します。

今回は Twenty Eleven を使うので、そこに子テーマのディレクトリを、その中に子テーマの style.css となるファイルを作成します。

次に子テーマの style.css の先頭のコメント部分に、「Theme Name: なんたら子テーマ」と、「Template: かんたら親テーマ名」を記載します。

これで、WordPress はこのテーマを子テーマとして認識してくれます。

で、子テーマとしてカスタマイズしていくには、style.css でスタイルを指定していきます。親テーマの style.css をあらかじめインポートしておいて、それを上書きする形で仕上げていくのが一般的。

@import だとスピードが…と気にしちゃうビンカンなあなたは、子テーマの header.php を用意して、head タグの中で link 要素に style.css を指定するよろし。

では、テンプレートファイル、たとえば header.php を変更したい場合はどうするか。

親テーマから header.php をコピーしてきて、子テーマのディレクトリに配置しましょう。これで header.php を好きなように変更すれば、親テーマのではなく、子テーマの header.php が読み込まれるようになります。

子テーマカスタマイズのコツ

皆さんテーマ作成というと、スクラッチからテーマを作成したり、親テーマそのものを改変することが多いからか、子テーマでの作成をおすすめすると難しいとか勘所が分からない、という声をもらいます。そこで、ここからは僕が子テーマをカスタマイズする際に気をつけていることをお話しします。

一つ目は親テーマと目指すべきデザインを見比べて、どう変更したら近づけられるかを考える、ということ。

両者を見比べて、header の横幅を変えれば対応できそうだ、とかコメント数の背景を吹き出しの画像に変えれば…といったように、どのようにスタイルを書くか、という考えから、どのように変更するか（さらに言えば、どのようにすれば一番最小限の工数で実現できるか）という発想へと転換して、進めるようにすると良いと思います。

2つ目はワイヤーフレームを書いて、狙い所を確認するということ。1からテーマを作る際にもワイヤーフレームを書くことが多いかと思いますが、親テーマが他人のつくったものであるなら、なおさらワイヤーフレームを書いたほうがよいと思います。

といっても面倒でしょうから、Twenty Eleven に関してはワイヤーフレームを書いて見ました。

3つ目はすでになさっている方も多いかと思いますが、スタイルの現状把握をするときは style.css だけでなく開発ツールを使ったほうがよいと思います。

Chrome ですとデベロッパーツールがプリインストールされていますし、Firefox であれば Firebug などの拡張機能ですね。

このように、要素を指定するとその要素に対するマージンがオレンジ、パディングがグリーンで表示されます。構造が把握しやすくなりますし、実際の値は右下のところでプロパティを確認することができます。

そして、この Twenty Eleven もそうですが、HTML 5 のテーマを扱う場合には次のことも気をつけておくとよいかもしれません。

これはつまり、こういうことです。

タグではなくて、ID や クラスを駆使する。

これはなぜかというと、消滅して、復活した <time>要素というニュースが先日もありました。

HTML 5 のタグも仕様も変わる可能性がある、またテーマも開発を重ね変わる可能性があるからです。

また、Twenty Eleven についてはファイルが多すぎてよくわからない、どれが何の役割なのかわからない、という声もありました。

そこで、先日 Twenty Eleven のファイルを分類してみました。

8bitOdyssey を作るにあたって僕が変更したこと

最後に、実際に僕が変更したことです。もちろん、背景画像を指定したりロゴを書いたりといったことはしたのですが、レスポンシブ・デザインに関わる所としては、これだけです。

左が Twenty Eleven をそのまま引き継いだ場合。右が理想の形です。左のままでもなかなかですが、細かく見るとロゴが右端で切れてしまっていたり、検索フォームがメニューの文字にかかってしまっていたり。

これは直したい。

というわけで、このように指定しました。

iPhone で表示。うまくいっています。

iPad で縦表示。

iPad で横表示。

One more thing...

さきほどお見せした iPhone の画像では adsense の広告がモバイル版になっていました。パソコンや iPad では 468px の広告になっています。

もし iPhone で 468px の広告が表示されてしまったら、当然その画像に引きづられて、レスポンシブどころか不恰好なデザインになってしまいます。これはなんとかしたい。

このように $is_iphone という関数が用意されているので、これを使うことでモバイル用の adsense コードと、通常の adsense コードとを条件分岐することができます。

これはモテる！

というわけで以上。

ご清聴ありがとうございました。

公開しました！全部まとめてみたいよーっていう方は以下の SlideShare をご活用ください。

[slideshare id=10333988&doc=20111126wordbenchtokyo-111126010702-phpapp01]

© 2012 Odysseygate.com This Feed is for personal non-commercial use only. If you are not reading this material in your news aggregator, the site you are looking at is guilty of copyright infringement. Please contact odysseygate@gmail.com so we can take legal action immediately.

鼻からカフェモカ。

８月27日～２８日と、WordBench Nagoya 主催のイベント "WordBeach Nagoya 2011" が開催されたので参加してきました。開催スタッフの情報連絡用 Cybozulive にも誘っていただいていたのですが、当日朝に「一日を楽しむ！」というタスクを作ったくらいのサボりっぷりで、好き勝手に写真を撮りつつ、大半は Katz さんの Ustream スタジオ放送に出演するという半ゲスト半スタッフという感じで楽しく過ごさせてもらいました。そんな僕目線で WordBeach レポートをお届けします。

WordBeach の会場は愛知県知多市にある新舞子 まなビレッジ南浜荘。結構遠いなー、と思っていたら南知多よりも全然北でした(; ･`ω･´)

こちらは今晩 Pillow Fight (=まくら投げ)の会場になる予定だった宿泊施設です。

ぼくらも含めて東京からも続々と参戦。こちらはプライムストラテジーさんの WordPress が大好キーズ。

小野委員長のかけ声とともに、スタッフ一同、設営準備に向かいます。

Ust 準備中の mikage さん。

セッション準備の Nao さんと yuriko さん。

設営準備中の受付。

今回のために、ノボリも作られたそう。さすが東海共同印刷さん！（でいいのかな）

よーく見ると、実は WordBeach ではなく、WordBench になってます。汎用性、大事( ･`ω･´)b

心地よい海風にふかれてノボリの字が見えなくなっちゃうので、webnist さんにおさえてもらいました。ちょっと幕末風（笑）

たぶん kz さんデザインのエロかっこいいフライヤー。受付に貼ってありました。

今回はセミナー部分は入場無料で、懇親会、宿泊のみ実費、となっていたので、お金のやり取りがない分、楽に見えました。…そうすると、フライヤーの金額もいらないのか…(; ･`ω･´)？ まぁまぁ、見た目は大事です。

とはいいつつも、きちんと来場者のアカウントを確認してチェックを されてたので、受付には行列が。気分が高まりますねー。ぼくもちゃんとゲストの皆さんと一緒に並んで受付してもらったら、スタッフ用のリストに紛れてて意味ナッシング。すいません、すいません…。

こちらは初級者向けの教室。

こちらは中上級者向けの教室。そう、こちらには初級者向け教室にあった暗幕がなく、スライドを写すと逆光に(; ･`ω･´) スピーカーがスライドをウェブにアップして閲覧してもらうなど、見事な連携プレーでカバーをしていました。

続いてスポンサーブースへ。

Microsoft の武田さんです。WebMatrix マンを東京から持ってきたんですか⁉ すごい!!

こちらはプライム・ストラテジーブース。WordPress が大好きです、はスクリーンセーバーにもなってるらしいです。

WordBeach 開幕

いやいよ、小野委員長の挨拶でイベントスタートです。

初級者教室は Nao さんの「WordPress のよくある疑問と誤解を解決します！」からスタート。WordPress 事情には結構詳しいつもりのぼくですが、Nao さんのスピーチには毎回知らないことがあるので、見逃せ…いやいや、聞き逃せません。

皆さん真剣な眼差しで耳を傾けてます。

こちらは小野委員長によるデスマワークショップ。武田さんがサポート。かなり濃い内容で、参加者に熱い絆が生まれた模様です。

hokori さんによる、「WordPress 3.2の新機能＆新デフォルトテーマ Twenty Eleven 大解剖！」。ぼくのブログ記事をいっぱい参考文献にあげていただいているので、ぜひスライドを見てみるといいよ！

Katz さんのスタジオ放送では、@Rie05 さんと @hissyNC さんが WordCamp Kobe を宣伝。ほんとにピンクだ～と心のなかで思っていたことは言うまでもありません。

プライム・ストラテジーのシャッチョさんにして、我らが漆黒の黄色い弾丸ことダース・マーガリンの上司、中村けん牛さんの「日本語環境における WordPress の高速化」。とても興味深い内容なのでぜひスライドを見ていただきたいのですが、重要なのはどういう方法でもって高速化しているか、ではなくて、それぞれ効果が出るかどうかきちんと判断をしている、という点です。すべてのサーバーでこの結果になるわけではありません。ココ大事( ･`ω･´)b！

このセッションを聞いて、ぼくもこのブログのサーバに APC と 001 Prime Strategy Translate Accelerator を入れてみたよ～！かなり高速になってるはず。

あと、けん牛社長は30年来のマイコン少年だそうなので、きっとべーしっ君読んでたに違いない。

yuriko さんの「セキュアな WordPress プラグインの作り方」。このセッションの中で屋号や wp- をプラグイン名につけないほうがいい、的なことをおっしゃられてたらしいのですが、僕はこの写真を撮ってすぐに Katz さんの Ustream スタジオ放送に呼ばれてしまったので、すいません、まったく聞けてません。

photo credit: lilyfan

photo dropper はもう少しましな UI というか、せめて URL を指定できるようにならんかー！と思いながら yuriko さんの写真を借用！yuriko さん、ありがとう！

Ustream スタジオ放送はこんな感じで、Nao さん、まがりん、webnist さんと出演しました。WordPress ME 時代の話をはじめ、かなり WordPress 黎明期の話が出てきましたね。Nao さんが自動車会社で派遣さんをしてたというのも衝撃の事実！ｗ

Katz さんに「なんでおでさん、そこまで WordPress のことやってんの？」と鋭く切りこまれましたが、なんででしょうね。自分でもよくわかりませんし、放送中では「こうして旅行しておいしいもの食べれるし…」などと答えていますが、レーゾンデートルがそのひとつでしょうね。やっぱり必要としてもらえるというのはうれしいものですよ。

こちらは南浜荘で割り当てていただいたお部屋。お腹が大きくなってきて、疲れていたてぃあ子を安心して休めることが出来ました。会場スタッフの皆様、ありがとうございました。

Ustream 放送はさらにさらに続きます。

石川さんの「カスタム投稿タイプ・カスタム分類・カスタムフィールドを 活用したサイト構築例」。初級者教室でここまでやるかぁという感じ（いい意味でね）。Ustream のアーカイブ聞かなくちゃ！

これでセッションが終了し（結局、Ustream スタジオにいたので、当日ほとんどセッションは聞けませんでした）、ライトニングトークへと移行します。

ライトニングトーク

プライム・ストラテジー土肥さんによる「企業向け CMS のカスタムフィールドテンプレート活用法」。ぼくはわりとガリガリ記事書いちゃう人なので、カスタムフィールドはほとんど使っていないんですけど、この発表を聞いてると使おうかなーと思っちゃいました。

そんな部下の働きに大曲マネージャーもご満悦の様子。

浅井さんによる Cybozulive のご紹介。グループウェアっていくつか使ったことあるんですけど、Cybozulive は結構使いやすいですね。メンバー制限はあるものの無料で使えるということもありがたいところ。

ちなみにぼくの Gmail はこの時期名古屋スタッフから届く Cybozulive の更新通知ですべて埋まっていました……。

Microsoft 武田さんによる WebMatrix のご紹介。WordPress も含めてローカル環境というと XAMPP や MAPP を使うことが多いと思いますが、WebMatrix もかなりいいですよ。

ぼくが一番気に入ってるのは、データベースを書き換えるのがとても容易な点。MySQL コマンドなんて知らんよ、とか phpmyadmin だとどこを押せばよいのか…なんて人でも Excel ライクな画面で書き換えたいところをクリックするだけ、というのはとても良いです。

星野さんによる WordPress と WebAPI 連携。これもいいなーって思うのですが、API で外部サイトからデータを引っ張ると何かと重くなりがちなのが悩みどころ。

ところで、今回の星野さん、とても淀みなくプレゼンしてましたが、もしかしてばっちり練習しました？ｗ

webnist さんによるめ組テーマ「大名行列」秘伝の書の紹介プレゼン。セッション全般で宣伝禁止（？）だったらしく、秘伝の書の値段をまるごと消している上、全編「ん！」によるしゃべらないプレゼンスタイルだったので、どこまで伝わったかわかりませんが、このテーマもすごいですよ。

ぼくも「大名行列」の子テーマを作る予定です。予定は未定ですが。特にリリース時期。

さてさて、WordBeach セッションは大団円にて終了。

確認さんこと@horike37さんによる 「WordCamp 神戸のお知らせ」。webnist さんの後だったので、「ん！」という出だしの演出がニクい（笑）

神戸はぼくもいきますよ！行かれる方いましたら、現地で会いましょう！

窓から空を見上げるととても美しい夕暮れになっていました。

懇親会

懇親会模様。シェフは８０人分の料理をお一人で作られたそうです。普段は50人分が限度だそうで、80人と聞いてシェフの顔がひきつっていたそうですが…(; ･`ω･´)

魚の活き造りです。写りたそうにしていた人たちがいっぱいいたので、背景でボケてもらいました(^m^)

石川さんの挨拶。

かんぱ〜い！

名古屋恒例のビンゴ大会。今年も全然あたりが出ませんでした。

昨年は堂々の早上がりで WordPress マグをもらったわけですが、今回は全然数字があいませんでした。それでもなんとかアタリ枠に入ることはでき、例のノボリ（ミニサイズ）をゲット(σ・∀・)σｹﾞｯﾂ!! モニタの横にかざろうっと。

Pillow Fight …？

お風呂に入った後は Pillow Fight …こと枕投げ…なのかと思っていたのですが、Nao さんは眠かったようで早々に寝てしまい、名古屋スタッフの方の多くは Katz さんの Ust へ。そして、遠方から来たメンバーノ多くは、一つの部屋に集まって即席もくもく部へ突入です。

photo credit: lilyfan

それぞれまったく別の作業をしたり、分からないところを聞いたり教えたり、人の作業を興味深く眺めたりと思い思いの時間を過ごしました。これぞ関東が誇るもくもく部です。名古屋や神戸の人にも紹介できてよかった！（…とひとり満足）

僕はというと、上述した 001 Prime Strategy Translate Accelerator の英語になんとなく違和感があったので、翻訳作業を開始。

yorozu さんと二人で頭をひねっていたのですが、どうにもいい表現が出てこず、たまたまやってきたスロバキア人のミカルさんを巻き込み、なんとか英語らしい po ファイルを勝手に完成させて、まがりんに送りつけました。まがりーん、あれプラグインに反映してね～( ･`ω･´)v

yorozu さん、ミカルさん、ありがとうございました。

…午前3時で力尽きて、ぼくはお部屋へ。入れ替わりで Nao さんが奇跡の復活。

…

そしてねぼすけの割りには7時に目が覚め、外を見ると何やら見たことのある人たち(=もくもく部メンバー)が歩いている。行かねば…！

WordBeach を目指して

聞くと、WordBeach というイベントなのに、まだ海岸に行ってないじゃないか、とみんなで海岸を目指すらしい。海岸はどこだ。

海岸はどこだ。まがりんはしゃぎ過ぎ。

しかし　海岸は見つからなかった……。お疲れのみんな。

First Element 宮澤さんのインテグラで、朝食の買い出し。その後、近くの海岸へ。

海岸到着！WordBeach だー！

はしゃぐ、Wボーイズ（WordPress の W マークを作ってるつもりです）

これにて WordBeach 終了です。おつかれさまでした。

photo credit: lilyfan

WordPress は元気もパブリッシュしてくれる

こんな感じでいっぱい疲れましたが、充実感と元気でいっぱいです。

そう、WordPress は投稿やページをパブリッシュして届けてくれるだけじゃないんだよ。元気もパブリッシュしてくれるんです。

参加しようかどうしようか迷ってる人、ブロガー仲間が欲しい人、仕事に疲れた人はぜひ WordBench に参加するといいよ！

ここでご紹介しきれなかったたくさんの写真はこちらからどうぞ→WordBeach - a set on Flickr

© 2012 Odysseygate.com This Feed is for personal non-commercial use only. If you are not reading this material in your news aggregator, the site you are looking at is guilty of copyright infringement. Please contact odysseygate@gmail.com so we can take legal action immediately.

鼻からカフェモカ。

去る7月30日、品川にあるマイクロソフトさんのセミナールームにて WordBench 東京勉強会 & WordPress 3.2 リリースパーティを開催しました。勉強会から100人以上の人が集まる盛況ぶりで、忙しい中勉強会資料を作ったかいがありました。簡単ではありますが、当日の模様をレポートしたいと思います。

WordBench 東京勉強会への道（準備編）

勉強会への道と言いながら、実は勉強会の午前中は WeeklyCMS の放送がありまして、当日10時眠い目をこすりながらマイクロソフトさんのエントランスに集合しました。

実はリリースパーティや二次会含め、スタッフも手弁当のため、受付を済ませました（勉強会のお金でウハウハとかじゃ全然ないのよ）。

マイクロソフトさんにお邪魔するのは2回目になりますが、このセミナールームははじめて。ほんとに会議室すてきですねぇ。うちの会社とは大違いだわ。スタッフ席の最前列に荷物を置いて、準備開始です。

じゅｎ……もとい、WordPress の日本公式キャラクター（名前はただいま投票中）のステッカーです。世界ではじめて Android にはった人の称号をいただきました（笑）。

マイクロソフトさんの WebMatrix ウェットティッシュも。 ところで、WebMatrix と Web Platform Installer ってどこが違うんだろう。教えて、武田さん！←当日聞き忘れた

そんなこんなで、WeeklyCMS 放送開始。 写真は Nao さんによる「WordPress アップグレードについて知っておくこと」。

とても良い内容で、勉強会本編でやっていただいてよかったんじゃないかというくらい（実は当日まで Nao さんがこのプレゼンを用意されていたのを知らなくてですね…ｗ）。内容が気になる方はアーカイブを見てみてくださいね。

かくいう僕も、WordPress 3.2 へのアップグレードの際に失敗しまして。WordPress のアップグレードは Subversion を使って、Automattic のサーバから最新のコアファイルをチェックアウトしているのですが、何が悪かったのか WordPress の動作はおかしいし、wp-content は違う階層に行っちゃうしとおかしなことに。 wp-content はもとに戻し、自分で作った WordPress 3.2 日本語版を FTP でアップロードし、事無きを得ていたのでした(_ _;) Nao さんの資料を読みこめばみんな安心できますよってことで！

放送の中で、WordPress 日本語版作成チームに関する質問も出ていたので、少しコメントさせていただきましたが、改めて。日本語版作成チームに必要なのは英語力だけではありません。WordPress の挙動を理解するためのプログラムの知識だけでもありません。 一番大事なのはやはり、日本語力だと思っています。

WordPress を使う人はもはやコンピューターに詳しい人ばかりではありませんから、なるべく多くの人にわかりやすいものにしたいと思いますし、より自然な日本語にしたいものです。そんなときに必要になるのが日本語力なのです。

Twenty Eleven の機能の一つ「短冊ウィジェット」も日本語版作成チームが「Ephemera（カゲロウの意）」を翻訳したもので、成果の一つだと思っています。まだまだわかりにくい部分やしっくりきていない訳語などありますから、日本語版作成チームは新たな仲間を募集しています！

接続確認中のえりさん。

笑顔ですが、プロジェクターにはプレゼンテーションを映し、Mac のディスプレイには原稿を映すという設定に非常に苦労されてました（笑）

プロジェクターだけ見ると普通ですが、今回のぼくのプレゼン、結構工夫して作ってますので、後ほど詳しくまとめてみますね。

WordBench 勉強会

僕の担当分は WordPress 3.2 の新機能と、Twenty Eleven のコードについて話してほしいということでしたので、「Hello WordPress 3.2 and Twenty Eleven」と題してお話させていただきました。

機材トラブルで音声がダメだったそうなので、アップしたスライド資料をご確認ください。 マイクロソフトさんのプロジェクターの性能が良すぎて、低解像度のスライドを作ってしまいましたので、当日より見やすいかと思います(_ _;)

3.2 の新機能や Twnety Eleven の魅力について、うまく伝わっていればよいのですが。 実は、このプレゼン、準備期間中は「気になるあの子のハートをゲットする Twenty Eleven で夏恋徹底攻略」というタイトルでした（マジで。

「WordPress が大好きです。」シャツのまがりん☆。わざわざ作ったらしい。この人マジやで。

えりさん & えり本のご紹介。かわいいは正義（違）

ぼくもわかんない！

えりさんのお話で興味深かったのは DreamWeaver のスニペットですね。調べてみると、説明まで含めて英語の WordPress スニペットは結構あるみたいですが、日本語のものは見当たりませんでした。基本コピペでプログラム書いてるぼくみたいな人間にはとても便利そうです。

休憩中のセミナールームをパシャリ。Mac 率高い…。 このあとは安定の星野さん、この日はかみまくりのまがりん☆とプレゼンが続きました。

写真はえり本、Toru本をめぐるじゃんけん大会。かなり盛り上がりましたね。

WordPress 3.2 リリースパーティ

続いて、WordPress 3.2 リリースパーティ。今回はケータリングと持ち寄りです。アラビアータ（だと思う）パスタが辛くておいしかったです。

glatyou さんが WordPress アイコンクッキーを作ってきてくださっていたので、さっそくかじるといったらこの人、杉本さんにモデルになってもらいました。

恒例（？）になってきたケーキ。今回はリリース記念、ということでじゅｎ…キャラクターが描かれています。3.2 のリリースリーダーを務めたということで、ケーキカットと取り分けまでさせていただきました。ケーキカットしてるところは誰かがアップする気がするので、そちらでお願いします（笑）

ケーキに群がる報道陣（違）

ケーキを切ったナイフ。アイルーの剣か！これで切れるわけないって！ｗ

リリースパーティのあとはプロントを貸しきって2次会。23時までがっつり楽しませていただきました。

たまたま 3.2 のリリースリーダーを務めたわけですが、このようなリリースパーティは日本語版としてははじめてのこと。ありがたかったです。100人規模というと、日本初の WordCamp Tokyo 2008 よりも多いんですよ。思えば遠くへ来たもんだ、って感じですが、普段はオンラインでのやり取りが多い日本語版作成チームとしてもこういった機会で顔を合わせられるのもよかったです。またやりたいですね。

最後に、今回の MVP のうえつんと西川さん、裏方に徹して色々手配をいただいたゆりこさん、快く会場を貸してくださった武田さん、ありがとうございました。おつかれさまでした！

すべての写真はこちらから：WordPress-3.2-Release-Party - a set on Flickr ライセンスは CC by SA にしていますので、Odysseygate.com と明示していただければ適当に使ってくださってかまいません。

© 2012 Odysseygate.com This Feed is for personal non-commercial use only. If you are not reading this material in your news aggregator, the site you are looking at is guilty of copyright infringement. Please contact odysseygate@gmail.com so we can take legal action immediately.

鼻からカフェモカ。

[slideshare id=8730862&doc=20110730wordbenchtokyo-110730020858-phpapp02]

WordBench 東京勉強会でお話ししたプレゼン資料をさっそくアップロードしました。 Ustream 放送でも中継されていたようなのですが、機材トラブルで音声が聞こえなかったようですし、なかなか画面の細かいところまでは見えないかと思いますので、こちらでスライドをご確認くださいな〜。

© 2012 Odysseygate.com This Feed is for personal non-commercial use only. If you are not reading this material in your news aggregator, the site you are looking at is guilty of copyright infringement. Please contact odysseygate@gmail.com so we can take legal action immediately.

鼻からカフェモカ。

またまただいぶ相当遅くなってしまいましたが、5月28日に収録放送された weeklycms （今回からアンダースコアなし！）に参加してきました。今回は収録場所が品川にあるマイクロソフトさんの日本本社ということで最先端の IT の香り（どちらかというと新社屋な香り）漂う会議室からお届けしていました。あわせて、Nao さん & WordPress のお誕生日のお祝いもレポートしたいと思います。

というわけで今日の本題は OpenID Connect と OAuth（おぅおーす、と読みます。おいーっすじゃないので念のため）でした。

OpenID は複数のサイトに複数のパスワードでログインすることはリスクが増すということで、ID があれば複数の OpenID 対応サイトを利用出来るようにしたというものですね。ひとつパスワードがバレたら全部使われるやんか、とか言い出すと宗教戦争が勃発するので言いませんが、あのオバマ政権も国の機関のサイトに民間の OpenID でログイン出来るようにすることを推進してるといいますから、まぁ大丈夫ということなんでしょう。

こちらが参加者模様。手前は Nao さんの後ろ姿。「Nao さん、カワユス」と代わりに言っておきます、ひろまささんがいないので。

うちの会社と同じシステムが導入されていたのでおもわず嬉しくなって写真を撮ってしまいました。これは、テレビ会議システムになります。「ｓｈｕｔｄｏｗｎ」と全角なのがマイクロソフトらしい…！

ちょうど Nao さんのお誕生日と WordPress の8周年記念の日が近かったということで、お祝いのケーキが用意されました。おめでとう、おめでとう！

8周年ということでロウソクも8本。Nao さんはｓ…うわまてなにをｓ

ケーキの箱がでか過ぎて冷蔵庫に入らなかったそうです（笑）ケーキはおいしくいただきました！！

© 2012 Odysseygate.com This Feed is for personal non-commercial use only. If you are not reading this material in your news aggregator, the site you are looking at is guilty of copyright infringement. Please contact odysseygate@gmail.com so we can take legal action immediately.

鼻からカフェモカ。

毎週土曜日11時から Ustream で放送されている「Weekly CMS」。いつもはまどろんでいたり、出かけていたりで Twitter で盛り上がっているのを見ていたのですが、 shokun さんがひがんでいたのでケータイ対応特集ということで、初参戦してきました！

というわけで、WordBench 的にいうと常連メンバーな感じですが、ゆりこさんと僕が初参加。Nao さんが持ってるのは白いバスタブです。

この日はブルームーンの酒井さんオフィスから放送。

WordBench 川崎ではおなじみのケータイタワーですが、今回はいつもより余分に積み上がっております！

どんな話題が展開されたかは Ust のほうを参照していただくとよいかと思いますが、ケータイ表示の歴史は1ページの容量と文字コード、絵文字の表示処理との戦いの歴史でもあり、ツワモノプログラマーたちの熱い議論が展開されました。

これは私見ですが、おそらく今年中に1,500万近いユーザがスマートフォンを手にすることになるでしょう。アクティブユーザの多くがスマートフォンのブラウザを通して見ることになるわけで、ケータイ（ガラケー）最適化は過渡期を迎えているのかなと思っています。

おいしいピザをいただいて、今日はおしまい！

帰り道にみかけたこの看板。「NIKON 光学通り」とな！

大井になった旧日本光学本社（現・ニコン大井製作所）に続いていたので、この名前がついているそうです。NIKON 使いとしては撮らずにいられませんでしたが、傍から見たらさぞかし変な人に見えたことでしょう…。

© 2012 Odysseygate.com This Feed is for personal non-commercial use only. If you are not reading this material in your news aggregator, the site you are looking at is guilty of copyright infringement. Please contact odysseygate@gmail.com so we can take legal action immediately.

鼻からカフェモカ。

4月29日にネスト赤羽で開催された WordBench 東京 もくもく部に参加してきました。午前中映画を見てからの遅れての参加でしたが、ぼくも含めて12名超がもくもくと勉強/作業。驚いたことにもくもく史上一番にぎやかでした。

地震だなんだといろいろあったので、考えてみるとこの日は久しぶりの WordBench でした。

この日の僕はというと、自宅とモバイル PC のローカル環境を同期できないかと一生懸命 MacBook Air の設定をしていました。このあたりはいずれ記事にしてみますね。

ほかにも自社サイトを構築する人、プラグイン／テーマ作成に勤しむ人、Twitter の壁紙を作る人などなどみなさん思い思いの作業をしていました。

この日はちょうど先週誕生日を迎えた webnist さんも参加することになっていたので、日頃のご愛顧の感謝も込めてうちら夫婦からプレゼントを用意してきたので、さっそくお渡ししました。

どうですか、「作務衣 webnist」。

事前に megane さんにサイズを聞いておいただけあって、ぴったり～！番傘とセットにしてくれれば完璧でしょう！

うしろに「め」って貼っておいてくださいｗ

© 2012 Odysseygate.com This Feed is for personal non-commercial use only. If you are not reading this material in your news aggregator, the site you are looking at is guilty of copyright infringement. Please contact odysseygate@gmail.com so we can take legal action immediately.

鼻からカフェモカ。