معرفی بلوک Kadence Lottie

تیم Kadence برای معرفی Lottie Block، یک بلوک جدید که در Kadence Blocks نسخه 2.2.4+ موجود است، هیجان زده است. این واحد جدید به صاحبان سایت هایی که از Kadence Blocks استفاده می کنند فرصت های جدیدی را برای اضافه کردن انیمیشن های با کیفیت بالا و باند پایین به وب سایت های خود می دهد. Kadence Blocks 2.2.4 همچنین بلوک Count Up جدید را معرفی می کند و یک انیمیشن شمارش معکوس یا بازگشت به مقادیر خاص اضافه می کند.

فرصت های جدید انیمیشن با Lottie Animations

انیمیشن های وب سایت قدرت باورنکردنی در جذب مخاطب و جلب توجه به اهداف تبدیل دارند، اما فناوری قبلی برای افزودن انیمیشن اغلب با تجربه بصری با کیفیت پایین و اندازه فایل های بزرگ همراه بود. از GIF های متحرک از طریق Adobe Flash گرفته تا فرمت های ویدیویی مختلف، فناوری های انیمیشن قبلی مشکلاتی را بیش از آنچه ارزش داشتند ایجاد کردند.

توسعه‌دهندگان Airbnb فناوری جدیدی به نام Lottie ایجاد کرده‌اند که انیمیشن‌های باکیفیت و بدون هزینه اضافی برای پهنای باند بالا ارائه می‌کند. پس از توسعه، این توسعه دهندگان متن باز خود را منتشر کردند. فایل‌های Lottie نه تنها منبع باز هستند، اندازه بسیار کوچک و کیفیت بالایی دارند، بلکه تعاملی هستند و می‌توان آنها را در زمان اجرا دستکاری کرد. طبق گفته LottieFiles، “500 برنامه برتر در فروشگاه App iOS در حال حاضر از Lottie برای تعامل با کاربران و بهبود تبدیل ها استفاده می کنند.”

اکنون با Kadence Lottie Block در Kadence Blocks، صاحبان سایت های وردپرس این توانایی را دارند که از انیمیشن برای ایجاد تجربیات بهتر و جذاب تر برای بازدیدکنندگان سایت استفاده کنند.

لوتی چیست؟

لوتی به افتخار کارگردان آلمانی لوته راینیگر نامگذاری شده است. راینیگر بزرگترین پیشگام انیمیشن سیلوئت است که با ماجراهای شاهزاده احمد که در سال 1926 اکران شد، شناخته شده است. این فیلم قدیمی ترین انیمیشن تمام طول باقیمانده است که قبل از فیلم بلند والت دیزنی سفید برفی و هفت کوتوله (1937) با بیش از بیش از 1937 ساخته شده است. ده سال .

Lottie یک فرمت فایل مبتنی بر JSON است که به هر کسی که از بلوک‌های Kadence استفاده می‌کند اجازه می‌دهد انیمیشن‌ها را به یک سایت وردپرس اضافه کنند. فایل Lottie JSON یک فایل کوچک است که روی دسکتاپ، تبلت و دستگاه های تلفن همراه اجرا می شود. انیمیشن Lottie را می توان به راحتی بزرگ یا کوچک کرد بدون اینکه پیکسلی که در انیمیشن ها یا گرافیک های قبلی دیده می شود.

پیدا کردن انیمیشن های Lottie

LottieFiles.com یک منبع شگفت انگیز برای همه چیز Lottie است. چه به دنبال یک انیمیشن رایگان Lottie باشید که بتوانید آن را به عنوان URL راه دور بارگیری کنید یا آن را دانلود کنید تا از سایت خود به صورت محلی استفاده کنید، LottieFiles تعدادی فایل رایگان برای انتخاب دارد. همچنین می‌توانید درباره ایجاد انیمیشن‌های Lottie خود اطلاعات بیشتری کسب کنید، به افزونه After Effects، افزونه Figma دسترسی داشته باشید یا یک انیماتور بازار پیدا کنید که بتواند یک فایل Lottie سفارشی برای شما ایجاد کند. شما حتی می توانید با استفاده از ابزار LottieFiles به انیمیشن خود تعامل اضافه کنید.

استفاده از Lottie Block

