MotionWorks.jp | EDIT / VFX / Grading

WordPress Jetpack 1.8 モバイルテーマ

WordPress Jetpack1.8でモバイルテーマの表示が可能になりました。Jetpackは便利なプラグインパッケージです。
 

 
モバイルサイトの表示にはWPtouchやWPhoneなどのプラグインで対応できましたが、Jetpackを使うことで簡単に表示、カスタマイズすることができます。Jetpackの使用にはWordpress.comの登録が必要です。
 
JetpackのモバイルテーマはTwenty Elevenを元に作られており、カスタマイズに慣れている方ならそう難しくなく変更できると思います。重要な点は、Jetpackがアップデートする時にテーマフォルダーが上書きされるので注意が必要です。
 

Jetpack 1.8: Mobile Theme — Jetpack for WordPress

 
Jetpackのプラグインを有効化した後でダッシュボードからJetpackを選択します。
 

 
モバイル用テーマの設定に入り、オプションを選択した後で設定を保存するだけです。
 

 
これでデフォルトの状態でモバイルテーマが適用されます。見た目はとてもシンプルです。
テーマの場所は、/plugins/jetpack/modules/minileven/theme/pub/minileven/になります。
 

 

サイドバーを変更する

コンテンツの下にサイドバー要素が表示されるようになっています。デフォルトのサイドバーはidが1になっていますので、使用するidを変更する事でメインのテーマで使用していないサイドバーを使用する事ができます。
 
minilevenのfunction.phpのregister_sidebarのidを任意のid番号に変更します(’sidebar-1’から’sidebar-2’のように)。同様にminilevenのsidebar.phpのサイドバーのidを変更します。
 

メニューを変更する

メインのテーマがカスタムメニューに対応してない場合のメニューの変更方法です。メインのfunction.phpに以下の一行を加えます。
register_nav_menu( ‘primary’, __( ‘Primary Menu’, ‘jetpack’ ) );
 
メインのテーマが対応していればカスタムヘッダーと背景も適用されます。
 

フルサイトの表示

Safariの場合メニューバーに開発メニューを表示する事でユーザーエージェントを選択できるようになります。
 

 
Safari iOS5.1- iPhoneを選択すると自動的にモバイルテーマが表示され、最下部にデスクトップ版に切り替えるオプションが表示されます。逆にフルサイトの場合はモバイルサイトの表示が最下部に現れこのリンクをページ上に配置する事でどこでもモバイルサイトへの切り替えができるようになります。
 

 

 

 

コメントを残す