精彩的引導(dǎo)卡片 - WordPress區(qū)塊

這樣有趣的效果實(shí)現(xiàn)僅有4.74KB，僅由HTML和CSS實(shí)現(xiàn)，無論是手機(jī)、平板還是計(jì)算機(jī)電腦， 她將始終舒適優(yōu)美的展示給您的訪客。在這次分享的wordpress美化中 理論上，您可以將她放到任何位置。

• 代碼來源：https://www.zaxu.com/theme/

效果如下

注意事項(xiàng)

其中一個(gè)按鈕提供了拉起QQ的功能，這在《百度搜索白皮書》中是不提倡的，還請(qǐng)各位站長(zhǎng)依具體情況進(jìn)行修改。

使用方法

點(diǎn)擊下方的Demo按鈕，右擊鼠標(biāo)查看源代碼，根據(jù)代碼注釋復(fù)制代碼到自己需要的地方，例如古登堡的HTML區(qū)塊或是小工具里面的“自定義HTML”，另外，記得看代碼注釋哦(。???)ノ

視頻教程

我準(zhǔn)備了兩份教程，一份是默認(rèn)用戶，一份是B2主題的用戶。

默認(rèn)用戶

點(diǎn)擊文章底部提供Demo按鈕后，在打開的頁面中點(diǎn)擊鼠標(biāo)右鍵查看源代碼，根據(jù)代碼注釋復(fù)制需要的代碼。將代碼中的內(nèi)容修改成自己的，然后在wordpress后臺(tái) → 頁面 → 新建頁面，如下圖：

選擇區(qū)塊 → 格式 → 自定義HTML，將下載的文件用記事本打開，將打開的文件中的內(nèi)容全部復(fù)制，黏貼至區(qū)塊中。

發(fā)布此頁面后即可看到演示效果

B2用戶

基于強(qiáng)大的B2主題，B2用戶可以拓展更多有趣的玩法。在首頁模塊中添加新的模塊，在 調(diào)用內(nèi)容 中選擇廣告位模塊，如下圖：

將代碼中的相關(guān)信息修改為自己的內(nèi)容后填充即可。

代碼及如何修改如下：

如果你使用VS Code或者其他的代碼工具（文本文檔）打開文件，請(qǐng)你注意以下幾行：

1號(hào)和4號(hào)的白字可更換為您自己的文字，

2號(hào)處的數(shù)字可更換為自己的QQ號(hào)碼，為主題咨詢打開的鏈接。

3號(hào)處的鏈接請(qǐng)更換為自己需要的URL地址，對(duì)應(yīng)主題發(fā)現(xiàn)按鈕。

黑灰版

這一版加了背景圖片，截圖可能看的不是很明顯。

感覺這一版太華麗了？想要一個(gè)簡(jiǎn)單點(diǎn)的，最好還是能放在小工具的那種？滿足你，您可以參考下文的wordpress美化教程：

精彩的引導(dǎo)卡片 - WordPress區(qū)塊

Muze

• 20年2月18日
• 喜歡：0
• 瀏覽：1.5k

精彩的引導(dǎo)卡片Demo

灰黑版下載

下載權(quán)限

查看

• ￥
  免費(fèi)下載
  評(píng)論并刷新后下載
  登錄后下載

查看演示

• {{attr.name}}：

您當(dāng)前的等級(jí)為

登錄后免費(fèi)下載登錄 小黑屋反思中，不準(zhǔn)下載！ 評(píng)論后刷新頁面下載評(píng)論 支付以后下載 請(qǐng)先登錄 您今天的下載次數(shù)（次）用完了，請(qǐng)明天再來 支付積分以后下載立即支付 支付以后下載立即支付 您當(dāng)前的用戶組不允許下載升級(jí)會(huì)員

您已獲得下載權(quán)限 您可以每天下載資源次，今日剩余次