Kadence Blocks 2.2.4 添加 Lottie 動畫塊

Kadence 積木,一個流行的塊收集插件,添加 一個新的 Lottie 動畫塊 今天在 2.2.4 版中。 插件中的大多數塊都提供常用的頁面構建功能,如行、按鈕、畫廊和推薦。 Lottie Animations 塊引入了一些更有趣和異想天開的東西。

由設計團隊開發 愛彼迎, Lottie 是一種輕量級的開源動畫文件格式,深受開發人員和設計人員的歡迎。 它比舊的動態圖形格式更輕,操作更快。 基於矢量的格式允許在不損失質量的情況下放大或縮小動畫。 這 樂天文件 平台是一個社區,設計師和開發人員在這裡分享他們的創作供其他人使用。

Kadence Blocks 的新 Lottie 塊使 WordPress 用戶可以輕鬆使用和自定義 Lottie 動畫。 這不是第一個提供它們的插件。 Lottie 動畫可供 Elementor Pro 用戶使用,並包含在其他一些集合中,例如 Otter 的 Gutenberg Blocks 和模板庫和 Gutenberg 的 Ultimate Addons,以及 Lottie Player 插件。

Lottie 動畫可以通過將 oembed 鏈接粘貼到編輯器中或使用 embed 塊添加到 WordPress 內容中,如您在此頁面上看到的那樣。 以這種方式使用它們的缺點是您不會獲得任何用於編輯它們的外觀和動作的控制項。

Kadence Block 的實現在插件的免費版本中,包括用於進一步自定義動畫的塊控制項。 用戶可以調整播放設置,例如自動播放、打開/關閉控制項,以及更改播放速度和循環設置。 動畫的大小、填充和邊距都可以自定義。

kadence-blocks-2-2-4-adds-lottie-animations-block Kadence Blocks 2.2.4 添加 Lottie 動畫塊

首次使用該塊時,默認情況下會顯示一個動畫 WordPress 徽標佔位符,但如果您找到想要使用的 URL,您可以將塊設置中的 URL 替換為 LottieFiles 中的 URL。

可以使用遠程 URL(可能是最常見的)或使用本地文件在塊中引用動畫。 該功能還有自己的管理屏幕,您可以在其中管理所有動畫。

這些控制項展示了動畫的可擴展性——無論它們是設置為全寬還是縮小為一個小圖標。 它們對塊對齊控制項響應良好,可用於允許塊的任何內容,甚至在模板中。

該塊需要 Lottie Player JS 載入和解析基於 JSON 的動畫,但 Kadence WP 代表 Kathy Zant 表示,與以前的動畫技術相比,性能影響不大。

LottieFiles 動畫可以在網站上編輯以更改背景顏色或編輯動畫層顏色。 用戶可以將更新後的文件導出為 Lottie JSON 以導入到塊中。 作為從頭開始創建自己的 Lottie 動畫的替代方法,這可能是重新著色現有動畫以匹配您的品牌的一種方法。 這些文件可以下載並導入 Kadence Lottie 模塊,以添加可在任何設備上運行的引人入勝的動畫。

來源

相關文章