サイトに Google ルートを追加する方法

IT の専門家として、Google ルートをウェブサイトに追加する方法を紹介します。これにより、訪問者はどこからでもあなたの場所への道順を取得できます。まず、Google Maps API キーを作成する必要があります。これを行うには、Google Developers Console に移動して新しいプロジェクトを作成します。プロジェクトを作成したら、[API の有効化と管理] リンクをクリックし、[Maps Embed API] を見つけて有効にします。次に、Google Routes ウィジェットのコードを取得する必要があります。このコードを見つけるには、Google Maps Embed API ページに移動し、[コードを取得] ボタンを選択します。コードをコピーして、Web サイトの HTML に貼り付けます。最後に、ウィジェットを表示するには、次のコードを Web サイトに追加する必要があります。「YOUR_API_KEY」を先ほど作成した API キーに置き換え、「Your+Destination」を現在地の住所に置き換えます。変更を保存して完了です。訪問者は、世界中のどこからでもあなたの場所への道順を取得できるようになります。

知りたい場合 Google の運転ルートをウェブサイトに追加する方法 次に、この投稿を読んでください。 グーグルマップ 最も人気があります デジタル地図サービス 世界的に。リアルタイムの交通情報を使用して、特定の目的地までの最適なルートを見つけます。 Google マップの埋め込み ブログやウェブサイトにアクセスすると、訪問者が世界地図上であなたの場所を確認したり、住所を確認したり、レビュー (あれば) を読んだりするのに役立ちます。独自の Google マップ埋め込みコードジェネレーターを使用してウェブサイトに地図を簡単に埋め込むことができますが、この地図をナビゲーションツールとして使用して、訪問者があなたの場所への道を見つけられるようにすることはできません。この投稿では、Google マップを使用して訪問者に道案内を表示する方法を紹介します。

次の 2 つの方法を見ていきます。 Google の運転ルートをウェブサイトに追加する :

静的な Google マップを挿入し、html フォームを使用してマップルートを表示します
iFrame マップジェネレーターを使用する

これらの方法を詳しく見てみましょう。

1] 静的な Google マップを挿入し、HTML フォームを使用してマップのルートを表示します。

この方法には 2 つのステップが含まれます。ステップ 1 - 埋め込み静的あなたの正確な場所を特定するGoogleマップ。ステップ 2 では、ユーザーの位置を受け入れて Google マップ上にルートマップを生成する HTML フォームを追加します。これを行う方法を見てみましょう。

A] ウェブサイトに Google マップを埋め込む

ブラウザを起動します。
開けるグーグルマップ新しいブラウザータブで。
左上隅にある Google マップの検索バーに住所を入力します。
表示される結果のリストから場所を選択します。
ノート： 住所が見つからない場合は、Google マップを拡大して追跡します。 Google マップのストリートビューパノラマを使用して、地図上に現在地をマークできます。見つかったら、[不明な場所を追加] または [ビジネスを追加] オプションを使用して正しい住所の詳細を入力し、確認のために場所を Google に送信します。リクエストを送信してから数時間以内に追加されます。
Google マップが表示されて正確な場所が特定されたら、アイコンをクリックします。共有アイコン。
切り替える 地図を埋め込む タブ
プレス HTML をコピー リンクをクリックして、マップコードをクリップボードにコピーします。定義済みのサイズ (小、中、大) を選択するか、カスタムサイズを入力して、Web サイトに表示するマップのサイズを決定できます。
次に、サイトの管理パネルに移動します。
マップを埋め込む Web ページを開きます。
コードエディタービューに切り替えます。
コードを貼り付けます。
コードエディターを終了します。 Google マップのプレビューが表示されます。

B] HTML フォームを使用して、Google マップでナビゲーションルートを作成します。

コードエディタービューに戻ります。
次の画像に示すコードを Google マップコードの下に追加します。
画像で強調表示されている宛先住所の値を、現在地の住所に置き換えます。
コードエディタービューを終了します。
コードをプレビューし、「住所を入力してください」フィールドに住所を追加し、ボタンをクリックして機能するかどうかを確認します 進むべき方向を教えて ボタン。
上記の手順は、 表示ルート 入力した住所から Google マップ上の現在地まで。
すべてが順調なら、あなたはできる公開コード。

2] iFrame マップジェネレーターを使用する

ブラウザを起動します。
開ける無料の HTML マップジェネレーター新しいブラウザータブで。
住所を入力してください 住所を入力してください 左パネルの検索フィールド。
画面右側の Google マップに現在地が表示されます。地図の種類、ズーム距離、幅または高さを設定できます。の横にある切り替えボタンをクリックして、マップをレスポンシブにすることもできます。 マップをレスポンシブにする オプション。
クリック HTML コードを生成する 下のボタン。
コードが表示されます。押してください コードをクリップボードにコピー ボタン。
サイトの管理パネルにログインします。
マップを配置するページを開きます。
コードエディタービューに切り替えます。
コードを貼り付けます。
コードエディターを終了します。
クリック プレビュー ボタン。マップのプレビューが表示されます。
クリック方向アイコン。
Google マップが開き、目的地として住所が事前に入力されます。
開始アドレスを入力します。使用することもできます あなたの場所 Google マップが現在地を使用できるようにするオプション。
路線図が出てきます。
すべてうまくいったら、公開ページ。

このようにして、訪問者はウェブサイトに埋め込まれた Google マップであなたの場所を表示し、自分の場所からあなたの場所への道順を見つけることができます。この投稿がお役に立てば幸いです。ご不明な点がございましたら、コメントでお知らせください。

また読む： 日常使用に最適な Google マップの代替品。

ウェブサイトに Google マップを追加できますか?

はい、Google マップをウェブサイトやブログに追加できます。 Google Embed Code Generator または無料の Google HTML Map Generator を使用します。 .どちらのオプションでも、赤いボールで住所を特定する Google マップを埋め込むことができますが、両者にはわずかな違いがあります。前者では静的な地図を埋め込むことができ、訪問者はあなたの正確な位置や近くの名所などを見ることができますが、後者では方向あなたの場所への運転ルートを見つけるために使用できる完全なルートマップを作成する機能。必要に応じて、これらのオプションのいずれかを使用して、Google マップをウェブサイトまたはブログに追加できます。

Google マップの埋め込みコードを取得するにはどうすればよいですか?

Google マップの埋め込みコードを取得するのは非常に簡単です。ブラウザウィンドウの新しいタブで Google マップを開き、利用可能な検索バーに住所を入力するだけです。マップで住所が選択されて表示されたら、アイコンをクリックします。共有アイコン。 [共有] ウィンドウで、ボタンをクリックします。 地図を埋め込む タブをクリックします HTML をコピー リンクは右上隅に表示されます。それで全部です！ Google マップのメニュー（ハンバーガーアイコン）をクリックして、アイコンをクリックすることもできます。 地図を共有または埋め込む オプション。このコードを取得する別の方法は、上記の投稿の方法 2 で説明されているように、無料の HTML Maps Generator (Maps iFrame Generator) を使用することです。

続きを読む： あなたをプロにするための最高のGoogleマップのヒントとコツ。