在上一期中，我們探討了Avada主題中的基本模塊設(shè)置，相信大家已經(jīng)對(duì)其有了一定的了解。今天，我們將繼續(xù)講解一些更為特別的模塊，如WooCommerce產(chǎn)品輪播、產(chǎn)品網(wǎng)格和圖片熱點(diǎn)模塊。這些模塊為展示產(chǎn)品、功能特點(diǎn)提供了更靈活的選擇，讓你的網(wǎng)站能夠更加豐富多樣地展示內(nèi)容。接下來(lái)，讓我們一起深入了解這些特別模塊的設(shè)置和應(yīng)用場(chǎng)景

如果我們需要展示產(chǎn)品，我們可以選擇WooCommerce和主題一起聯(lián)合的模塊

我們加入一個(gè)Woo ProductCarousel（產(chǎn)品輪播）

輪播就是一行的產(chǎn)品在滑動(dòng)的意思，如果你需要這種效果可以考慮這種模塊

左側(cè)可以設(shè)置他的布局，以及展示多少產(chǎn)品多少列，還有在這個(gè)模塊展示的一些元素，比如分類，標(biāo)簽，價(jià)格，按鈕等等，這就不一一講了，直接翻譯即可了解

如果你覺(jué)得這個(gè)效果你不喜歡

你還可以選擇Woo ProductGrid(產(chǎn)品網(wǎng)格）

設(shè)置都是差不讀的，這里就不一一解釋了，但每個(gè)模塊的設(shè)置功能也有一定的區(qū)別，比如上面輪播模塊他只有一個(gè)設(shè)置區(qū)域，沒(méi)有設(shè)置顏色和動(dòng)態(tài)效果的，但下面的產(chǎn)品網(wǎng)格他是有這個(gè)設(shè)計(jì)（Design）和動(dòng)態(tài)效果的設(shè)置的，所以你看實(shí)際情況，你需要功能豐富的拿肯定是下面這個(gè)

接下來(lái)我們講述一個(gè)圖片熱點(diǎn)模塊（Image Hotspots）

這個(gè)模塊一般應(yīng)用在哪里呢，如果你需要在圖片上設(shè)置分布點(diǎn)，就是錨點(diǎn)，比如地圖，你的銷售點(diǎn)，以及你介紹這個(gè)產(chǎn)品的特性都可以用這個(gè)模塊

這里我們使用蘋果的標(biāo)志作為演示，背景圖片也是隨機(jī)的

那么我們?cè)趺慈ピO(shè)置呢

Item：就是圖中的錨點(diǎn)，你可以這樣理解，我設(shè)置了三個(gè)，你可以根據(jù)你的需要設(shè)置更多

點(diǎn)擊編輯后，可以設(shè)置他的位置，拖動(dòng)查看右側(cè)的效果，橫向和豎向，但建議調(diào)整好item的圖標(biāo)和顏色后，再來(lái)拖動(dòng)，因?yàn)槿绻幻黠@或者被背景遮蓋會(huì)錯(cuò)過(guò)實(shí)時(shí)效果，如下圖

然后我們還可以設(shè)置item的圖標(biāo)，以及觸碰的文本

Triggering Text：是直接顯示的文本

Popover Heading：是觸碰到item才會(huì)顯示，這個(gè)是標(biāo)題
Popover Content: 這個(gè)是描述

第二個(gè)General: 在這里設(shè)置背景圖片和寬度還有位置，如上圖

以及設(shè)計(jì)（Design）這里設(shè)計(jì)item某一部分的顏色，還有他的動(dòng)畫效果

需要每一步都到位，才會(huì)有很好的效果，請(qǐng)記住這個(gè)步驟

總結(jié)

通過(guò)本期內(nèi)容，你應(yīng)該對(duì)Avada主題中的這些特別模塊有了更加清晰的認(rèn)識(shí)。無(wú)論是展示產(chǎn)品的WooCommerce模塊，還是具備互動(dòng)效果的圖片熱點(diǎn)模塊，Avada提供的多樣化工具可以幫助你更好地提升網(wǎng)站的用戶體驗(yàn)。希望這期內(nèi)容對(duì)你有所幫助，歡迎留言或者聯(lián)系我們，下期我們將繼續(xù)分享更多Avada主題的技巧與實(shí)用方法。

聯(lián)系我們
教程看不懂？聯(lián)系我們?yōu)槟赓M(fèi)解答！免費(fèi)助力個(gè)人，小企站點(diǎn)！	客服微信
① 電話：020-2206-9892
② QQ咨詢：1025174874
③ 郵件：info@361sale.com
④ 工作時(shí)間：周一至周五，9:30-18:30，節(jié)假日休息