هذا الهاك يعتبر من أحسن الهاكات التي يمكنك تطبيقها في مدونتك ,بحيث يعطي هدا الهاك جمالية واحترافية لمدونتك ,كيف يعمل ؟ عند ما يضغط زائر ما على رابط أو يفتح صفحة جديدة في مدونتك لاتظهر له الصفحة البيضاء بانتظار أن يتم تحميلها بل يظهر له له مثل ما في هده الصورة ,بانتضار أن يتم تحميل الصفحة كاملة
طريقة التركيب
ثم قم بالضغط على ctrl + f ثم قم بالبحث على الكود التالي
</head>
وضع فوقه مباشرة الكود التالي:
<style>
/* e loading effect www.chamelcool.blogspot.com */
#cc-loading {
position: fixed;
z-index: 50;
top: 0; left: 0;
width: 100%; height: 100%;
background: #FDFEF8 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzgXGbfLB_hUOOTWJ5EOIu79XyZU2aWAvIgTnTH86-3LyeJ_hPVi1afsPbM3SwA8KLIoPF8lepCYnIDooBJSeDRHDEvicb_GQBGIUV7ZHAI0QAcbqI5cUFX_mihQaZoxpEoTbIT-Uib7JY/s1600/CC-Lodding.gif) no-repeat center;
line-height: 350px;
text-align: center;
font-size: 36px;
color: #353231;
text-indent: -9999px;
}
.CC #cc-loading { display: none; }
@media only screen and (device-width: 768px) {
#loading {
position:absolute;
width:1040px;
min-height:768px;
}
}
#cc-progress-bar {
position: absolute;
top: 0; left: 0;
background: #de1301;
opacity: 0.8;
width: 0;
height: 18px;
}
#cc-loader {
height: 100%;
display: none;
}
</style>
<script>
(function($){
$("html").removeClass("CC");
$("#header").ready(function(){ $("#cc-progress-bar").stop().animate({ width: "25%" },1500) });
$("#footer").ready(function(){ $("#cc-progress-bar").stop().animate({ width: "75%" },1500) });
$(window).load(function(){
$("#cc-progress-bar").stop().animate({ width: "100%" },600,function(){
$("#cc-loading").fadeOut("fast",function(){ $(this).remove(); });
});
});
})(jQuery);
</script>
ثم قم بالبحث عن هدا الكود <body>
وضع تحته مياشرة الكود التالي
<div id='cc-loading'><div id='cc-progress-bar'></div><div id='cc-loader'>loading...</div></div>
ملاحضة:
اذا أردت أن تظهر الاضافة فقط في الصفحة الرئيسية استعمل فقط الكود التالي الكود التالي
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<div id='cc-loading'><div id='cc-progress-bar'></div><div id='cc-loader'>Loading...</div></div></b:if>
ثم قم بحفض القالب
اشياء يمكنك التغير عليها في الكود الأول :
يمكنك تغير صورة العداد https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzgXGbfLB_hUOOTWJ5EOIu79XyZU2aWAvIgTnTH86-3LyeJ_hPVi1afsPbM3SwA8KLIoPF8lepCYnIDooBJSeDRHDEvicb_GQBGIUV7ZHAI0QAcbqI5cUFX_mihQaZoxpEoTbIT-Uib7JY/s1600/CC-Lodding.gif بصورة من اختيارك ,وقد وضعت بعض الصور والتي يمكنك الاختيار بينها
يمكنك تغير خلفية الصفحة الى أي لون تريد فقط بدل كود هدا اللون #FDFEF8 الى أي كود تريد وهده صور يمكنك الاستعانة بها : فقط افتح الصور في نافدة جديدة وقص الرابط الخاص بها وعوضه في الكود الصورة المعلمة بالاصفر
هذا كل مافي الموضوع والسلام عليكم
