役立つ情報を発信

MapPress Easy Google Mapsをレスポンシブ表示にする方法

APIやらなんやら、さっぱり詳しくない私にとって貴重なプラグインです。

Sponsored Link

地図の代表的プラグイン

このプラグイン、地図でちょっとした観光案内をしたくて導入しました。

JAVAスクリプトやら、APIやら知識のまったくない私にとっては、ありがたいプラグインです。

ただ、PCで表示が小さいので、「地図をもっと大きくできないかな~」と悩んでいました。

いろいろ調べた結果、レスポンシブ対応の表示設定の方法を発見したのでご紹介します!

 

レスポンシブ対応の設定方法

レスポンシブ対応にする方法は以下のとおりです。

まず、管理画面から「MapPress」を選択。

2016-08-03_123112

そして、初期設定のマップサイズで「太さ」を「100%」にします。※「Height」(高さ)は具体的な数字を入力します。

2016-08-03_122310

この状態で「変更を保存」すると、PC画面では以下のように表示されます。

sample

一方、スマホでは以下のように表示されます。

Screenshot_2016-08-03-12-35-55

きちんとレスポンシブ対応にすることができました。

ちなみに、「太さ」と「Height」を両方とも100%に設定すると、画面上で地図がつぶれて表示されてしまいました。とりあえず「太さ」だけ「100%」に設定して、「Height」はお好みに応じた具体的な数字を入れたほうが良さそうです。

関連記事

プロフィール

夢は、成しとげる

氏名 : ヌコミチ
年齢:三十路
職業:落ちこぼれサラリーマン
趣味:ユーチューブとブログの研究!

ご感想、ご質問・ご相談はこちらから、お気軽に!
↓↓↓
メールフォームはこちら☆

スポンサーリンク