ショップできすぎくんをPCでスマホ表示確認をする方法

PCでスマホ表示確認

皆さん、こんにちは。

もしもドロップシッピングで提供している無料のショップ作成ツール
ショップできすぎくんは、※スマートフォンでの表示に

自動的にページのデザインを最適化しており
(※レスポンシブ・ウェブデザインといいます。)

初心者も安心してショップ運営ができるのでありがたいです。

皆さんは、自分のショップをスマホで実際に見たことはありますか?
見たことがない場合は、一回見てみるといいですよ。

一方スマホを持っていない方もいますよね。
そんな時、どうすればいいでしょう。。

スマホが手元にない場合、PCでスマホ表示を疑似的にできる方法があるので
一つご紹介します。

まずは、案外使ったことがない方もいるかもしれない
ショップできすぎくん管理画面内で確認する方法です。

トップページや商品ページを編集し、下までスクロールすると
「表示確認」と「保存」のボタンが見えます。

hyouji

その直下に

表示確認ここから
『スマートフォン表示』を『利用する』設定時の確認もできます。

と説明がありPCとスマホのアイコンがあるので
スマホ側を一回押すと、スマホ表示の確認ができます。

hyouji1

hyouji2
これは、編集を保存や、公開前でも表示できます。
PC表示に戻したい時は、PCのアイコンを一度押してください。

次はショップできすぎくんの管理画面から離れた時に
ブラウザGoogle Chrome上で見る方法です。

その前に、ブラウザって何?と思われる方
ブラウザとはインターネットをするためのソフトのことです。

有名どころとして
インターネット・エクスプローラーがあるのはご存知でしょうか。

下記のような青色で「e」のアイコンで
パソコンを買った時にたいてい最初から入っているブラウザです。
ie

OS(Window7とかWindow8など)やバージョン(Internet Explorer 10とか11)
によって違ってきますので

今回はGoogle Chromeを基準に話を進めます。

まだGoogle ChromeをPCに導入していない方は
下記からダウンロードしインストールしましょう。

あると便利なブラウザです。ページの切り替わりが早いですよ。
利用規約が表示されるので、目を通し「同意してインストール」をクリックします。

Google Chrome(グーグル・クローム)のダウンロード

インストールが無事に終わるとデスクトップ上に
Google Chromeのアイコンが作成されているので
これをダブルクリックして起動します。

ご自分のショップをインターネット上で表示してみてください。
ウィンドウの幅を狭くするとスマホ表示になります。直感的にできる方法です。

ウィンドウの右上の「×」印の左隣りにある四角が重なったボタンを
おしてください。
kakudai1

マウスをウインドウの右下に置いて(右下以外でもOK)
ポインターが両矢印になるのを確認

マウスの左ボタンを押したまま、左斜め方向に
縮められるまで縮めてみてください。

syukusyou
このような画面になります。

small
次は
Google Chromeのデベロッパーを使う方法です。

特に難しいことはしません。
Google Chromeでご自分のショップを表示してください。

そしてキーボードの「F12」を押すとこのような表示になると思います。

gc1
上記のようにならない場合は、1.スマホのアイコンを押し2.代表的な機種を選ぶと
表示できます。

スマホ表示のやり方は他にもありますが
初めての方にも簡単な方法をご紹介しました。

スマホがなくても、スマホ表示をPCでやる方法でした。
987ec5ade207ab3835519143f6a8603a_s

SNSでもご購読できます。

コメントを残す

*