仕事・情報

WordPressに地図を貼るとユーザーに喜ばれてアクセスアップに繋がる!

記事に地図を貼る方法

 

ブログでお店の紹介するのに地図を貼ったらユーザーに喜ばれるよね。

でもどうやったら良いのか、やり方が分からない。

どうすればよいのかな?

WordPress に地図を貼るのはとても簡単にできます。
地図があれば読者に喜ばれてアクセスアップにもなるので是非あなたもやってみてください。

記事と地図の幅を合わせる方法も解説していきます

 

それでは早速、地図の貼り方を解説していきます。

方法は2通りあるので好きな方をえらんでください。

  • プラグインを使う方法
  • 記事にHTMLを貼り付ける方法

ラグインを使う方法

設定は簡単で以下の流れになります。

  • ワードプレスにプラグインAdvanced Editor Toolsをインストール
  • 「Googleマップ」からコードをコピー
  • ワードプレス投稿にコードを貼り付ける

それでは実際の画面で解説していきます。

ステップ1 Advanced Editor Toolsをインストール


最初にAdvanced Editor Toolsをインストールします。

※既にこのプラグインをインストールされてる方はこの工程は不要です。

ワードプレス左のメニューから
「プラグイン」 → 「新規追加」を選ぶ

次の画面で
キーワードの枠内に Advanced Editor Tools と入力する。

するとプラグインが検索結果に出てくるので「今すぐインストール」を押す。

インストールが完了すると「有効化」というボタンに変わるので押して有効化する。

これでAdvanced Editor Toolsのインストールは完了です。

ステップ2 Googleマップでコードをコピーする


次に Googleマップ で目的の場所のコードをコピーします。

地図上で「目的の場所」をクリックします。

すると左に窓が現れるので「共有」をクリックします。

「共有」の小窓が出るのでタブ「地図を埋め込む」をクリックする。

小窓が地図に変わるので、左の「サイズ」ボタンをクリックして、ブログに貼りたい大きさを選択する。

最後に右上の「HTMLをコピー」をクリックする。

これで地図のコードコピーは完了です。

ステップ3 ワードプレスの投稿でコードを貼る


次にワードプレスの投稿画面を開きます。

地図を貼りたい位置でクリックします。

上部メニューの「挿入」をクリックします。

選択メニューが出るので、「メディア」をクリックします。

小窓が出るのでタブ「埋め込む」をクリックします。

小窓の枠内で右クリック→貼り付け

最後に下の「OK」ボタンをクリックします。

これで地図が記事に貼られました。


HTMLを直接埋め込む方法

設定は簡単で以下の流れになります。

  • 「Googleマップ」からコードをコピー
  • ワードプレス投稿にコードを貼り付ける

それでは実際の画面で解説していきます。

ステップ1 Googleマップでコードをコピーする


手順は先ほどの解説と同じですがここでも書いていきます。

Googleマップ で目的の場所のコードをコピーします。

地図上で「目的の場所」をクリックします。

すると左に窓が現れるので「共有」をクリックします。

「共有」の小窓が出るのでタブ「地図を埋め込む」をクリックする。

小窓が地図に変わるので、左の「サイズ」ボタンをクリックして、ブログに貼りたい大きさを選択する。

最後に右上の「HTMLをコピー」をクリックする。

これで地図のコードコピーは完了です。

ステップ2 ワードプレスの投稿でコードを貼る


次にワードプレスの投稿画面を開きます。

地図を貼りたい位置でクリックします。

上部タブの「テキスト」をクリックします。

テキスト画面に切り替わります。

クリックした場所にカーソルが点灯しているので、そこで右クリック→貼り付け

マップでコピーしたHTMLコードが張られたら、右上のタブ「ビジュアル」をクリックします。

これで地図が記事に貼られました。


をサイトに合わせる

Googleマップから取得した「HTMLコード」をそのまま貼り付けると、スマホなどで見た時に記事と地図のサイズが合っていない事があります。

これを合わせていきます。

右上のテキスト・タブから「HTMLコード」の幅(width)を100%に変更します。

これで記事と地図の幅が合いました。


とめ

記事にGoogleマップがあるとユーザーが経路を確認出来てとても便利になります。

ユーザーの利便性が良くなればブログのアクセスアップにも繋がりますので、是非とも活用していきましょう。

 

 

 

 

オレンジ

投稿者の記事一覧

ossans倶楽部 オレンジ

「面白いもの、好奇心をそそるもの」をテーマにライフ・アイテム・ノマドスタイル・仕事・遊びなど のコンテンツをリリースするクリエイター集団です。

あなたのお勧めグッズがあったら教えてください!このブログ記事で取り上げていきます。

関連記事

  1. 【奥義】気学の方位取りでお金持ちになる 六白金星編
  2. 日本の神様って天皇様?アマテラス様?それとも・・・
  3. ブログが書けない!そんな悩みを吹き飛ばす4つの対処法
  4. Photo Scapeで画像のサイズを変更する 【ブログ投稿など…
  5. SEOキーワード選定【シンプルに3ステップ】で初心者でも上位を狙…
  6. Vtuber Vtuberになるには★ 必要な環境・機器
  7. トランプ大統領の足跡【Part1】 ベネズエラの悲劇
  8. 記事のサファリパーク!それはsujakuの目指すサイトです

コメント

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

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

コメント

楽しく遊ぶスタッフ募集中です

おすすめ記事

  1. 日本の神様の真相に迫る!!インタビューするために江戸時代へタイムスリップ!?
  2. ソフィアのワイン日記~2~スパークリング ロゼ イタリア/ プーリア
  3. 音声入力でWordPressの投稿が驚くほど速くなる WindowsでもAppleでもOK!
  4. 【ノマドライフ】バリ島でのエピソードPart1 海外移住希望者にはきっと役に立つ!
  5. ふらっと芦屋散歩 ◇関西でカヌレと言えばこちら!芦屋オススメパティスリー
  6. 【とっておきの京都】紅葉と静寂の山寺、槙尾・西明寺
  7. 【奥義】気学の方位取りでお金持ちになる 六白金星編
  8. JAZZこそおれ達おっさんの聴く音楽
  9. 医療保険って終身医療型?更新型?
  10. 信州白馬・移住記 これから田舎移住を考えてるあなたに Part1
PAGE TOP
Translate »