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

Contenu connexe

Plus de Keisuke Imura

JavaScriptのエラーチェックツールをつくろうとした話
JavaScriptのエラーチェックツールをつくろうとした話JavaScriptのエラーチェックツールをつくろうとした話
JavaScriptのエラーチェックツールをつくろうとした話Keisuke Imura
 
テクニカルクリエイターの憂鬱
テクニカルクリエイターの憂鬱テクニカルクリエイターの憂鬱
テクニカルクリエイターの憂鬱Keisuke Imura
 
イマドキWebメディアの制作手法
イマドキWebメディアの制作手法イマドキWebメディアの制作手法
イマドキWebメディアの制作手法Keisuke Imura
 
ベンチャー広報のための時短デザインテクニック
ベンチャー広報のための時短デザインテクニックベンチャー広報のための時短デザインテクニック
ベンチャー広報のための時短デザインテクニックKeisuke Imura
 
今日から始めるPython
今日から始めるPython今日から始めるPython
今日から始めるPythonKeisuke Imura
 
2015年に向けたWordPress動向
2015年に向けたWordPress動向2015年に向けたWordPress動向
2015年に向けたWordPress動向Keisuke Imura
 
スタイルガイドを活用した運用に強いCMSサイト制作
スタイルガイドを活用した運用に強いCMSサイト制作スタイルガイドを活用した運用に強いCMSサイト制作
スタイルガイドを活用した運用に強いCMSサイト制作Keisuke Imura
 
フリー3ヶ月目で思う、2年後稼げるWebデザイナー像
フリー3ヶ月目で思う、2年後稼げるWebデザイナー像フリー3ヶ月目で思う、2年後稼げるWebデザイナー像
フリー3ヶ月目で思う、2年後稼げるWebデザイナー像Keisuke Imura
 

Plus de Keisuke Imura (8)

JavaScriptのエラーチェックツールをつくろうとした話
JavaScriptのエラーチェックツールをつくろうとした話JavaScriptのエラーチェックツールをつくろうとした話
JavaScriptのエラーチェックツールをつくろうとした話
 
テクニカルクリエイターの憂鬱
テクニカルクリエイターの憂鬱テクニカルクリエイターの憂鬱
テクニカルクリエイターの憂鬱
 
イマドキWebメディアの制作手法
イマドキWebメディアの制作手法イマドキWebメディアの制作手法
イマドキWebメディアの制作手法
 
ベンチャー広報のための時短デザインテクニック
ベンチャー広報のための時短デザインテクニックベンチャー広報のための時短デザインテクニック
ベンチャー広報のための時短デザインテクニック
 
今日から始めるPython
今日から始めるPython今日から始めるPython
今日から始めるPython
 
2015年に向けたWordPress動向
2015年に向けたWordPress動向2015年に向けたWordPress動向
2015年に向けたWordPress動向
 
スタイルガイドを活用した運用に強いCMSサイト制作
スタイルガイドを活用した運用に強いCMSサイト制作スタイルガイドを活用した運用に強いCMSサイト制作
スタイルガイドを活用した運用に強いCMSサイト制作
 
フリー3ヶ月目で思う、2年後稼げるWebデザイナー像
フリー3ヶ月目で思う、2年後稼げるWebデザイナー像フリー3ヶ月目で思う、2年後稼げるWebデザイナー像
フリー3ヶ月目で思う、2年後稼げるWebデザイナー像
 

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