Jet Elements を使用して複数のピンを持つマップを作成する方法を知りたいですか?
ジェットエレメント と呼ばれるウィジェットを提供します 高度な地図。 ウィジェットとは異なります でログイン ネイティブマップElementor XNUMX つの場所のみをサポートする Jet Elements Advanced Map Widget を使用すると、複数のピンを使用してマップを作成できます。
このウィジェットを使用するには、まず Jet Elements を でログイン API キーを使用してマップします。
Jet Elements Advanced Map Widget は、市内に複数の支店を持つ企業があり、支店の場所を示すマップを作成したい場合に非常に便利です。 このウィジェットは、都市の観光名所の地図のようなものを作成するのにも役立ちます。
このウィジェットの使用方法は次のとおりです。
ステップ 1: JetElements を Google マップに統合する
前述したように、API キーが必要です でログイン Jet Elements を Google マップと統合するためのマップ。 API キーは Google API コンソールから取得できます。
だから訪問 Google API コンソール Google アカウントでサインインします。 まだプロジェクトがない場合は、上部のドロップダウン メニューをクリックして新しいプロジェクトを作成し、 新しいプロジェクト 表示されるポップアップで。
プロジェクトに名前を付けて、ボタンをクリックします CREATE .
新しいプロジェクトが作成されたら、Google API コンソール ダッシュボードの上部にあるドロップダウン メニューからプロジェクトを選択し、 図書館 左パネルにあります。
Google は、Google Maps API を 17 のタイプに分類しています。 このウィジェットを使用するには、Jet Elements Advanced Map ウィジェットに必要な API を有効にする必要があります。 Jet Elements の開発者である Crocoblock は、必要な API に関する詳細情報を提供していません。 私たちの経験に基づいて、次の API を有効にしました。
- API の説明
- ジオコーディング API
- マップJavaScript API
- APIシート
リンクをクリックできます すべて表示する セクションで CARTES それらすべてを見るために。
API を有効にするには、該当する API をクリックして選択し、ボタンをクリックします。 アクティブ化.
必要な API の有効化が完了したら、Google API コンソールのメイン ダッシュボードに戻り、 識別子 左パネルにあります。 ボタンをクリックします 認証情報を作成する そして選択 APIキー. 表示されるポップアップで API キーをコピーします。
次に、WordPress ダッシュボードにログインして、 JetPlugins – > JetElements 設定.
タブをクリックします 統合 フィールドにAPIキーを貼り付けます Google マップ API キー セクションで Googleマップ。 オプションを有効にする 個別のジオコーディング API キー 同じコードを貼り付けます ジオコーディング API キー.
ステップ 2: マップを作成する
Jet Elements と Google マップが正常に統合されたら、マップの作成を開始できます。 これを行うには、新しいページを作成します (ページ – >追加)または新品(アイテム – > 追加) で変更します Elementor.
エディターで Elementor、開始する前にレイアウトを設定します。 これを行うには、左下隅にある歯車アイコンをクリックして [ページ設定] パネルを開きます。 オプションの下のドロップダウン メニューからレイアウトを選択します 一般設定.
Elementor 編集ボックスのプラス アイコンをクリックして新しいセクションを追加し、詳細マップ ウィジェットをキャンバスにドラッグします。
マップの中心を都市 (または作成するマップに応じて任意の地域) に設定します。 また、初期ズームを設定します。
オープン Googleマップ マップに追加する最初の場所を見つけて、その住所をコピーします。
Elementorエディターに戻り、セクションを開きます ピン. 既存の場所をクリックし、アドレスをコピーしたばかりのアドレスに置き換えます。 また、フィールド上の場所の説明を追加します ピンの説明.
ボタンをクリックします 要素を追加 別のアドレスを追加するには、少し下に配置します。
マップのスタイルと高さを変更するには、セクションを開くことができます マップスタイル.
NOTE: ウィジェットをドラッグしても地図が読み込まれない場合 高度な地図 Elementor エディターで「開発目的のみ」というメッセージが表示される場合は、Google への請求を有効にしてください。 クラウド。 Google の新しいポリシーでは、開発者は請求先アカウントを有効にすることが求められています。
ElementorProを今すぐ入手!!!
まとめ
そう ! Jet Elements を使用して複数のピンを持つマップを作成する方法を示すこの記事は以上です。 そこに行く方法について懸念がある場合は、 commentaires.
ただし、相談することもできます 私たちのリソース、インターネットサイトの作成プロジェクトを実行するためにより多くの要素が必要な場合は、 WordPressブログ作成 または Divi:史上最高のWordPressテーマ.
しかし、その間に、 さまざまなソーシャルネットワークでこの記事を共有する.
...