آموزش نمایش لودینگ تا بارگذاری کامل صفحه (ویدیوی آموزشی)

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

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

ساخت صفحه لودینگ با المنتور

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

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

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

1. ورود به پیشخوان وردپرس

به پنل مدیریت سایت خود وارد شوید.

2. رفتن به تنظیمات المنتور

از منوی سمت راست، وارد مسیر زیر شوید:
المنتور → کدهای سفارشی (Custom Code)

3. افزودن کد جدید

روی دکمه «افزودن کد جدید» کلیک کنید.

4. انتخاب نام و موقعیت

نام دلخواهی مثل (لودینگ قبل از بارگزاری صفحه) وارد کنید و موقعیت نمایش کد را روی head یا body start قرار دهید (برای کد لودینگ، توصیه می‌شود از body start استفاده کنید تا زودتر نمایش داده شود).

5. وارد کردن کد

کد کامل CSS، HTML و JS مربوط به لودینگ را که در این آموزش استفاده کردیم، در این قسمت وارد کنید.

6. انتشار کد

در مرحله بعد روی شرایط نمایش (Display Conditions) کلیک کرده و «سایت کامل» (Entire Site) را انتخاب کنید. سپس دکمه انتشار را بزنید.