Kadence Lottie با استفاده از افزونه رایگان Kadence Blocks به سایت شما اضافه می شود که به صورت رایگان از مخزن WordPress.org در دسترس است. کافیست افزونه رایگان Kadence Blocks را به آخرین نسخه به روز کنید و Lottie Block برای سایت شما در دسترس است. می‌توانید از Lottie Block در هر جایی که از بلوک‌های دیگری استفاده می‌کنید، از جمله در نشریات، در صفحات یا حتی هنگام ایجاد الگوهای Kadence Elements استفاده کنید. حتی می توانید یک بلوک Lottie را به یک پنجره پاپ آپ یا مدال تبدیل Kadence اضافه کنید.

استفاده از Lottie Block آسان است.

پس از انتخاب Lottie Block، بلافاصله انیمیشن Lottie Block را در وردپرس از LottieFiles.com مشاهده خواهید کرد.

فایل های Lottie از راه دور

اگر می خواهید از یک URL راه دور برای جایگزینی جایگزین استفاده کنید، فقط ورودی را جایگزین کنید URL انیمیشن Lotti رشته. با این کار فایل Lotti از یک مکان راه دور به سرور دیگری دانلود می شود.

می توانید URL فایل راه دور Lottie را در LottieFiles.com در صفحه جزئیات هر انیمیشن بیابید.

تعداد زیادی فایل محلی

اگر می خواهید از یک فایل محلی استفاده کنید، انتخاب کنید فایل محلی در زیر منوی کشویی File Source.

کلیک یک فایل Lottie را آپلود کنید. سپس از شما خواسته می شود که فایل Lottie JSON را از هارد دیسک خود آپلود کنید. ابتدا یک نام آشنا برای آن وارد کنید عنوان انیمیشن. پس از آپلود فایل JSON Lottie، از هر پست یا صفحه ای که Kadence Blocks در آن موجود است، به فایل دسترسی خواهید داشت و این نام آشنا به شما کمک می کند تا تعیین کنید کدام فایل را انتخاب کنید.

سپس کلیک کنید معاینه کردن. این شما را به سیستم فایل خود می برد تا فایل JSON را که می خواهید آپلود کنید پیدا کنید. روی آپلود کلیک کنید و تصویر شما در بلوک Kadence Lottie ظاهر می شود. همچنین برای Kadence Lottie Block در سایت وردپرس شما در دسترس خواهد بود.

دسترسی زیاد

برای صفحه‌خوان‌ها و سایر مرورگرهای جایگزین، توضیحی درباره انیمیشن اضافه کنید آداب آریا زمینه دسترسی (برچسب‌های آریا شبیه برچسب‌های تصویر جایگزین هستند.)

تنظیمات موجود در Lottie Block

تعدادی تنظیمات از طریق Kadence Lottie Block برای کنترل نحوه نمایش انیمیشن Lottie شما در سایت شما وجود دارد.

نمایش کنترل ها

اگر می خواهید به کاربران خود کنترل انیمیشن را برای شروع / توقف انیمیشن بدهید، می توانید این را روشن کنید.

اجرای خودکار

اگر می خواهید وقتی کاربر صفحه شما را بارگذاری می کند انیمیشن شما به طور خودکار پخش شود، این را روشن کنید.

فقط با نگه داشتن ماوس بازی کنید

زمانی که کاربر روی انیمیشن می‌چرخد، در صورت روشن بودن انیمیشن شما پخش می‌شود. اگر می خواهید کاربر خود را تشویق کنید تا اقدامی انجام دهد مفید است.

فقط هنگام پیمایش صفحه پخش شود

انیمیشن شما فقط زمانی پخش می شود که کاربر اسکرول کند. توجه داشته باشید که این کار اکثر تنظیمات مانند پخش خودکار، سرعت پخش، جهش، چرخه و پخش با نگه داشتن ماوس را لغو می کند. این در هنگام پیش نمایش در ویرایشگر بلوک کار نمی کند.

سرعت پخش

شما می توانید تعیین کنید که انیمیشن شما با چه سرعتی یا کندی پخش شود.

کنترل های چرخه

دو کنترل اصلی برای یک چرخه وجود دارد: پخش چرخه و پخش جهشی. پخش چرخه ای انیمیشن را به طور مکرر پخش می کند، با پخش برگشتی انیمیشن را پخش می کند و سپس پخش را معکوس می کند. همچنین می‌توانید تأخیر پخش یک چرخه را (در چند ثانیه) تنظیم کنید، و همچنین تعداد چرخه‌هایی را که برای هر کاربر پخش می‌شود محدود کنید.

کنترل های اندازه

