WordPress 圖片比較功能使用教學

WordPress 圖片比較功能使用教學
作者:Jin

WordPress 自從區塊編輯器更新以來加入了許多不少便利排版、美化版面的功能,其中有一項「圖片比較」功能也是相當方便,尤其是對於有些美妝、產品等等…結果前、後的比較來說,能夠讓使用者觀看時容易清楚的知道及比較圖片。

使用版本:WordPress 5.8 自架版本
使用工具:區塊編輯器
注意事項:需搭配 JetPack 外掛。

首先點選左上角(1)或者內文(2)中的【+】來增加區塊。

WordPress 圖片比較功能使用教學

選擇【圖片比較】工具,呈現綠色就代表需安裝 JetPack 外掛才能出現及使用。

WordPress 圖片比較功能使用教學

然後選擇或上傳兩張要前後比較的圖片。

比較前 before (1)、比較後 After(2)

WordPress 圖片比較功能使用教學

兩張圖片選擇完之後就能看到比較圖片前後的功能,能夠藉由中間那條線來滑動進行圖片【並排】前後比較。

WordPress 圖片比較功能使用教學

此外也能夠選擇以【上下方向】來進行圖片比較顯示。

WordPress 圖片比較功能使用教學

 

圖片比較範例

想試玩此功能的可以藉由下方圖片來滑動看看。

WordPress 圖片比較功能使用教學WordPress 圖片比較功能使用教學

相關文章
作者簡介
個人頭像照片
努力寫文中!