【公眾號(hào)排版】如何使用SVG組件制作拆盲盒和問答解析效果
掌握SVG組件的神奇力量,輕松實(shí)現(xiàn)公眾號(hào)文章中的互動(dòng)效果!本文詳細(xì)介紹了如何使用135編輯器中的SVG組件來創(chuàng)建拆盲盒和問答解析效果,包括詳細(xì)的操作步驟和技巧。立即學(xué)習(xí)如何為你的新媒體運(yùn)營(yíng)增添動(dòng)力,提升用戶體驗(yàn),讓內(nèi)容更具吸引力。
快點(diǎn)擊足球盲盒,看看你能領(lǐng)取到什么樣的足球手辦(只有一次機(jī)會(huì)哦,想要再拆盲盒需要刷新文章)
覺得盲盒不盡興,還想再來點(diǎn)別的?沒問題三兒也為你準(zhǔn)備了,快來測(cè)一測(cè)你是屬于哪種花吧??
注:此效果不能實(shí)現(xiàn)【返回】,所以很適合“抽獎(jiǎng)”、“單項(xiàng)選擇”等具有唯一性的事件。
#在135編輯器左側(cè)入口中進(jìn)入svg編輯器。
#或是直接在瀏覽器中輸入svg編輯器官網(wǎng)網(wǎng)址進(jìn)入:
http://qwer.com.cn/
#查找組件我們一般有兩種思路:
一是直接輸入組件ID,準(zhǔn)確、快捷但前提是你能記住每個(gè)組件的ID;
二是根據(jù)效果來選擇,我們這個(gè)效果很明顯是一個(gè)【點(diǎn)擊】效果,那么我們?cè)诜诸愔羞x擇【點(diǎn)擊】
#我們可以看到關(guān)于【單擊】的效果組件有許多,就需要我們慢慢查找了。
#找到我們本次需要使用的效果組件:?jiǎn)芜x答案解析類答題效果 組件id:189
#將組件添加至編輯區(qū)域。
#在我們添加圖片時(shí),我們一定要看素材要求,根據(jù)要求制作圖片,這樣才能確保效果的完美展示。
#制作完符合素材要求的圖片后,我們就可以添加【背景圖】和答案圖片了。
背景圖示例??
答案圖示例??
#每上傳一張【答案圖】時(shí),背景圖都會(huì)對(duì)應(yīng)顯示一個(gè)紅色的選項(xiàng)熱區(qū),將這個(gè)熱區(qū)移動(dòng)到【背景圖】對(duì)應(yīng)的位置,調(diào)整好觸發(fā)區(qū)域大小,即可實(shí)現(xiàn)點(diǎn)擊該區(qū)域顯示上傳的答案圖??
#設(shè)置完成后的svg文章效果可以通過使用【同步】或【導(dǎo)出】功能,保存到微信公眾號(hào)平臺(tái)
以上就是
【單選答案解析類答題效果】
全部?jī)?nèi)容啦
看會(huì)了的小伙伴
今天就操練起來
給領(lǐng)導(dǎo)一個(gè)驚喜和一個(gè)漲薪的理由吧
下一期你還想學(xué)什么
可以在評(píng)論區(qū)留言哦
明天見~
·END·
文章排版由135編輯器提供技術(shù)支持
■ ■ ■ ■
立即登錄