<u id="c6ayk"><tbody id="c6ayk"><label id="c6ayk"></label></tbody></u>

<tt id="c6ayk"><noscript id="c6ayk"></noscript></tt>

<tt id="c6ayk"></tt><source id="c6ayk"><menuitem id="c6ayk"></menuitem></source>
<strong id="c6ayk"><tbody id="c6ayk"></tbody></strong>

      <tt id="c6ayk"><noscript id="c6ayk"></noscript></tt>
      <rp id="c6ayk"><menuitem id="c6ayk"></menuitem></rp>
    1. 漳州高端網站建設:divi插件突出顯示-映射擴展模塊

      2019.04.29 |
      標簽

      DiviBuilder有一個Map模塊,允許您在Divi設計中顯示Google地圖。這是一個很好的選擇,如果你想要一個標準的谷歌地圖,但它沒有任何調整樣式。如果你想要你的谷歌地圖樣式,你將需要類似DiviMap擴展。

      diviMap擴展添加了一個新模塊到DiviBuilder,它可以與任何基于divi Builder的網站一起工作。它添加了許多地圖樣式,允許您選擇地圖類型,上傳您自己的引腳圖標,設置地圖高度,并創建您自己的信息框內容。

      擴展的divi Map可從以下站點獲得:DiviWebDesign.com.

      在我們漳州高端網站建設看MapExtended模塊之前,讓我們先看看標準的DiviMap模塊來進行比較。

      標準Divi映射模塊

      漳州高端網站建設

      標準的Divi模塊可以與標準部分和特殊部分一起使用。要使用它,您需要一個GoogleAPI密鑰。單擊“常規設置”中提供的鏈接,了解如何創建自己的密鑰。

      一般設置

      漳州高端網站建設

      漳州高端網站建設在“常規設置”中,您可以放置多個引腳,選擇要顯示的確切地址,使用鼠標輪啟用縮放,在移動上啟用拖動,在電話、平板或桌面上禁用,并更改管理標簽。

      創建一個Pin

      添加映射中心地址以顯示所需的地圖。您可以在此地圖中添加多個引腳,每個引腳具有不同的位置和信息。若要為您的地圖創建一個引腳,請選擇“在地圖模塊中添加新針”。

      在這里,你給別針一個標題,并選擇它的地址。當訪問者鼠標越過引腳時,標題就會出現。您可以通過輸入地址或在地圖上想要的位置拖放引腳來放置引腳。引腳將自動顯示位置和地址的名稱。

      漳州高端網站建設也可以定義引腳的信息框的內容。這允許您創建自定義內容,而不是使用默認的GoogleMap信息。將信息框的內容添加到WYSIWYG編輯器中。就像用WYSIWYG編輯器為頁面和帖子創建內容一樣,您可以放置媒體、文本或其他內容。在本例中,我添加了要顯示的文本和圖像。

      下面是地圖在Divi庫的“聯系人”頁面上的外觀。在本例中,我放置了一個引腳,并定義了信息框的內容。

      高級設計設置

      高級設計設置給您一個灰度過濾器。您可以選擇篩選金額,以獲得您想要的灰度外觀。

      灰階是有用的,使你的顏色流行或調色的顏色。如果該顏色不適合您的網站的樣式,或者如果您希望地圖融合在一起,而不是突出的話,這也是很有幫助的。在上面的例子中,我放置了兩個引腳,并將灰度設置為70%左右。

      標準Map模塊為您提供工具,定義一個映射并放置多個引腳。您甚至可以為信息框創建自己的內容。如果您想要對您的地圖做更多的工作,比如自定義映射、引腳或內容呢?讓我們看看MapExtended模塊,看看它能做些什么。

      地圖擴展模塊

      MapExtended模塊構建在標準Map模塊的基礎上,為您提供進一步定制地圖的工具。

      安裝

      漳州高端網站建設在安裝插件之前,您必須先解壓縮下載文件。在里面你會找到文檔和壓縮插件文件。這是你要上傳的文件。上傳并正常安裝此文件。

      divi Builder模塊

      MapExtended模塊被添加到DiviBuilder中,并以與任何模塊相同的方式使用。這是很容易發現,因為模塊是亮黃色。它可以與標準和專業部分一起使用。

      一般設置

      “常規設置”與標準DiviMap模塊的工作方式相同,但要顯示控件的添加部分除外。這使您可以禁用默認控件,如縮放、映射類型和行走路線。

      除非禁用控件,否則映射的工作方式相同,至少在查看“高級設計設置”之前是如此。

      高級設計設置

      高級設計設置是兩個模塊的區別所在。這個選項包括地圖選項、地圖類型、默認顯示選項、動畫、地圖高度和大量字體樣式。

      地圖選項

      這個模塊不只是一個灰度選項,而是使用時髦的地圖數據為GoogleMaps提供不同的樣式。在我們最初只有一個選擇的地方,我們現在有70多個。大多數都是重新著色的,但也有一些是去掉標簽的,等等。他們都給了地圖一個新的外觀。有些比另一些更極端,有些更適合某些地圖類型。讓我們看幾個例子。

      午夜指揮官

      這個叫午夜指揮官。所有的土地和水都是深藍色的。較大的道路突出顯示。標簽是一種淺棕色,很好地脫穎而出。盡管看上去很暗,但它很干凈,而且相對容易導航。

      蒙德里安

      這個叫蒙德里安。水是淺藍色,道路是黑色的,藍色、紅色、黃色和奶油是陸地元素。這個不顯示標簽。

      克拉德梅

      Cladme只使用幾種顏色來顯示水、土地、道路和標簽。即使只有幾種顏色,我也發現它很容易閱讀和跟蹤。

      桔黃色的

      橙色主要集中在顏色橙色的水和主要道路。譚是土地,而較小的道路是淺棕色。

      鮮亮的泡沫

      明亮和泡沫使用大量的藍色,紅色,褐色,棕色和綠色。黑色用于小路名,而區域則用白色標出紅色。

      地圖類型

      可以設置默認的映射類型。如果禁用控件,則讀取器將無法更改它。有四種類型的地圖可供選擇:

      • 路線圖
      • 衛星
      • 雜交
      • 地形

      地圖樣式和地圖類型的各種組合可以創建一些有趣的設計。你可能需要進行實驗才能找到最有效的組合。下面查看所有四種映射類型的Vintage map選項。

      復古與路標只顯示道路。

      這是帶衛星的Vintage。衛星不受地圖樣式的影響,所以不管怎么看,它看起來都是一樣的。

      混合覆蓋在衛星圖像上的道路數據。這個版本在混合地圖上使用了Vintage風格。

      這是有地形的葡萄酒。這一條增加了道路景觀的地形。

      在加載時顯示Info窗口

      當地圖加載時,信息框將自動打開。此示例使用TransportforLondon映射樣式。

      標記銷的彈跳動畫

      這使得別針反彈,所以它們更加突出。此示例使用Decola地圖樣式。

      定義地圖的高度

      讓地圖任何你想要的高度,你可以調整它不同的桌面,平板電腦和手機。在這個例子中,我制作了800像素高的地圖。您甚至可以在狹窄的列中使用它來創建一個高而瘦的地圖。此地圖使用Flex映射樣式。

      造型

      其余的調整允許您自定義信息框中的字體。您可以為標題和內容選擇字體和字體樣式、大小、顏色、字母間距和行高。

      由于我一直使用圣地亞哥動物園作為我的引腳之一,我選擇了顏色和字體風格,是類似于他們的網站。我還增加了字體大小、間距和線條高度。此示例使用光明甜點地圖樣式。

      定制銷

      地圖擴展的另一個優點是能夠為您創建的每個引腳上傳您自己的引腳圖標。您可以設置引腳的寬度和高度,因此,如果您使用相同的圖標,您可以改變他們的大小,如果你需要。

      例如,如果您有一個具有多個位置的商店,您可以將最突出位置的圖標設置為比其他位置更大的圖標,以顯示它是總部、最大位置或第一個位置。

      這一個使用兩個自由圖標與檸檬樹地圖樣式和地形圖類型。由于頂部的圖標是圓形的,所以我必須設置大小,否則就顯得太窄了。我在默認情況下保留了底部圖標,以顯示差異。

      實例

      標準的地圖模塊只有灰度調整,所以我們在設計上沒有什么可做的。地圖就在現場,有時根本不合身。與地圖擴展,所有的地圖樣式和字體樣式的選擇,給我們一些良好的機會,風格的地圖,以適應網站。我創造了幾個例子。這些例子的圖片摘自Unsplash.com。

      沙灘婚禮

      這是一個海灘婚禮網站的例子?;槎Y網站需要特定的顏色和字體,他們也受益于谷歌地圖,以幫助你的客人找到合適的地方。除非你能畫出地圖的樣式,否則它可能看上去不合適。這一個使用的光單色地圖風格。字體使用與站點其他部分相同的樣式。信息框被設置為在加載時打開。

      外餐廳

      此示例在覆蓋層中使用帶有文本、圖像和地圖的視差背景。地圖樣式是PixMix。我已經把信息框設置為在裝載時打開。信息框顯示一個白色的背景,但我想要一個更深的背景,以幫助適應與網站的樣式。我使用了在線CSS風格的背景信息框。我把地圖的高度設為600像素。這一個也有一個自定義圖標的針(一個板與刀叉)設置為32×32像素。

      全寬圖

      標準聯系人我們的布局包括一個全寬度地圖。全寬度映射可在全寬度部分中使用。MapExtended模塊不適用于全寬度部分,但是有一種方法可以使其完全寬度。在上面的聯系人示例中,我使用了一個標準部分。我想重新創建這一頁,使之看起來像原版。

      全寬度地圖模塊

      下面是使用全寬度部分和Divi的全寬度地圖模塊的原始頁面。

      全寬映射擴展模塊

      這與使用標準部分和Map擴展模塊的效果相同。我將行設置調整為全寬,將排水溝寬度設置為0,并將0填充用于上、右、下和左。結果看起來與全寬度映射相同。這是設置為路線圖的默認映射。

      額外

      多加就好了。該模塊的反應與標準Map模塊相同,因此您可以相同的方式使用它,而不管您使用的是Divi還是EXTER。

      許可證、更新、支持和文檔

      這個插件可以為你和你的客戶在無限的網站上使用。它包括一年的更新和六個月的支持。

      文檔包含在下載包中。它是一個在瀏覽器中打開的HTML文件,它展示了如何安裝和激活模塊,如何加載地圖樣式,如何在加載時打開信息窗口,如何使用動畫,如何使用自定義圖標,以及如何調整字體設置。它還包括關于如何使用模塊創建全寬度映射而不使用全寬度部分的詳細信息。這些信息包括行設置、使行完全寬度、使用自定義溝槽寬度和使用自定義填充。

      最后思想

      diviMap擴展提供了許多在標準DiviMap模塊中不可用的設計特性。在多種地圖選項和類型之間進行選擇,創建自己的信息框內容和樣式,在加載時顯示信息框,添加自己的引腳,動畫引腳,定義地圖高度,并使地圖完全寬度。所有的特性和調整都是直觀的。如果您能夠輕松地使用Divi模塊,那么您就會覺得在使用這個模塊時很自在。如果您需要自定義您的Divi設計中的地圖,那么DiviMap擴展模塊是值得考慮的。


      相關推薦

      漳州設計網站:如何使用ManageWP管理多個WordPress網站
       

      漳州設計網站:如何使用ManageWP管理多個WordPress網站

      運行一個WordPress網站是很復雜的,但是一次管理幾個網站似乎需要付出巨大的努力。事實上,這可能是太多的工作,你無法處理,除非你知道一個或兩個技巧,以提高你的效率。馬納吉普通過提供一套工具來同時管理多個W...
      2019.04.29
      漳州企業網站建設:為WordPress網站提供10個最佳購物車插件
       

      漳州企業網站建設:為WordPress網站提供10個最佳購物車插件

      為WordPress網站選擇一個購物車插件是最重要的決定之一。畢竟,一個錯誤的或設計不當的插件,如果用戶體驗不佳,就會把用戶拒之門外。對你的底線的影響是不值得考慮的。幸運的是,現代手推車插件不僅僅是客戶在做出...
      2019.04.29
      漳州高端網站建設:divi插件突出顯示-映射擴展模塊
       

      漳州高端網站建設:divi插件突出顯示-映射擴展模塊

      DiviBuilder有一個Map模塊,允許您在Divi設計中顯示Google地圖。這是一個很好的選擇,如果你想要一個標準的谷歌地圖,但它沒有任何調整樣式。如果你想要你的谷歌地圖樣式,你將需要類似DiviMap擴展。diviMap...
      2019.04.29
      漳州企業網站建設:8插件以幫助增壓您的WordPress媒體庫
       

      漳州企業網站建設:8插件以幫助增壓您的WordPress媒體庫

      這個WordPress媒體庫是一個烘焙元素,為您的網站提供基本的媒體文件管理。雖然它的功能集一般對普通用戶來說是足夠的,但是對于媒體密集的網站來說,它的局限性變得越來越明顯。例如,您可能很難找到以前上傳的圖像...
      2019.05.05

      最新文章

      漳州企業網站建設:8插件以幫助增壓您的WordPress媒體庫
       

      漳州企業網站建設:8插件以幫助增壓您的WordPress媒體庫

      這個WordPress媒體庫是一個烘焙元素,為您的網站提供基本的媒體文件管理。雖然它的功能集一般對普通用戶來說是足夠的,但是對于媒體密集的網站來說,它的局限性變得越來越明顯。例如,您可能很難找到以前上傳的圖像...
      2019.05.05
      漳州高端網站建設:divi插件突出顯示-映射擴展模塊
       

      漳州高端網站建設:divi插件突出顯示-映射擴展模塊

      DiviBuilder有一個Map模塊,允許您在Divi設計中顯示Google地圖。這是一個很好的選擇,如果你想要一個標準的谷歌地圖,但它沒有任何調整樣式。如果你想要你的谷歌地圖樣式,你將需要類似DiviMap擴展。diviMap...
      2019.04.29
      漳州企業網站建設:為WordPress網站提供10個最佳購物車插件
       

      漳州企業網站建設:為WordPress網站提供10個最佳購物車插件

      為WordPress網站選擇一個購物車插件是最重要的決定之一。畢竟,一個錯誤的或設計不當的插件,如果用戶體驗不佳,就會把用戶拒之門外。對你的底線的影響是不值得考慮的。幸運的是,現代手推車插件不僅僅是客戶在做出...
      2019.04.29
      漳州設計網站:如何使用ManageWP管理多個WordPress網站
       

      漳州設計網站:如何使用ManageWP管理多個WordPress網站

      運行一個WordPress網站是很復雜的,但是一次管理幾個網站似乎需要付出巨大的努力。事實上,這可能是太多的工作,你無法處理,除非你知道一個或兩個技巧,以提高你的效率。馬納吉普通過提供一套工具來同時管理多個W...
      2019.04.29

      熱門推薦

      選擇您希望漳州網站設計成品的風格偏好,讓我們通過精確的分析與篩選,為您推薦合適的版式布局,
      為此,您可以節省最基本的溝通時間,
      讓我們把有限的時間,充分的用在對行業的分析及您企業網站建設的自身分析上吧
      a一级日本少妇,亚洲AV中文无码字幕色最,亚洲男人第一无码AV网站琪琪
      <u id="c6ayk"><tbody id="c6ayk"><label id="c6ayk"></label></tbody></u>

      <tt id="c6ayk"><noscript id="c6ayk"></noscript></tt>

      <tt id="c6ayk"></tt><source id="c6ayk"><menuitem id="c6ayk"></menuitem></source>
      <strong id="c6ayk"><tbody id="c6ayk"></tbody></strong>

        <tt id="c6ayk"><noscript id="c6ayk"></noscript></tt>
        <rp id="c6ayk"><menuitem id="c6ayk"></menuitem></rp>