実践!WordPressの企業サイト向け統合プラグイン"WP SiteManager"を使いこなす

7,014 views

Published on

2013/5/17
第18回デザイン勉強会で使用するスライドです。
http://timing-design.jp/18th_designstudy/

0 Comments
13 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
7,014
On SlideShare
0
From Embeds
0
Number of Embeds
1,830
Actions
Shares
0
Downloads
15
Comments
0
Likes
13
Embeds 0
No embeds

No notes for slide

実践!WordPressの企業サイト向け統合プラグイン"WP SiteManager"を使いこなす

  1. 1. 実践!WordPressの企業サイト向け統合プラグイン"WP SiteManager"を使いこなす井村 圭介2013.05.17
  2. 2. 井村 圭介K E I S U K E I M U R AフリーランスのWebデザイナー/エンジニア。WordPressが大好きです。@imura_design
  3. 3. WP SiteManagerとはナビゲーションやユーザーエージェントごとのテーマの切り替え、キャッシュなどの、WordPressでWebサイトを作るときによく使う機能をまとめたプラグイン
  4. 4. 公式ドキュメント■公式ドキュメントhttp://www.wp-sitemanager.com/■プラグイン公式ディレクトリhttp://wordpress.org/extend/plugins/wp-sitemanager/■facebookページhttp://www.facebook.com/wp.sitemanager
  5. 5. WP SiteManagerの開発者primestrategy jim912日本語ドキュメントも充実!
  6. 6. WP SiteManagerのモジュール•サイトマップ表示•パンくずナビ表示•ページナビ(ページャー)表示•サブナビ表示•メタキーワード、ディスクリプション設定•デバイス判定とテーマ切り替え機能•ページキャッシュ機能•(OGPも実装するかも!?)@gatespace_k
  7. 7. WP SiteManagerのインストール•管理画面にメニューができる•デバイスとキャッシュ用のテーブルができる■プラグイン公式ディレクトリhttp://wordpress.org/extend/plugins/wp-sitemanager/
  8. 8. サイトマップの機能•カテゴリー(カスタムタクソノミー)のアーカイブを表示•出力階層の制限•デフォルトのスタイルシートもある!•特定ページの除外「サイトマップ」から設定
  9. 9. サイトマップを表示する1.サイトマップ用の固定ページを作成2.コンテンツに[sitemap]を記述
  10. 10. パンくずナビを表示する1.表示したいテンプレートにコードを書く。<?php  if(  class_exists(  WP_SiteManager_bread_crumb  )  ){        WP_SiteManager_bread_crumb::bread_crumb();}?>
  11. 11. <?phpif(  class_exists(  ‘WP_SiteManager_bread_crumb’  )  ){        WP_SiteManager_bread_crumb::bread_crumb(                ‘navi_element=nav&elm_id=bread-­‐crumb’        );}?>パンくずナビのパラメータの指定:方法1
  12. 12. <?php$args  =  array(        ‘navi_element’  =>  ‘nav’,        ‘elm_id’  =>  ‘bread-­‐crumb’);if(  class_exists(  ‘WP_SiteManager_bread_crumb’  )  ){        WP_SiteManager_bread_crumb::bread_crumb(  $args  );}?>パンくずナビのパラメータの指定:方法2
  13. 13. ページナビを表示する1.表示したいテンプレートにコードを書く。<?php  if  (  class_exists(  WP_SiteManager_page_navi  )  )  {        WP_SiteManager_page_navi::page_navi();}?>
  14. 14. •show_adjacent前後ページへのリンクを表示するかどうか。デフォルトはtrue(表示)•show_boundary最初と最後のページへのリンクを表示するかどうか。デフォルトはtrue(表示)ページナビのよく使うパラメータ
  15. 15. サブナビの機能•ホームの表示の設定•投稿・アーカイブページの表示の設定•固定ページの表示の設定ウィジェットの「サブナビ」から設定
  16. 16. サブナビを表示する1.テーマのウィジェットを有効化2.「外観」→「ウィジェット」から「サブナビ」を追加3.表示したいテンプレートにコードを書く<?php  dynamic_sidebar(  ‘primary-­‐widget-­‐area’  );?>
  17. 17. メタ情報の設定•サイト全体のディスクリプション・キーワード•ページ、投稿ごとのディスクリプション・キーワード•抜粋をディスクリプションとして出力「SEO & SMO」から設定
  18. 18. メタ情報を表示する1.プラグインを有効化すると勝手に出ます!※wp_head()はちゃんと書いてね。
  19. 19. デバイス判定によるテーマの切り替え■レスポンシブウェブデザインと比較して•自由度の高いデザイン、コーディングがしやすい•高速化に特化した設計が可能•データベースがひとつなのでコンテンツを一元管理•テンプレートを複数管理する必要がある•コンテンツのコーディングに工夫が必要
  20. 20. デバイス判定の設定•デバイスグループの追加•デバイスの追加「キーワード」にマッチさせたい正規表現文字列を入力•デバイスグループごとにテーマを切り替え「デバイス判定」から設定ユーザーエージェントを判断してテーマを切り替えます自由度が高い!
  21. 21. WP SiteManagerのキャッシュ■ファイルキャッシュやリバースプロキシと比較して•デバイスごとにキャッシュを切り分けられる•ページごとにキャッシュの制御がしやすい•データベースにアクセスするのでサーバに負荷がかかる•同様の理由でキャッシュページの閲覧は微妙に遅い•実装がめんどくさい ←SiteManagerありがとう!
  22. 22. キャッシュ機能を有効にする1.wp-config.phpに↓を記述。define(WP_CACHE,  true);
  23. 23. キャッシュの設定「キャッシュ」から設定•有効期限の設定•キャッシュしないページの設定•キャッシュのクリア※ログイン中はキャッシュが表示されない!
  24. 24. apply_filtersapply_filters_ref_arrayフィルターフックを使ったカスタマイズhttp://www.prime-strategy.co.jp/wp/2429/でソースを検索■参考になるスライド
  25. 25. フィルターフックを使ったカスタマイズ値 フィルター 新しい値
  26. 26. フィルターフックを使ったカスタマイズ<?phpfunction  custom_bread_crumb(  $bread_crumb_arr  ){   if(  is_category()  ||  is_single()  ){     array_shift(  $bread_crumb_arr  );   }   return  $bread_crumb_arr;}add_filter(  bread_crumb_arr,  custom_bread_crumb  );?>
  27. 27. ありがとうございました。

×