Google chrome（グーグル ク...
続きを読む
Googleマップウィジェットは、お店や実店舗のあるビジネスのウェブサイトを作る時にとても便利です。
ElementorのGoogleマップウィジェットの使い方と、たまに発生する「住所がうまく表示されない」トラブルの解決法を紹介します！
↑Googleマップウィジェットは、Elementorの便利なウィジェットで、住所を指定してその住所を中心にマップを表示できる機能です。
地図の大きさやスケール（ズームの度合い）、色合いなども調整することができます。
デフォルトの状態はロンドンにある観覧車「ロンドン・アイ」が設定されています。
↑Elementorの編集画面から、「Googleマップ」をドラッグ＆ドロップして表示させたい場所に挿入します。
↑コンテンツの編集画面で「所在地」の箇所に表示させたい住所を入力します。
すると、地図の入力した住所に赤いピンが立ちます。
↑「ズーム」を変更すると地図の縮尺を調整することができます。
ポインタを右に動かし数字を大きくするとズームインでき、逆に動かすとズームアウトできます。
↑「高さ」を変更すると地図が表示される高さを調整することができます。
ポインタを右に動かし数字を大きくすると高くなり、逆に動かすと低くできます。
↑「スタイル」の編集タブを選択すると、地図の彩度やコントラストなどを調整することができます。
CSS Filtersと表示されているところの右側の鉛筆マークをクリックすると、各項目を調整することが可能です。
↑例えば、「彩度」を下げて35に設定すると、地図の彩度が落ちて表示されます。
ウェブサイト全体のイメージが落ち着いた印象のサイトでは、彩度を下げることでウェブサイト全体の統一感を図ることもできます。
稀に、ElementorのGoogleマップウィジェットで、入力した住所にピンが立たない場合（住所が正しく表示されない場合）があります。
その場合の解決方法を紹介します！
↑まず初めに、表示させたい住所の箇所を通常のGoogleマップで検索します。
そして、地図上の赤いピンの上で右クリックします。
↑そして、一番上に表示されている番号をコピーします。（クリックするだけでクリップボードにコピーされます）
↑コピーした番号をGoogleマップウィジェットの「所在地」に貼り付けます。
これで住所が正しく表示されるはずです。
今回の記事では、ElementorのGoogleマップウィジェットの設定方法と、住所が正しく表示されないときの解決方法を紹介しました。
実際にお店があるブランドやビジネスのウェブサイトではマップの掲載はとても大切です。
ぜひ、Elementorを使用してウェブサイトを作成している方は、Googleマップウィジェットを使ってみてください。
また、住所が上手く表示されずに悩んでいる方がいましたら、この解決方法が参考になれば幸いです😆
2024-12-08
Sunday
20代後半のWEBマーケター&WEBデザイナー
新卒で商社に入社しWEBマーケターとして勤務後、
カナダに渡航し現地企業のWEB制作と
マーケティング支援を行う。
現在は帰国し某企業でWEBマーケターをしています。
自分がWEBマーケター・WEBデザイナーとして
仕事をしているときに気になった事を
調べた経緯を残しておきたいなという思いと、
それを誰かのお悩み解決に
役立てることができたらいいなと思っています。
“ネコとレモンのWEBマーケ＆デザインブログ”
みたいな感じで覚えてもらえたら嬉しいです😺🍋
Google chrome（グーグル ク...
続きを読む
これからWEBマーケティングを学びたい人...
続きを読む
