Kadence 教學(xué):如何在Kadence主題中創(chuàng)建和設(shè)置通知欄

WordPress網(wǎng)站建設(shè)過程中,添加一個(gè)通知欄可以有效提升網(wǎng)站的轉(zhuǎn)化率,特別是當(dāng)需要推廣促銷活動(dòng)、在線課程、服務(wù),或是免費(fèi)資源(如電子書、清單等)時(shí)。使用Kadence主題,商家可以輕松地設(shè)置一個(gè)引人注目的通知欄。

圖片[1]-如何在Kadence主題中創(chuàng)建和設(shè)置通知欄

安裝Kadence主題和插件

首先,需要安裝Kadence主題及其高級(jí)插件。Kadence提供了強(qiáng)大的自定義選項(xiàng),可以通過訪問Kadence官網(wǎng)購買插件,或選擇購買Kadence Pro包以獲得更多功能。

WordPress后臺(tái)的插件管理界面,點(diǎn)擊“添加新插件”,上傳并安裝Kadence高級(jí)插件。安裝后,激活插件并輸入許可證密鑰。

圖片[2]-如何在Kadence主題中創(chuàng)建和設(shè)置通知欄

激活Kadence主題的元素選項(xiàng)

Kadence主題設(shè)置中,激活元素選項(xiàng)是必要的,以啟用通知欄功能。以下是操作步驟:

  • 前往“外觀”>“Kadence”。
  • 啟用“元素”選項(xiàng)。

啟用后,商家將在設(shè)置中看到一個(gè)新選項(xiàng)——“元素”。點(diǎn)擊添加新元素,便可開始添加通知欄。

圖片[3]-如何在Kadence主題中創(chuàng)建和設(shè)置通知欄

設(shè)計(jì)通知欄

使用Kadence的列布局功能設(shè)計(jì)通知欄。操作步驟如下:

  • 創(chuàng)建一個(gè)新元素,選擇“固定”布局來制作粘性通知欄。
圖片[4]-如何在Kadence主題中創(chuàng)建和設(shè)置通知欄
  • 添加一個(gè)兩列布局,并調(diào)整準(zhǔn)備設(shè)置按鈕和倒計(jì)時(shí)的區(qū)塊大小。
圖片[5]-如何在Kadence主題中創(chuàng)建和設(shè)置通知欄
  • 設(shè)置背景顏色、字體顏色等,以與網(wǎng)站整體風(fēng)格相匹配。
圖片[6]-如何在Kadence主題中創(chuàng)建和設(shè)置通知欄

設(shè)置完之后就是這個(gè)樣子:

圖片[7]-如何在Kadence主題中創(chuàng)建和設(shè)置通知欄

在通知欄中添加倒計(jì)時(shí)和文本內(nèi)容

首先,設(shè)置背景顏色并添加倒計(jì)時(shí)內(nèi)容。步驟如下:

  • 點(diǎn)擊并添加一個(gè)新塊,搜索并選擇倒計(jì)時(shí)塊。
圖片[8]-如何在Kadence主題中創(chuàng)建和設(shè)置通知欄
  • 為促銷活動(dòng)設(shè)置倒計(jì)時(shí),例如一個(gè)為期七天的倒計(jì)時(shí)。
圖片[9]-如何在Kadence主題中創(chuàng)建和設(shè)置通知欄

添加前置文本

在倒計(jì)時(shí)前添加說明文本,步驟如下:

  • 在倒計(jì)時(shí)布局中,搜索并添加前置文本。
  • 輸入文本內(nèi)容,例如:“時(shí)間快要結(jié)束,趕快享受年度最佳優(yōu)惠,25%折扣”。
圖片[10]-如何在Kadence主題中創(chuàng)建和設(shè)置通知欄
  • 將文本設(shè)置為行內(nèi)模式,使倒計(jì)時(shí)和文本在同一行顯示。
圖片[11]-如何在Kadence主題中創(chuàng)建和設(shè)置通知欄
圖片[12]-如何在Kadence主題中創(chuàng)建和設(shè)置通知欄

調(diào)整文本顏色

如果需要,可以調(diào)整文本的顏色,以確保其與背景的對(duì)比度合適,步驟如下:

  • 在行布局設(shè)置中,將文本顏色設(shè)置為白色,以確保文本清晰可見。
圖片[13]-如何在Kadence主題中創(chuàng)建和設(shè)置通知欄

這樣,就可以完成倒計(jì)時(shí)和文本的設(shè)置,讓它們?cè)谕ㄖ獧谥邪葱栾@示。

添加按鈕

在通知欄中,按鈕將引導(dǎo)用戶進(jìn)一步操作,例如鏈接到促銷頁面或聯(lián)系頁面。

  • 添加一個(gè)按鈕并設(shè)置按鈕文本,如“立即獲取折扣”。
圖片[14]-如何在Kadence主題中創(chuàng)建和設(shè)置通知欄
  • 在按鈕設(shè)置中,鏈接到目標(biāo)頁面(例如促銷頁面或聯(lián)系方式頁面)。
圖片[15]-如何在Kadence主題中創(chuàng)建和設(shè)置通知欄

設(shè)置通知欄的位置

將通知欄固定在頁面頂部,并設(shè)置延遲顯示距離。這樣,在用戶滾動(dòng)頁面時(shí),通知欄仍能保持可見。

  • 在元素設(shè)置中,選擇“固定在頂部”。
圖片[16]-如何在Kadence主題中創(chuàng)建和設(shè)置通知欄
  • 設(shè)置延遲顯示的像素值,例如100像素,讓通知欄在頁面滾動(dòng)一定距離后顯示。
圖片[17]-如何在Kadence主題中創(chuàng)建和設(shè)置通知欄
  • 選擇“跨所有頁面顯示”,使通知欄出現(xiàn)在網(wǎng)站的每一頁。
圖片[18]-如何在Kadence主題中創(chuàng)建和設(shè)置通知欄

設(shè)置通知欄過期時(shí)間

可為通知欄設(shè)置過期時(shí)間,確保其在促銷結(jié)束后自動(dòng)消失。這對(duì)限時(shí)活動(dòng)非常適用。

  • 啟用“過期設(shè)置”選項(xiàng)。
圖片[19]-如何在Kadence主題中創(chuàng)建和設(shè)置通知欄
  • 設(shè)置通知欄的過期日期,例如七天后,促銷結(jié)束時(shí),通知欄會(huì)自動(dòng)消失。

發(fā)布并查看效果

完成所有設(shè)置后,點(diǎn)擊“發(fā)布”,然后檢查網(wǎng)站效果。滾動(dòng)頁面查看固定在頂部的通知欄,確保其按照設(shè)定正確顯示。

圖片[20]-如何在Kadence主題中創(chuàng)建和設(shè)置通知欄

總結(jié)

通過使用Kadence高級(jí)插件和Kadence Blocks,商家可以輕松設(shè)置一個(gè)功能強(qiáng)大的通知欄,用于宣傳促銷、引導(dǎo)用戶注冊(cè)或推送其他信息。簡(jiǎn)化的設(shè)置步驟使得創(chuàng)建通知欄更加高效,能夠有效提升轉(zhuǎn)化率并吸引更多訪客參與活動(dòng)或訂閱服務(wù)。


聯(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é)假日休息
? 轉(zhuǎn)載聲明
本文作者:賊將鼠膽
THE END
喜歡就支持一下吧
點(diǎn)贊831 分享
評(píng)論 搶沙發(fā)

請(qǐng)登錄后發(fā)表評(píng)論

    暫無評(píng)論內(nèi)容