今天三兒為大家?guī)淼膬善恼露紒碜匀赋财放疲赋驳闹染筒挥梦叶嘟榻B了，那作為一個(gè)家喻戶曉的品牌，他們的宣傳推廣的文章又有哪些值得我們學(xué)習(xí)的呢，三兒都給大家拆解分析好了，就等大家來學(xué)習(xí)了解啦~

這兩篇文章都用到了同一款SVG效果——【圖片彈窗自定義多個(gè)觸發(fā)區(qū)】，兩篇文章根據(jù)不同的主題，將此效果與推文內(nèi)容結(jié)合的非常到位，話不多說，接下來三兒就帶大家來認(rèn)識(shí)這款寶藏SVG。

gif圖展示

《黑色的Ta，最百塔》

點(diǎn)擊綠色文字跳轉(zhuǎn)

這篇文章介紹的是雀巢咖啡系列產(chǎn)品，圍繞這個(gè)主題，推文分享了多款咖啡產(chǎn)品與其他食材進(jìn)行DIY的可能性，產(chǎn)品介紹圖并沒有平鋪直敘展示，而是做成卡片的形態(tài)，并借助圖片彈窗SVG，引導(dǎo)用戶點(diǎn)擊之后再彈出咖啡產(chǎn)品圖。提高了推文的神秘感和趣味性。

從上述兩個(gè)案例中我們可以看出，圖片彈窗SVG效果具有很強(qiáng)的可玩性，無論是應(yīng)用在產(chǎn)品介紹類推文，還是合作宣傳推文都能適配。它能將需要展示的主體圖片，隱匿在首圖下，從而引起用戶的閱讀興趣，促進(jìn)用戶去點(diǎn)擊查看。大家如果在排版過程中想要增加文章的趣味性和創(chuàng)意度，不妨多試試這個(gè)效果。

此款SVG除了做成卡片、盲盒外，還可以做成紅包等形式，具體要根據(jù)自己的內(nèi)容主題來設(shè)計(jì)。將此款效果應(yīng)用在節(jié)日節(jié)氣的推文中，比如新年拆紅包、雙11購物節(jié)的拆禮盒等，或者品牌方的新產(chǎn)品宣傳推文中。

這兩篇案例用到的SVG效果為圖片彈窗自定義多個(gè)觸發(fā)區(qū)，ID：55，三兒為大家講解此款效果具體的制作方法。

在SVG頁面的【互動(dòng)效果】的搜索框輸入55，或者是“圖片彈窗”關(guān)鍵詞，放入到編輯頁面。

① 首先為SVG組件添加前景圖。比如像雀巢案例一中的推文所用到的前景圖為動(dòng)態(tài)的卡片形式。

② 準(zhǔn)備好需要彈出的圖片，大家可以根據(jù)自己前景圖來設(shè)置。將彈出的圖片添加進(jìn)去。每添加一張彈出圖片，就要為其設(shè)置控制熱區(qū)。

③ 拖拽紅色虛線部分調(diào)整控制區(qū)域的范圍，移動(dòng)熱區(qū)到你需要用戶點(diǎn)擊的位置。

④ 注意：如果需要放置gif圖，gif圖的寬高不能超過1000px。

⑤ 制作完成之后，選擇右上角的【同步】【導(dǎo)出】到微信公眾號后臺(tái)即可。