اضافه کردن لودینگ صفحه در وردپرس

اضافه کردن لودینگ به صفحات سایت باعث بهبود تجربه کاربری شده و بازدیدکنندگان شما را مطلع می‌کند که صفحه در حال بارگذاری است. این مورد در کاهش Bounce Rate وبسایت شما هم تاثیر زیادی دارد. در ادامه با آموزش افزودن صفحه لودینگ در وردپرس همراه ما باشید.

لودینگ (Preloader) چیست و چه زمانی به آن نیاز داریم؟

لودینگ یا پری‌لودر در واقع انیمیشنی است که پیش از اتمام بارگذاری یک صفحه به کاربر نمایش داده می‌شود.

به طور معمول، وقتی شما از یک وبسایت بازدید می‌کنید، بخش‌ها و المان‌های مختلف آن صفحه برای شما دانلود می‌شوند.

سرعت بارگذاری برخی از قسمت‌ها (مانند متون و کدها) سریع‌تر از موارد دیگر (نظیر تصاویر و ویدئوها) است.

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

در طرف دیگر، اگر شما از تصاویر زیاد یا ویدئوها در صفحات‌تان استفاده می‌کنید، پس کاربران باید مدت زمان بیشتری را تا بارگذاری کامل محتوا منتظر بمانند.

در این صورت، سرعت لود سایت کاهش یافته و ممکن است کاربران تصور کنند که آن صفحه دچار مشکل شده و بارگذاری نمی‌شود.

افزودن لودینگ به صفحات باعث می‌شود که فاصله بین مراجعه کاربر و نمایش کامل محتوا از بین رفته و کاربر منتظر بماند.

یک نمونه از این لودینگ‌ها در پنل وردپرس و هنگام پیش‌نمایش مطالب استفاده شده است که در ادامه مشاهده می‌کنید:

با این مقدمه، نگاهی می‌اندازیم به نحوه افزودن Preloader به صفحات سایت در وردپرس.

اضافه کردن لودینگ صفحه در وردپرس با افزونه WP Smart Preloader

ابتدا افزونه WP Smart Preloader را از مخزن وردپرس نصب و فعالسازی کنید (لینک در انتهای مطلب).

سپس در پیشخوان وردپرس به منوی تنظیمات > WP Smart Preloader مراجعه نمایید.

در این صفحه می‌توانید استایل انیمیشن لودینگ را انتخاب کنید؛ به طور پیش‌فرض 6 استایل مختلف در افزونه تعبیه شده است.

همچنین اگر حرفه‌ای‌تر هستید، امکان اضافه کردن لودینگ دلخواه با کدهای HTML و CSS هم وجود دارد.

لودینگ شما در تمامی صفحات وبسایت قرار خواهد گرفت؛ در صورتی که میخواهید فقط در صفحه اصلی نمایش داده شود، گزینه Show only on Home Page را تیک بزنید.

در پائین صفحه تنظیمات، دو فیلد دیگر وجود دارد؛ Duration to show Loader (مدت زمان نمایش لودینگ) و Loader to Fade Out (مدت محو شدن انیمیشن).

فیلد اول به طور پیش‌فرض روی 1500 میلی‌ثانیه (معادل 1.5 ثانیه) تنظیم شده که برای اکثر وبسایت‌ها زمان مناسبی است.

فیلد دوم برای تعیین مدت محو شدن انیمیشن است که زمان پیش‌فرض 2500 میلی‌ثانیه (2.5 ثانیه) را دارد.

در نهایت روی دکمه «ذخیره تغییرات» کلیک کنید تا تنظیمات شما اعمال شوند.

حالا با مراجعه به وبسایت‌تان می‌توانید نتیجه را مشاهده کنید.

امیدواریم که از آموزش اضافه کردن لودینگ صفحه در وردپرس لذت برده باشید.