More Related Content
Viewers also liked
Viewers also liked (12)
More from タカシ キタジマ
More from タカシ キタジマ (8)
Habakiri advent calendar 2015 総まとめ！
- 1. WordBash Kyoto vol.1 Habakiri Advent Calendar 2015 総まとめ！
- 2. キタジマタカシ inc2734 フリーランス Web デザイナー / プログラマー モンキーレンチ - http://2inc.org WordBench 長崎 モデレーター
- 3. WordCamp Kansai 2015 実行委員、スピーカー WordPress で行う継続的インテグレーションのススメ WordCamp Tokyo 2015 スピーカー WP-CLIとWordPress公式ディレクトリを活用した 爆速サイト構築術 -インストールからデザイン、ページ作成までを10分で！-
- 4. Habakiri Advent Calendar とは • http://www.adventar.org/calendars/1227 • 公式ディレクトリ掲載テーマ「Habakiri」について 12/1∼12/25 まで皆で記事を書き続けるという無謀 な企画 • 書くたびに減り続けるいいねに悲しみながら、たくさ んの方にご参加いただき、25記事中11記事を僕が書 いたものの何とか完走！
- 5. Habakiri Advent Calendar で Habakiri のことはだいたい わかるので、
- 7. Habakiri を作った理由 12/1 私はなぜ Habakiri を作ろうと思ったのか http://habakiri.2inc.org/blog/2015/12/01/340/
- 8. Habakiri を作った理由 • 毎回1からフルスクラッチ → つくるのめんどくせ • 自作のスターターテーマをベースに制作 → 納品済みサイトにパッチ適用するのめんどくせ • _sなどの既存のスターターテーマをベースに制作 → 把握するのめんどくせ • 公式ディレクトリ掲載テーマの子テーマで制作 → アップデートの適用が超簡単やん！
- 10. Habakiri を公開してみて • 納品済みサイトへのアップデート適用が簡単 • テーマレビュワーにレビューしてもらえる • 公開されるまで時間がかかる（アップデートは最近早くなっ た） • Habakiri の仕事が入ってきた（ ったとは言ってない） • コードを見られるの恥ずかしい（テーマは直したくても後 方互換性を考えると直せない部分が多い）
- 12. Habakiri の設計思想 • 子テーマでの制作をストレス無く行えるようにしたい • ポピュラーなライブラリを含める → Boostrap、Slick、Font Awesome → どうせ使うなら初めから入っていたほうが効率的 • CSS をストレス無く書けるようにする → なるべく詳細度を低く → 直感的に上書きしやすいように
- 13. Habakiri の設計思想 • なるべくコードを書かなくてすむ工夫 → カスタマイザーでさまざまな設定 • テンプレートをなるべく上書きしないですむ設計 → 大量のアクションフック → テンプレートをなるべく細かく分割 • 叩かれているものも「どういう考えで作ったのか」というとこ ろを見聞きすると結構ちゃんと理由があったりするので、開発 者の方はどんどん出して欲しいです（僕が喜びます）
- 15. 子テーマ問題 • 子テーマ機能はすごく良い仕組みだけど、親テーマが後 方互換性が無いアップデートを行った場合は問題がでる ことがある。 • だから子テーマにさえしておけば絶対に安心ということ は無い。 • Habakiri も過去にやらかしてます…
- 16. カスタマイザー 12/5 カスタマイザーで設定するのがめんどくさい？ Habakiri ならコードで設定できます http://habakiri.2inc.org/blog/2015/12/05/382/ 12/6 Theme Customization API をそのまま使うと冗長で辛 くなってきたのでもっと楽できるクラスを作った話 http://habakiri.2inc.org/blog/2015/12/06/386/
- 17. カスタマイザー • いちいちカスタマイザーで設定するのもめんどくさいので、 Habakiri はフックで初期値を変更できるようになっています。 • カスタマイザーの実装は普通にやると結構冗長で面倒です。 そのため Habakiri ではカスタマイザーを実装するための クラスを作りました。 → Habakiri 以外のテーマにも組み込めます。
- 19. • 松山に半移住しようと思ったことと日々の生活を、ちまちまブログに書いてる。 （ねこみみ隊長らしい。） http://nekomimi-taicho.com/archives/24884/ • 最近Habakiriのテーマをいじって勉強したのでその時の感想など。（tz_blog） http://blog.466548.org/2015/12/08/habakiri2015-memo/ • アドオンでHabakiriをお手軽カスタマイズしよう（ぴんくいろにっき） https://blog.hinaloe.net/2015/12/12/customize-habakiri-with-add-ons/ • HabakiriのPHPファイルがコーディングスタンダードに沿っているか調べてみ た（WP-kyoto） http://wp-kyoto.net/check-habakiri-allow-wpcs/ • 予算ないサイトにHabakiri使ったら想像を超えてて草すらも生えない件（micc のみっくみくなブログ（仮）） http://miccweb.net/wp/blog/2015/12/23/habakiri/
- 20. • Habakiriでオレオレテーマをサクッとレスポンシブにできたお話 ＋アルファ（SIGNAL-G） http://kita-kado.sakura.ne.jp/habakiri-advent/ • Habakiriを使ったことないけど使いたい僕が使ってないのに魅力 を語る（GOUTEN.NET） http://blog.gouten.net/article/habakiri-advent-calendar-2015/ • Habakiriの子テーマで案件に対応してみた話（wald-grun.biz） http://wald-grun.biz/etc/5673/ • Hanakiriを使って自社のブログメディアをリニューアルするとき気 をつけたこと（studiobrain.net） http://www.studiobrain.net/2015/12/22/10640
- 21. • ”php初心者なわたしでもHabakiriのおかげで体裁良く作ることが出来ま した。” • “これらのアドオン（デザインスキン）はプラグインとして製作されてい るため、使用すれば、なんと子テーマを使わずに&コードを弄ることなく 色々なカスタマイズが出来てしまうんですね！” • ”北島さん凄いわ、北島さんかっけーーーー、これを10回位言いたくなり ます。” • ”レスポンシブテーマつくるのが苦手なデザイナーさんには助かるテーマ” • ”子テーマでありながらテンプレートの上書きがほとんど発生しない構築 を可能にしています。”
- 23. 制作のワークフロー 12/16 僕の WordPress テーマ制作のワークフロー ( 仕事編 ) http://habakiri.2inc.org/blog/2015/12/16/410/
- 24. 制作のワークフロー • 北海道のハムさんの記事への便乗記事 デザインから WordPress のテーマ作成までの自分のワークフロー を見直す（HAM MEDIA MEMO） https://h2ham.net/wordpress-coding-flow • まず静的が組むか、いきなりテーマを作るかというお話。 • Habakiri 関係ない… • でもこの案件は Habakiri を親でやる、とか使うテーマが決まって いる場合はいきなりテーマを作るほうが良いと思います。
- 26. Habakiri のここがダメ • やりすぎ問題 カスタマイザー、ヘッダーレイアウト、グローバルナビゲーション、Bootstrap • Prefix 問題 CSS の class 名、テンプレートパーツ、メソッド名 • あまり考えずにやってしまったこと ディレクトリ構成、マークアップ • さらなる汎用化ができた部分 テンプレートパーツの読み込みをフック経由に • 今年は Habakiri とは別に、上記を解決したもっと薄いテーマを開発したいなと…
- 28. テーマは名前をつけるのが 一番難しい！ • Habakiri は有効化するだけでデザインを 適用できるプラグイン、デザインスキンを 販売しています。それらの名前は、 Ginger、Rocky、Coco • 実はこれはアメリカで人気の犬の名前 ランキングからとったのです！ • どうでもいい…
- 30. ページビューは増えた？
- 31. 変化なし！