如何在WordPress中製作帶有多個引腳的Google地圖

將地圖添加到您的網站上可以幫助您的訪問者輕鬆找到您的業務或活動位置。如果您的業務有多個位置，則可能需要在同一地圖上顯示所有位置。在這裡，在Google地圖上使用多個引腳可能會有所幫助。

如果您的網站是使用Elementor構建的，則不必在Google Map上添加多個引腳時要麻煩。相反，您可以輕鬆地添加盡可能多的東西。即使對於初學者來說，這個過程也很簡單。

在這篇文章中，我們將介紹有關如何在WordPress中使用Elementor製作多個引腳的Google地圖的詳細教程。但是在此之前，我們將介紹幾句話，以了解WordPress網站上有多個引腳的Google Maps。

為什麼在WordPress網站上使用Google地圖與多個引腳

使用多個引腳使用Google地圖可以在許多方面改善您的網站。這不僅僅是展示位置。它可以幫助用戶建立信任並使您的網站更有用，因為他們可以輕鬆找到您的商店。這是您應該考慮的一些主要原因。

1。在一個地方顯示所有位置

如果您的業務有多個分支機構，商店或辦公室，則多個引腳可以幫助您在單個地圖上顯示它們。這使訪問者更容易看到每個位置，而無需在不同的地圖或頁面之間切換。

2。幫助用戶找到最近的位置

當用戶在一個地圖上看到所有位置時，他們可以很快找到最接近他們的位置。這可以改善他們的經驗，並幫助他們更快地採取行動，例如參觀您的商店或預約預約。

3。節省訪客的時間

您可以在純文本中列出每個地址，而是可以用銷釘顯示它們。這為您和您的訪客節省了時間。它還使您的網站看起來更專業和現代。

4。帶位置數據的Boost本地SEO

Google Maps可以幫助您網站的本地SEO。當您在地圖中添加真實地址時，它會告訴搜索引擎有關您的業務位置。這可能有助於您的網站出現在本地搜索結果中。探索如何使用Happyaddons改善本地SEO。

5。使您的網站更具互動性

帶有多個引腳的地圖看起來更具交互性和動態性，而不是純文本。訪問者可以放大，單擊引腳並探索地圖。這使您的網站更具吸引力和用戶友好。

6。非常適合基於服務或多支分支的業務

如果您經營一系列餐廳，診所，商店或交貨點，多個引腳可以清楚地解釋您的覆蓋範圍。如上所述，這建立了信任並幫助用戶選擇最近的位置。

與Elementor一起製作帶有多個引腳的Google地圖的先決條件

讓我們在一開始就清楚一件事。 Elementor確實有一個名為Google Map的內置小部件。但是它的功能非常有限。您不能使用此默認小部件向地圖添加多個引腳。因此，為此，您需要附加插件。

一個不錯的選擇是Happyaddons 。它提供了一個名為Advanced Google Maps的小部件，該小部件可讓您輕鬆地創建並在地圖中添加多個銷釘，而無需任何麻煩。

因此，總共需要本教程上的網站上的以下工具。

• Elementor
• Happyaddons
• Happyaddons Pro

需要HappyAddons Pro ，因為高級Google Map是該插件的高級小部件。在您的網站上安裝並激活它們後，開始按照下文開始遵循教程。探索Happyaddons的所有其他小部件。

如何在WordPress中製作帶有多個引腳的Google地圖：分步教程

在本節中，我們將逐步解釋如何使用Elementor和HappinAddons插件製作帶有多個引腳的Google地圖。我們將使用必要的屏幕截圖進行裝飾，以便您了解完整的過程。繼續閱讀！

步驟01：打開頁面並找到高級的Google Map小部件

打開要使用多個引腳創建Google地圖的帖子或頁面。在Elementor面板上查找Advance Google Map小部件。將其拖放到Elementor帆布上。

步驟02：獲取Google API密鑰

將小部件添加到畫布中後，您將要求配置用於顯示Google地圖的憑據。要開始，請單擊面板上“一般設置”部分下的憑據選項。

您將被帶到網站後端的HappyAddons的憑證部分。查找Google Map選項。然後，點擊GET API密鑰選項。

您將來到Google Cloud頁面。

現在，您必須找到“地圖JavaScript API”。為此，在搜索框中鍵入JavaScript API 。出現該選項後，單擊它。

進入MAPS JavaScript API頁面後，啟用該選項。

