افزودن لودینگ به قالب وردپرس

آموزش افزودن حالت لودینگ به وب سایت وردپرسی

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

اما دوستان عزیز این کار به چه صورت انجام میشود؟
برای این منظور شما باید از کمی کد نویسی در وب سایت های وردپرسی استفاده نمائید.پس برای شروع کار به صورت زیر گام به گام پیش بروید
در قسمت اول در پوسته وب سایت وردپرسی خود فایل header.php را در حالت ادیت باز کنید. بعد از تگ کد زیر را قرار دهید:

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

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

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

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

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

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

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

توجه کنید که قبل از انجام هر کاری در کد های وب سایت وردپرسی خود از آن ها نسخه پشتیبان تهیه کنید که مشکلی در آینده برای شما رخ ندهد.