آموزش افزودن صحفه لودینگ در وردپرس
دسته‌ها : آموزش های طراحی سایت , آموزش وردپرس ۰۱ مرداد ۱۳۹۵ - ۲۰:۴۳ امیر رضائی بدون نظر
خانه آموزش های طراحی سایتآموزش وردپرس آموزش افزودن صحفه لودینگ در وردپرس

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

loading

در زیر یک نمونه از تصویر png لودینگ رو براتون قرار دادم :

loading49

توجه: همچنین ۵۰ نمونه دیگر از تصاویر لودینگ رو براتون آماده کردیم که در صورت نیاز از تصاویر بیش تر میتوانید از اینجا دانلود نمایید…

همچنین می توانید از تصاویر این مطلب هم استفاده کنید

آموزش قرار دان در سایت:

ابتدا در فایل header.php  بعد از تگ <body> کد زیر را قرار دهید :

<div class="loader"></div>

سپس در فایل style.css پوسته خود کد زیر را اضافه کنید:

.loader {
position: fixed;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
z–index: 9999;
background: url(‘images/loader.GIF’) center center no–repeat #f8f8f8;
}

دقت کنید که تصویر لودینگ رو در پوشه images آپلود کرده باشید. قدم بعدی برای افزودن لودینگ به سایت وردپرسی قرار دادن جی کوئری می باشد.

حتما بخوانید  مجموعه تصاویر loading برای بارگذاری سایت

در ابتدا باید کتابخانه جی کوئری رو در سایتون فراخوان کنیم.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

بعد کد زیر که مربوط به نمایش لودینگ هستش رو قرار میدیم:

<script type=”text/javascript”>
$(window).load(function() {
$(“.loader”).fadeOut(“slow”);
})

</script>

حالا تمامی فایل ها رو ذخیره کنید و سایت خودتونو بارگذاری کنید. اگر تغییری ندیدید از کلید های ctrl+f5 استفاده کنید. می بینید که تصویر لودینگ نشون داده میشه.

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

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

البته اگه هم بخواهید که سایت شما کش نشه کد زیر رو در داخل <head></head> قرار بدید:

<META HTTP-EQUIV=”CACHE-CONTROL” CONTENT=”NO-CACHE”>

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

امیر رضائی وبسایت


وردپرس را با تمام وجودم دوست دارم و از این رو چندین سال است در زمینه طراحی سایت های وردپرسی و طراحی پوسته های وردپرسی فعالیت می کنم و اعتقادم بر این است که انسان باید آموخته ها و تجربیات خود را با دیگران به اشتراک بگذارد بلاگ تم مکان اشتراک گذاری تجربیات و آموخته های من است

بهترین و راحت ترین راه برای ارتباط با شما کانال تلگرام بلاگ تم

newslatter

با اشتراک در خبرنامه از آخرین آموزش ها و خدمات مطلع شوید !

از عضویت شما در خبرنامه بلاگ تم متشکریم!
best web design software

امتیاز دهید