（來自雀巢集團）

① 首先在編輯器頁面左側選擇【SVG編輯器】，進入SVG編輯器之后在【互動效果】中搜索組件ID：360，名稱：點擊全文漸進式換內容-自定義觸發，將其放到編輯頁面。

② 我們需要為組件添加圖片，即位移小元素、初始背景圖、變化后背景圖。

在放入位移小元素部分的圖片時，要使用透明底的圖片，且需要與背景圖的寬度保持一致。位移元素部分圖片整體的高度可以按元素高度裁切，不要上下留白太多。

③上傳完位移小元素后，接著就上傳初始背景圖和變化后背景圖。(這里所有圖片需要寬度一致，并且變化前后背景圖的總高度需要保持一致）

添加好初始背景圖就需要為圖片設置觸發點擊切換的區域，拖拽紅色虛線區域，即可改變觸發區域的大小和位置。

接著再添加變化后的背景圖即可。

④ 全部圖片設置完成后，就需要調整組件細節，包括動畫漸變時長和元素移入時長，以及新舊內容分隔線位置。

新舊內容分割線是指設置分割線在位移小元素圖片高度占比的位置，比如設置為50%，分割線就在小元素圖片的中間位置；設置為100%，分割線就在小元素圖片底部。

⑤ 整個SVG組件的內容制作好之后，選擇右上角的【同步】【導出】就可以導入到公眾號后臺了。