WordPressテンプレート制作、ウェブデザイン技能検定に挑戦中

前の記事:HTML5のcanvas要素が思いの外すごかった
HOME
次の記事:ウェブデザイン技能検定2級学科試験対策、過去問題(平成28年第1回)解説その1

プラグインを利用したWordPressのガラケー表示対応

WordPress

 

タイトルの通りです。ガラパゴス携帯からアクセスあった際、それに適したスタイルでWordPressを表示します。

当ブログはレスポンシブデザインのオリジナルテンプレートで、PCとスマホのアクセスに同時対応しています。しかし、ガラケーには対応しておらず、表示設定を後回しにしていました。オリジナルテンプレートならガラケー用のスタイルも自分で設定すべきかと考えていましたが、他の有名なWordPressテンプレートもガラケー表示対応をプラグイン処理に任せているようなので、当ブログもそのようにしました。

 

※注意

PHP7にバージョンアップするとKtai Styleでエラーが出る

これから紹介するプラグインは、PHP7には対応していません(2017年2月9日現在)。

 

 

プラグインをダウンロード

 

KtaiStyle検索

WordPress管理画面から、プラグイン→新規追加と進み、Ktai Styleで検索します。検索の際、頭文字は大文字、またKetaiではない事に注意してください。

すぐに該当するプラグインが表示されると思うので、ダウンロードして有効化します。

たったこれだけの手順でプラグイン利用によるガラケーの表示対応は完了です。

 

プラグインを有効化するとWordPress管理画面に携帯表示の項目が追加されているはずです。

デフォルトテーマのままで問題ありませんが、携帯表示のテーマ項目から他のスタイルも設定出来ます。

同じくテーマ項目に、電話キャリア別テーマの選択がありますが、iPhone、Android用の項が(Ktai Styleを使わない)となっている事を確認してください。意図的にそうするのであればいいのですが、(共通テーマと同じ)とすると、スマートフォンからのアクセスに対しガラケー用ページが表示されてしまいます。

念のため以下に記すガラケー用ページの表示確認をすると共に、PCとスマホからアクセスした際、これまでと同じように表示されるか確認しておいた方がよいでしょう。

 

 

表示確認

 

Ktai Styleを有効化する前はアクセスしても真っ白な画面しか映りませんでした。

 

ガラケー表示エミュレーター

Ktai Styleを有効化した後はご覧のようにデバイスに適したスタイルでブログが表示されます。

今回の表示確認ではdocomoのシミュレーターを使用しました。

iモードHTMLシミュレータII

 

gooモバイルサイトシミュレーター

ブラウザ上でキャリア毎の表示確認が行えるこちらのサイトの方がお手軽です。

gooモバイルサイトビューワ

 

ただ、どちらのシミュレーター表示も実機とは異なった表示となっている事があるので注意です。

 

|

プラグインを利用したWordPressのガラケー表示対応

0件のコメント

コメント

カテゴリ

月別アーカイブ