最近になってスマホ所有率がノートPCを抜いたといった調査結果が出ていました。
スマホでインタネットをするのが当たり前になっているこの時代スマホ用ホームページの需要も増えてきました。
スマホサイトの制作をする場合以下の方法が考えられます。
・レスポンシブWebデザインで制作（WordPressで制作しているサイトの場合プラグインもあります）
・WordPressで制作しているサイトならプラグインを使ってスマホサイトとPCサイト表示を切り替える
レスポンシブWebデザインはPCやスマートフォン、タブレット端末など複数の機器や画面サイズに合わせてHTMLファイルを使いそれぞれに画面に合ったページを表示します。
デメリットは各端末に合わせた表示をさせるためにデザイン・設計が難しいのが特徴です。
スマホサイトとPCサイト表示を切り替える場合は、それぞれの端末に合ったデザイン・設計が出来ます。
デメリットはそれぞれの端末にごとのファイルを用意する必要があるのでファイル数が多くなり管理が面倒です。
今回紹介するWordPressプラグイン「Multi Device Switcher」は、スマホサイトとPCサイト表示を切り替えるプラグインです。
Multi Device Switcherの特徴
Multi Device Switcher以外にもスマホとPC表示のテーマを切り替える「WPtouch」が有名ですが設定変更が難しいです。
Multi Device Switcherの特徴として
・デバイスごとの設定が簡単
・スマホページで「PCで表示」ボタンが実装されている。
・設定画面が日本語で表示
などが上げられます。
インストール
「Multi Device Switcher」のページにアクセスしてプラグインをダウンロードします。
プラグインをインストールしてプラグインを有効化にします。
もしくは、管理画面のプラグインページの新規追加からプラグイン検索で「Multi Device Switcher」を入力してインストールします。
設定
管理画面の「外観」から「マルチデバイス」をクリックします。
■テーマの設定
設定画面には
・スマートフォン用テーマ
・タブレット端末用テーマ
・携帯モバイル端末用テーマ
・ゲームプラットフォーム用テーマ
があり、それぞれに合ったテーマを設定して「変更と保存」をクリックすると設定完了です。
■ユーザーエージェント
各メーカー・製品名称が表示されいます。
特定の製品にテーマを使いたい場合などに設定します。
■PC Switcher
PC以外の各デバイスにPC表示をさせるボタンを設置するかの設定です。
デバイスの種類によってはPC表示の方が見やすい場合もあります。
設定したい所に下記のコードをすると表示されます。
PC表示
<a href=”?pc-switcher=1″>PC表示</a>
スマホ表示
<a href=”?pc-switcher=0″>スマホ表示</a>
まとめ
スマホ対応といえばレスポンシブWebデザインが多いですが、WEBサイトの仕様や特徴によってはレスポンシブWebデザインの対応が難しいこともあります。
「Multi Device Switcher」は格で各デバイスのテーマを用意していれば簡単にPC表示・スマホ表示の切り替えが出来ます。
今後スマホ対応のホームページ制作をする時の選択肢の一つにしてはいかがでしょうか。
