深入解析BoxShop主題:自定義模塊和高級DIY技巧(05)

上期我們講述了怎么用WPBakery Page Builder來編輯BoxShop主題,今天,我們將深入探討B(tài)oxShop主題所提供的各種模塊以及如何進(jìn)行高級自定義,幫助您充分利用這些強(qiáng)大的功能來提升網(wǎng)站的功能性和視覺效果。

步驟:網(wǎng)站后端→WPBakery Page Builder→+

圖片[1]-深入解析BoxShop主題:自定義模塊和高級DIY技巧(05)-光子波動網(wǎng) | 專業(yè)WordPress修復(fù)服務(wù),全球范圍,快速響應(yīng)

如下圖,其他頁面都在basel主題, 有講過,今天我們主要講述主題帶的模塊

圖片[2]-深入解析BoxShop主題:自定義模塊和高級DIY技巧(05)-光子波動網(wǎng) | 專業(yè)WordPress修復(fù)服務(wù),全球范圍,快速響應(yīng)

你們肯定很好奇,為什么所有的模塊都帶有TS的開頭,如下圖

圖片[3]-深入解析BoxShop主題:自定義模塊和高級DIY技巧(05)-光子波動網(wǎng) | 專業(yè)WordPress修復(fù)服務(wù),全球范圍,快速響應(yīng)

如下圖,這個主題叫sky(天空),這里就是主題的模塊了,這個主題的創(chuàng)始人一定很向往天空

圖片[4]-深入解析BoxShop主題:自定義模塊和高級DIY技巧(05)-光子波動網(wǎng) | 專業(yè)WordPress修復(fù)服務(wù),全球范圍,快速響應(yīng)

常見的模塊就不講了,我們講述不常見的,但你又不能理解的
步驟:網(wǎng)站后端→WPBakery Page Builder→TS Feature

圖片[5]-深入解析BoxShop主題:自定義模塊和高級DIY技巧(05)-光子波動網(wǎng) | 專業(yè)WordPress修復(fù)服務(wù),全球范圍,快速響應(yīng)

如上圖,比如第一個TS Feature(功能),你肯定疑惑這個能做什么呢

圖片[6]-深入解析BoxShop主題:自定義模塊和高級DIY技巧(05)-光子波動網(wǎng) | 專業(yè)WordPress修復(fù)服務(wù),全球范圍,快速響應(yīng)

如上圖,我們看到有圖標(biāo)的class和標(biāo)題還有描述,我給你看一張圖,你就知道了,但不是每個模版都適合,我只是展示給你看他能做什么

圖片[7]-深入解析BoxShop主題:自定義模塊和高級DIY技巧(05)-光子波動網(wǎng) | 專業(yè)WordPress修復(fù)服務(wù),全球范圍,快速響應(yīng)

如上圖,這就是容器一分為三,分別添加了,一個圖標(biāo)和標(biāo)題和描述。當(dāng)然如果你不會設(shè)置的話,就會出現(xiàn)下面的效果

圖片[8]-深入解析BoxShop主題:自定義模塊和高級DIY技巧(05)-光子波動網(wǎng) | 專業(yè)WordPress修復(fù)服務(wù),全球范圍,快速響應(yīng)

步驟:網(wǎng)站后端→WPBakery Page Builder→TS Price Table
TS Price Table(價格表)

圖片[9]-深入解析BoxShop主題:自定義模塊和高級DIY技巧(05)-光子波動網(wǎng) | 專業(yè)WordPress修復(fù)服務(wù),全球范圍,快速響應(yīng)
圖片[10]-深入解析BoxShop主題:自定義模塊和高級DIY技巧(05)-光子波動網(wǎng) | 專業(yè)WordPress修復(fù)服務(wù),全球范圍,快速響應(yīng)

這個模塊一般是用不上的,但你們可以想象一下他可以用做啥,歡迎探討

圖片[11]-深入解析BoxShop主題:自定義模塊和高級DIY技巧(05)-光子波動網(wǎng) | 專業(yè)WordPress修復(fù)服務(wù),全球范圍,快速響應(yīng)

TS Testimonial(感言):可以用來作為評價展示,如下圖

圖片[12]-深入解析BoxShop主題:自定義模塊和高級DIY技巧(05)-光子波動網(wǎng) | 專業(yè)WordPress修復(fù)服務(wù),全球范圍,快速響應(yīng)
圖片[13]-深入解析BoxShop主題:自定義模塊和高級DIY技巧(05)-光子波動網(wǎng) | 專業(yè)WordPress修復(fù)服務(wù),全球范圍,快速響應(yīng)

