13 章携帯電話・スマートフォンでホームページを閲覧できるようにする

13 章
携帯電話・スマートフォンでホームページを閲覧できるようにする
WordPress で作成されるホームページは、パソコンで Internet Explorer や Firefox などのブラウザで閲覧
するために作られたものです。従って、フルブラウザ（パソコン向けに作られたホームページをそのまま閲
覧できる、携帯電話向けのブラウザ）機能がない携帯電話では見ることができません。
また、iPhone などのスマートフォンでもパソコン用のホームページを閲覧することができますが、作動
が重いのは否めません。
ここでは、プラグインを追加して携帯電話とスマートフォン、それぞれの機器での閲覧に対応したホーム
ページを表示させるようにしましょう。
13-1 携帯電話向けのホームページを出力する方法
１．プラグイン「Ktai Style」をインストールする
Ktai Style は、携帯電話からのアクセスがあった時だけ、携帯電話専用のモバイルサイトを表示させるプ
ラグインです。携帯電話で見た時だけ作動するので、パソコンで見るホームページは従来と変わりありませ
ん。プラグインの追加方法は７章で説明したとおりです。今回はダッシュボードから自動でインストールす
る方法で行います。
（１）ダッシュボードのメニューから「プラグイン」 ⇒ 「新規追加」を選択
⇒ 「プラグインのインストール」画面に移動
（２）キーワードに「Ktai Style」と入力し、検索する。
（３）検索結果に Ktai Style があるのを確認したら、「いますぐインストール」
⇒ 「OK」 ⇒ 「接続情報」の画面でパスワードを入力したら「開始」
（４）「プラグインを有効化」を選択すると、すぐに Ktai Style が利用できます。
２．携帯電話向けのホームページの設定
プラグインを有効化すると、ダッシュボードの一覧に「携帯表示」という項目が追加され、携帯電話向け
の表示設定を変更することができます。
その中の「テーマ」を選択すると、初期設定のテーマのほか「利用可能なテーマ」として５つのテーマが
用意されています。「有効化」を選択すると、テーマを変えることができるので、試してみましょう。また、
携帯電話会社別に表示させるテーマを変えることもできます。
設定を変更したら、必ず「変更の保存」を選択してください。
※
携帯電話用のテーマを追加したいときは、Ktai Style テーマの配布サイトからダウンロードします。
ダッシュボードからの自動インストールには対応していないので、７章で説明したとおり、WinSCP を使っ
て手動でサーバーにアップロードします。
アップロード先は、自分の WordPress フォルダ
⇒ 「wp-content」 ⇒ 「plugins」⇒ 「Ktai-Style」 ⇒
「themes」フォルダの中です。
33
13-2 プラグイン「WPtouch」をインストールする
WPtouch は、WordPress で作成したホームページを iPhone や Android 搭載スマートフォン向けのホーム
ページに最適化するためのプラグインです。Ktai Style と同様、スマートフォンで見た時にだけスマートフォ
ン用のホームページを表示させるためのプラグインです。Ktai Style と共存して利用できますので、こちら
もインストールしましょう。
１．ダッシュボードのメニューから「プラグイン」 ⇒ 「新規追加」を選択
⇒ 「プラグインのインストール」画面に移動
２．キーワードに「WPtouch」と入力し、検索する。なお、このプラグインは「人気」でも探すことができます。
３．「今すぐインストール」を選択し、インストールが完了したら「プラグインを有効化」を選択すると、
すぐに WPtouch が使用できます。
４．WPtouch の設定変更は、ダッシュボードの「設定」 ⇒ 「WPtouch」から行います。
最初は英語で表示されていますが、「WPtouch Language」の項目で使用する言語を日本語に変更すると、
説明文が日本語に翻訳されるので、自分なりのスマートフォン用ホームページを作ってみましょう。
13-3 携帯電話用・スマートフォン用ホームページをパソコンで確認する方法
Ktai Style や WPtouch を有効化しても、パソコンのブラウザでは本当に作動しているのか確認できません。
また、設定を変更しても手元に携帯電話やスマートフォンがなければ確認することができません。しかし
Firefox では、パソコンのブラウザでもモバイル用端末をシミュレートするアドオン（WordPress のプラグ
インと同じく、Firefox の機能を追加するための小さなプログラムのこと）「FireMobileSimulator」をインス
トールすると、携帯電話やスマートフォン用のホームページを確認することができます。
１．Firefox の「ツール」 ⇒ 「アドオン」を選択。新しく「アドオンマネージャ」の画面が表示されます。
２．右上の「アドオンを検索」欄に「FireMobileSimulator」と入力して検索する。
３．検索結果に出てきた「FireMobileSimulator」の「インストール」を押す
⇒ 「今すぐ再起動」を選択
Firefox の再起動後、「拡張機能」の一覧に「FireMobileSimulator」が表示されていればインストール成功
です。
４．再び Firefox の「ツール」を選択すると、
「FireMobileSimulator」の項目が追加されているので、選択す
ると登録されている端末の一覧が表示されます。
最初は端末の種類が少ないですが、「最新端末リストから端末を追加」を選択すると、各携帯電話会社ご
とに任意の端末を追加することができます。
５．端末を選択して、ページの再読み込み（F5）をすると、今見ているページが携帯電話またはスマートフォ
ンの画面でどのように表示されているか確認できます。
６．機能を終了させるときは、「端末選択解除」を選択します。
34

Download Report