أضف ستايل' تحميل الصفحة' رائع لمدونات بلوجر
هذا الهاك يعتبر من أحسن الهاكات التي يمكنك تطبيقها في مدونتك ,بحيث يعطي هدا الهاك جمالية واحترافية لمدونتك ,كيف يعمل ؟ عند ما يضغط زائر ما على رابط أو يفتح صفحة جديدة في مدونتك لاتظهر له الصفحة البيضاء بانتظار أن يتم تحميلها بل يظهر له له مثل ما في هده الصورة ,بانتضار أن يتم تحميل الصفحة كاملة
طريقة التركيب
</head>
وضع فوقه مباشرة الكود التالي:
وضع تحته مياشرة الكود التالي
اذا أردت أن تظهر الاضافة فقط في الصفحة الرئيسية استعمل فقط الكود التالي الكود التالي
ثم قم بحفض القالب
هذا كل مافي الموضوع والسلام عليكم
طريقة التركيب
ثم قم بالضغط على 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/AVvXsEjhggdIshZMCtzAroScaNww2ILqMdbEFtVaboafNQ6CZUzcvxQH1fWsOlZ305OLMkk0C-92KkdNXVQ4CDnZAwu4BvS-oUv07RAcIX0rmo_or0OSLubNpoULKbrhyphenhyphen55FqTk21EkXf3AqFsBc/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>
/* 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/AVvXsEjhggdIshZMCtzAroScaNww2ILqMdbEFtVaboafNQ6CZUzcvxQH1fWsOlZ305OLMkk0C-92KkdNXVQ4CDnZAwu4BvS-oUv07RAcIX0rmo_or0OSLubNpoULKbrhyphenhyphen55FqTk21EkXf3AqFsBc/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>
- ثم قم بالبحث عن هدا الكود
وضع تحته مياشرة الكود التالي
<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/AVvXsEjhggdIshZMCtzAroScaNww2ILqMdbEFtVaboafNQ6CZUzcvxQH1fWsOlZ305OLMkk0C-92KkdNXVQ4CDnZAwu4BvS-oUv07RAcIX0rmo_or0OSLubNpoULKbrhyphenhyphen55FqTk21EkXf3AqFsBc/s1600/CC-Lodding.gif بصورة من اختيارك ,وقد وضعت بعض الصور والتي يمكنك الاختيار بينها
- يمكنك تغير خلفية الصفحة الى أي لون تريد فقط بدل كود هدا اللون #FDFEF8 الى أي كود تريد أو استعمل محرر أكواد مدونة شامل كول
هذا كل مافي الموضوع والسلام عليكم
8 التعليقات:
اضافة جميلة للغاية وقد طبقتها في مدونتي وغيرت القالب اخي شامل
@مدونه العرب عربي ايجي
هذا ما أتحدث عنه ,قالب جميل
اخي شامل القالب كان به بعض العيوب فغيرته بقالب اخر اجمل
وهناك ايضا موضوع اخر انا حضرت كذا موضوع مهم لك
ارجو ان تحدثني عند فراغك
انا سويتها والبلوجر حكي خرب اتمنى تساعدوني في طريقة حذفه
أنا ركبته ورفض البلوجر ما يشتغل الصفحة لم تشتغل في طريقة اتخلص منه
أتمنى الرد في أسرع وقت
@Mr.Fares
أنا لم أفهم قصدك ,هل لم تشتغل معاك أم
هنالك مشكل اخر
ممــــتـــآز تم التركيب على مدونة ربحي rib7i.blogspot.com
إرسال تعليق
ملحوظة: يمكن لأعضاء المدونة فقط إرسال تعليق.