在模塊里,只能設(shè)置展示數(shù)量和其他的設(shè)置,但內(nèi)容并不在這里設(shè)置,需要到網(wǎng)站后端面的Testimonials里面的編輯更換頭像或者內(nèi)容,如下圖,你是否看到每一個有三個重復(fù)的,這是因?yàn)閷?dǎo)入模版的時候起碼導(dǎo)入了三次,所以我們需要替換或者刪除它

圖片[14]-深入解析BoxShop主題:自定義模塊和高級DIY技巧(05)-光子波動網(wǎng) | 專業(yè)WordPress修復(fù)服務(wù),全球范圍,快速響應(yīng)


步驟:網(wǎng)站后端→WPBakery Page Builder→TS Product Deals slider或TS Products widget
TS Products widget(產(chǎn)品小部件)和TS Product Deals slider(產(chǎn)品優(yōu)惠滑塊)

圖片[15]-深入解析BoxShop主題:自定義模塊和高級DIY技巧(05)-光子波動網(wǎng) | 專業(yè)WordPress修復(fù)服務(wù),全球范圍,快速響應(yīng)

請注意產(chǎn)品小部件是可以展示產(chǎn)品獨(dú)特的功能,比如打折或者什么專區(qū)配合圖片,如下圖

圖片[16]-深入解析BoxShop主題:自定義模塊和高級DIY技巧(05)-光子波動網(wǎng) | 專業(yè)WordPress修復(fù)服務(wù),全球范圍,快速響應(yīng)

產(chǎn)品優(yōu)惠滑塊是需要產(chǎn)品在上架產(chǎn)品的時候設(shè)置了打折價格和打折時間才會有顯示的

圖片[17]-深入解析BoxShop主題:自定義模塊和高級DIY技巧(05)-光子波動網(wǎng) | 專業(yè)WordPress修復(fù)服務(wù),全球范圍,快速響應(yīng)

步驟:網(wǎng)站后端→WPBakery Page Builder→TS Products in Categary Tabs或TS Products in Categary Tabs 2

TS Products in Categary Tabs(分類標(biāo)簽中的 TS 產(chǎn)品 )

TS Products in Categary Tabs 2(分類標(biāo)簽中的 TS 產(chǎn)品 2)

這個就是在一個模塊可以展示多個分類,類似于之前提到的選項(xiàng)卡

圖片[18]-深入解析BoxShop主題:自定義模塊和高級DIY技巧(05)-光子波動網(wǎng) | 專業(yè)WordPress修復(fù)服務(wù),全球范圍,快速響應(yīng)
圖片[19]-深入解析BoxShop主題:自定義模塊和高級DIY技巧(05)-光子波動網(wǎng) | 專業(yè)WordPress修復(fù)服務(wù),全球范圍,快速響應(yīng)
圖片[20]-深入解析BoxShop主題:自定義模塊和高級DIY技巧(05)-光子波動網(wǎng) | 專業(yè)WordPress修復(fù)服務(wù),全球范圍,快速響應(yīng)

兩張不同的風(fēng)格,以及選項(xiàng)可以在上面和側(cè)面,大家根據(jù)實(shí)際情況調(diào)整

圖片[21]-深入解析BoxShop主題:自定義模塊和高級DIY技巧(05)-光子波動網(wǎng) | 專業(yè)WordPress修復(fù)服務(wù),全球范圍,快速響應(yīng)

如上圖設(shè)置橫向或者豎向的選項(xiàng)

總結(jié)

本期的教程到此結(jié)束。希望通過今天的詳細(xì)講解,您已經(jīng)對BoxShop主題的模塊和自定義選項(xiàng)有了更深入的了解和掌握。下期我們將繼續(xù)探討B(tài)oxShop主題的其他高級功能和更多細(xì)節(jié)操作,敬請期待!


聯(lián)系我們
教程看不懂?聯(lián)系我們?yōu)槟赓M(fèi)解答!免費(fèi)助力個人,小企站點(diǎn)!
客服微信
客服微信
電話:020-2206-9892
QQ咨詢:1025174874
郵件:info@361sale.com
工作時間:周一至周五,9:30-18:30,節(jié)假日休息
? 轉(zhuǎn)載聲明
本文作者:Harry
THE END
喜歡就支持一下吧
點(diǎn)贊0 分享
評論 搶沙發(fā)

請登錄后發(fā)表評論

    暫無評論內(nèi)容