کنترل های اندازه تقریباً مانند سایر بلوک ها کار می کنند. می توانید پر و فیلدها را در اطراف بلوک Lottie خود یا برای هر متغیر (چپ، راست، بالا و پایین) تنظیم کنید، یا برای اتصال تنظیمات فیلد یا تنظیمات بالا، روی کادر انتخاب کلیک کنید. همچنین می توانید حداکثر عرض بلوک Lottie را برای تغییر اندازه سریع انیمیشن Lottie تنظیم کنید.

از بلوک های Kadence Lottie در هر جایی که می توانید از بلوک ها استفاده کنید استفاده کنید

هر جا که از بلوک استفاده می کنید از Kadence Lottie Block استفاده کنید. در نسخه رایگان Kadence Blocks موجود است.

و اگر قبلاً از افزونه Kadence Blocks Pro، Kadence Conversions یا Kadence Theme Pro استفاده می‌کنید، می‌توانید اضافه کردن Lottie Block را به هر منطقه‌ای که قبلاً از بلوک‌ها استفاده می‌کنید شروع کنید.

اگر از قالب‌های Kadence Elements به عنوان بخشی از Kadence Theme Pro استفاده می‌کنید و برای مثال می‌خواهید Lottie Block را به فوتر خود اضافه کنید، می‌توانید به راحتی این کار را انجام دهید. فقط به سمت خودت برو Kadence> Elements> Template برای پیدا کردن الگوی پاورقی خود و اضافه کردن بلوک Lottie در آنجا.

اگر از تبدیل‌های Kadence برای یک پنجره پاپ‌آپ/مدال یا کشویی استفاده می‌کنید و می‌خواهید Lottie Block را به یک عنصر تبدیل مورد استفاده در سایت خود اضافه کنید، می‌توانید آن را به همان روش اضافه کنید. فقط از بلوک ها به همان روش معمول استفاده کنید و Lottie Block خود را برای آیتم Kadence Conversions خود سفارشی کنید.

منابع قابلیت استفاده انیمیشن

انیمیشن های وب سایت وردپرس ابزارهای فوق العاده قدرتمندی هستند که به شما امکان می دهند توجه را جلب کنید و مخاطبان خود را درگیر کنید. البته، با قدرت زیاد، مسئولیت بزرگی نیز به همراه دارد. منابعی برای درک بهترین شیوه‌های انیمیشن وجود دارد، و ما شما را تشویق می‌کنیم بهترین روش‌ها را برای قابلیت استفاده از انیمیشن‌های وب مرور کنید. گروه نیلسن نورمن راهنماهای عالی ارائه می دهد: انیمیشن برای توجه و درک، و نقش انیمیشن و حرکت در UX.

از تحقیقات خود در مورد قابلیت استفاده از انیمیشن برای هدایت اهداف خود استفاده کنید. به این ترتیب، می توانید انیمیشن اضافه کنید تا به کاربران خود کمک کنید تا در حین تحقق اهداف بازاریابی خود، به آنچه به دنبال آن هستند برسند. انیمیشن یک ابزار فوق العاده برای ایجاد تجربیات کاربر پسند است و Kadence هیجان زده است که این ابزار نوآورانه را به بیش از 200000 کاربر که از Kadence Blocks برای ایجاد تجربیات کاربری استثنایی وردپرس استفاده می کنند، ارائه دهد.

Kadence به نوآوری خود ادامه می دهد

بلوک Kadence Lottie تنها آخرین نوآوری تیم Kadence است. در افزونه رایگان Kadence Blocks موجود است، هنگام ارتقاء به نسخه 2.2.4 یا بالاتر، بلوک Kadence Lottie را مشاهده خواهید کرد.

برای به دست آوردن همه چیز کادنس برای ارائه، ما بسته کامل را ارائه می دهیم. با اضافه شدن محصولات و ویژگی های جدید، آنها به بسته کامل اضافه می شوند، بنابراین شما همیشه به آخرین نوآوری Kadence دسترسی خواهید داشت.

kt-btns_24c449-f1 .kt-btn-wrap-0 {margin-right: 5px;}. rtl .kt-btns_24c449-f1 .kt-btn-wrap-0 {margin-left: 5px; margin-right: 0px . block-cadence-advancedbtn.kt-btns_24c449-f1 .kt-btn-wrap-0 .kt-button: شناور، .wp-block-kadence-advancedbtn.kt-btns_24c449-f1 .kt-btn-wrap-0. -button: focus {color: #ffffff; border-color: # 3699ff;}. wp-block-kadence-advancedbtn.kt-btns_24c449-f1 .kt-btn-wrap-0 .kt-button :: قبل از {نمایش: no -wrap-0 .kt-button: focus {background: # 3699ff;}