按同意並繼續按鈕。在此之前，您可以選擇您的國家。我們為我們的情況模糊了。

Google API密鑰在技術上不是免費的。您必須完成帳單信息才能獲取API。

注意（免費）：儘管在技術上不是免費的，但您將獲得相當於每月200美元的代幣。有了這個令牌，您的Google地圖可以加載或查看多達28,000次。只有在越過此視圖/負載限制時，您的卡才會被充電。

之後，將為您提供彈出窗口。您必須提供有關將使用此地圖的一些信息。完成後，單擊彈出窗口右下角的提交按鈕。

Google Map API密鑰將通過新的彈出窗口立即出現在您的屏幕上。複製API鍵。

回到HappyAddons Google API密鑰選項，然後在那裡粘貼代碼。點擊末尾的“保存更改”按鈕。

現在，來到您的Elementor帆布，刷新/重新加載它。 Google地圖將出現在畫布上。

檢查如何使用Elementor在WordPress中創建時間表。

步驟03：向地圖添加多個引腳

默認情況下，在地圖上僅顯示一個引腳。要在地圖上添加並顯示更多引腳，請在面板上展開地圖標記部分。

擴展地圖標記部分後，您可以通過單擊+添加項目按鈕來添加任意數量的銷釘。

現在，通過放置緯度和經度的值，您可以精確地設置每個位置的銷釘。

步驟04：配置地圖設置

以同樣的方式擴展地圖設置部分。

您將在本節中找到很多選擇。

現在，您可以通過開關切換以查看它們的工作方式來探索每個選項，以便您最終可以陪伴著適合設計需求的選擇。

了解如何在WordPress中創建自動滾動圖像庫。

步驟05：樣式化高級Google地圖小部件

完成所有設置和內容部分時，請進入“樣式”選項卡。從這裡，您可以自定義高度，寬度，邊界類型，邊界半徑和更多選項。

以同樣的方式，還可以擴展其他選項，並在您想更改引腳的外觀時進行必要的自定義。

步驟06：預覽設計

設計完成後，在在線發布之前，請預覽它，以查看是否需要進行任何校正或修改。您可以看到，在下面附加的視頻剪輯中，小部件在我們的末端正常工作。

因此，您可以在WordPress中使用Elementor製作帶有多個引腳的Google地圖。

帶有多個引腳的Google Map的高級提示

一旦在Google地圖中添加了多個引腳，您可以做更多的事情，使該地圖對訪問者和網站更好。這些高級技巧將幫助您使地圖看起來更專業，改善用戶體驗，甚至支持您當地的SEO工作。

1。使用自定義圖像代替圖標

而不是默認的紅色引腳，請嘗試使用每個位置的自定義圖標或圖像。 HappyAddons允許您從Content Tab> MAP標記部分進行此操作。自定義圖像和圖標可以使您的地圖在視覺上更清晰和吸引人。

2。縮放和中心設置

調整地圖的縮放水平和中心，以正確顯示所有銷釘。如果某些引腳相距很遠，請確保縮放水平足夠寬，以便在地圖加載時可見所有。這為用戶提供了完整的概述，而無需手動移動地圖。

3。使其移動友好

始終檢查您的地圖在移動設備上的外觀。確保它快速加載，可單擊銷釘，並且在小屏幕上可以讀取信息框。在台式機和移動設備上效果很好的地圖將使更多的用戶滿意。

4。在接觸或位置頁面上嵌入地圖

不要只是將地圖留在一頁上。您可以通過將其嵌入在其他頁面上，例如“聯繫我們”，“我們的位置”或“訪問我們”頁面來重複使用同一地圖。這可以幫助用戶在您網站上的任何地方找到正確的位置。

了解如何使用Elementor在WordPress中創建動態網頁。

結論

用多個引腳製作Google地圖可能是您網頁設計中的一個簡單步驟或一部分，但是它可能會有持久的印象。它不僅可以幫助訪問者找到您的位置，還可以提高本地SEO分數並使您的網站看起來更專業。

在Elementor和Happyaddons插件的幫助下，您可以輕鬆地將它們添加到您的網站中，而無需麻煩。這是如此簡單，即使是初學者也可以通過遵循上面涵蓋的教程來做到這一點。如果您仍然有任何問題，請通過下面的評論框告訴我們。

我們很快就會通過可行的答復與您聯繫。感謝您與我們在一起，直到最後。讓我們知道您希望我們在下一篇文章中介紹哪個主題。