حصريا قالب Hot Games معرب ومطور

بسم الله الرحمن الرحيم 

السلام عليكم ورحمة الله وبركاته

اهلا ومرحبا بكم من جديد زوار ومتابعي مدونة الاوائل الكرام
معنا اليوم انشاءالله اضافة جميله جدا واحترافيه
وهي اضافة تاثير تحميل المدونة الي المدونة

مميزات هذه الاضافة

1- لا تؤثر على سرعة  مدونتك
2- متوافقه مع جميع المتصفحات
3- يمكنك التعديل عليه وتغيير الصورة وفقا لرغبتك.

4- سوف تساعد أيضا المدونات على أخد وقت أقل لتحميل الصفحات
 وتجعل الزوار المهتمين ينتظرون على مدونتك
 بمجرد رؤية الصورة المعبرة عن التحميل

طريقة اضافة الاداة
اولا قم باخذ نسخه احتياطيه من قالب مدونتك
اذهب الي لوحة التحكم الخاصة بمدونتك
من القائمه اليمني اضغط علي قالب ثم تحريرhtml
أنقر على "Ctrl+F" و ابحث عن الكود التالي

]]></b:skin>

اضف الكود التالي فوقه مباشرة

/*Start MBL Lazy Page Loading Effect CSS coding (www.elawaael.blogspot.com) */ #mbl-lazyloading {position: fixed;z-index: 50;top: 0; left: 0;width: 100%; height: 100%;background: #FDFEF8 url(هنا رابط الصورة المتحركه) no-repeat center;line-height: 350px;text-align: center;font-size: 36px;color: #353231;text-indent: -9999px;} .MD #mbl-lazyloading { display: none; } @media only screen and (device-width: 768px) {#loading {position:absolute;width:1040px;min-height:768px;}} #mbl-progress-bar {position: absolute;top: 0; left: 0;background: #de1301;opacity: 0.8;width: 0;height: 18px;} #mbl-loader {height: 100%;display: none;} /*End MBL Lazy Page Loading Effect CSS coding (www.elawaael.blogspot.com) */

بعد ذلك قم بالبحث عن هذا الوسم

</head>

واضف قبله مباشرة هذا الكود

<script> (function($){ $("html").removeClass("MD"); $("#header").ready(function(){ $("#mbl-progress-bar").stop().animate({ width: "25%" },1500) }); $("#footer").ready(function(){ $("#mbl-progress-bar").stop().animate({ width: "75%" },1500) }); $(window).load(function(){ $("#mbl-progress-bar").stop().animate({ width: "100%" },600,function(){ $("#mbl-lazyloading").fadeOut("fast",function(){ $(this).remove(); }); }); }); })(jQuery); </script>

وفي الاخير قم بالبحث عن

</body>

واضف الكود التالي فوقه مباشرة

<b:if cond='data:blog.url == data:blog.homepageUrl'> <div id='mbl-lazyloading'> <div id='mbl-progress-bar'> </div> <div id='mbl-loader'>

واليكم مجموعه من الصور يمكنكم استخدامها 
اضغط كلك يمين علي الصورة ثم افتح الصورة في علامة تبويب جديده
 لكي تتمكن من اخذ الرابط الخاص بها

والي هنا تكون قد اضفت الاداة بنجاح
واذا واجهتك اي مشكلة لاتتردد في طرحها

وشكرااا والسلام عليكم ورحمة الله وبركاته

تعديل المشاركة

• مشاركةWhatsapp
• طباعةPrint