آموزش افزودن صحفه لودینگ در وردپرس
دسته‌ها : گرافیک, وکتور سه شنبه, بهمن ۱۳, ۱۳۹۴ admin دیدگاه ها3

شاید شما هم در برخی از سایت های ایرانی و خارجی دیده باشید که قبل از نمایش اون وب سایت یه صحفه 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 آپلود کرده باشید. قدم بعدی برای افزودن لودینگ به سایت وردپرسی قرار دادن جی کوئری می باشد.

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

<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”>

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

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


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

مطالب مشابه با این موضوع

بالا رفتن