2016
12.27

一瞬でスマートフォン対応ができるプラグインをインストールしよう!

HTML5

こんにちは!

今日は先日作ったECショップをスマートフォンでも見られる様にするには、

どうすればいいのかという声が聞こえてきましたので、私が使っている

優秀なプラグインをご紹介させて頂きます。

1. WordPress Mobile Packのインストール

WordPress Mobile Pack

というプラグインです。

導入方法は、プラグイン => 新規追加 => 検索窓でWordPress Mobile Packと

入力して、一番左上に表示されたものをインストールすれば OK です。

 

よく見忘れ勝ちなのが、「お使いのバージョンと互換性があります」という項目です。

 

確実に確認してからインストールする様にします。

※ インストールの試用がテストされていない場合は、プラグインが使えないことがあります。

 

現在、WordPressのスマホアプリは沢山出ているので、使っておられる方も

多いと思われますが、パソコンでインストールするのがエンジニアの特性です。

なぜならエンジニアはハードジョブが好きな人が多く、変わり者だからです。

というのは冗談ですが、パソコンの方がやりやすいのは言うまでもありません。

 

ただ閲覧ユーザーは、圧倒的にスマートフォンが多いです。これは統計にも出ています。

だからこそ、スマホ対応させておくことが重要であり、このプラグインの導入が必須となってくる訳です。

 

2. スマホでの見え方の確認方法

パソコンでインストールして、スマホできちんと見られるかどうかの確認を

Viewport Resizer というツールを使って、表示させることが出来ます。

使い方は、このサイトを自分のWebブラウザにブックマークしておいて、表示させたいWebページを

開いて、スマホのマークをクリックするだけです。

iPadやパソコンでの見え方も確認することができて、とても便利です。

もちろん無料のツールなので、とってもありがたいですね!

作ってくれた開発者に感謝しながら使わせて頂きましょう☆

 

*スマホで見た時の表示がパソコンで確認できる*

3. レスポンシブwebデザイン?

レスポンシブwebデザインについても、詳細をお話ししておきます。

レスポンシブデザイとリキッドデザインを混同し勝ちですが、少し違っていて、レイアウトが変わるものと変わらないものの違いであります。

レスポンシブデザインとは

レスポンシブwebデザインとは

デスクトップパソコンや携帯電話といった幅広いデバイスのいずれに対しても、外観や操作方法が最適化された (リサイズ、パンニング、スクロールを最小限にし、読みやすく、ナビゲーションしやすい) サイトを制作するためのウェブデザインの手法。

-Wikipediaより

噛み砕いて言うと、パソコンサイズのWebページをスマートフォン用に見やすくリサイズが出来るデザインのことですな。

では、リキッドデザインは何か…

リキッドデザインも、パソコンサイズのwebページをスマフォ用に見やすくリサイズ出来るデザインだけど、

レイアウトはパソコン用と変わらないという設計になっています。

手書きでコードを書こうとすると、ルールがあり、素人にはとても面倒臭い作業が必要になります。

なので、WordPressプラグインがある訳ですね!

htmlファイルサイトでも、もちろん需要はある訳で、ツールも有ります。

ただ、無料ではありません。

そんな訳ですので、ぜひともスマフォからも見られるサイトが構成出来る様に、

今後もwordpressを使って、マネタイズ出来るまで頑張っていきましょう❣️

 

今回も最後までお読み頂きありがとうございました。

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。