 |
| إضافة تأتير تحميل الدخول الى الصفحات في مدونة بلوجر بشكل أنيق |
السلام عليكم و رحمة الله و بركاته
أهلا و سهلا بكم متابعى مدونة سمارت المعلوماتية الكرام
لاشك أحبابى فى الله أن شكل مدونتك هو العامل الرئيسيى فى جذب الزوار و ذلك بعد المحتوى الحصرى و الجديد الذى لابد و أن تعرضه فى مدونتك لكى يجد الزائر هذا المحتوى أولا فى مدونتك و بالتالى ستكون مرجعا الى الزائر و سوف يتردد الى مدونتك فى كل وقت و بالتالى كلما زاد تردد الزوار الى مدونتك يزداد و يتحسن ترتيبك فى اليكسا و اليكسا هو عبارة عن موقع أو أداه تحدد ترتيب المواقع عالميا و ذلك لمن لا يعرف اليكسا و لسى تكسب الزائر اللى مدونتك كل ما عليك هو الاهتمام بمدونتك و المحتوى الحصرى فيها و لكن أطلب منكم أحبابى فى الله أن تسمحوا لى أن أتابع معكم سلسلة الاضافات التى تجعل مدونتك مدونة أنيقة و جميلة , اسمحوا لى أحبابى فى الله أن أقدم لكم إضافة تأتير تحميل الدخول الى الصفحات في مدونة بلوجر بشكل أنيق و جميل جدا و هذه الاضافة تجعل دخولك الى المدونة أو الى موضوع ما فى مدونتك تظهر أمامك صورة متحركة و شكلها جميل جدا تحسن من شكل مدونتك.
معاينة الاضافة
يمكنكم أحبابى فى الله أن تتبعوا الخطوات التالية تماما و بعد ذلك معاينة الموضوع بنفسك عبر مدونتك و هذه الخطوات و الأكواد صحيحة 100 % و لا تقلق من ذلك و ان واجهتكم مشكلة أرجو اضافة تعليق و سوف يتم الرد فى أقرب وقت ممكن ان شاء الله.
طريقة اضافة تأثير التحميل الى مدونتك
- اذهب الى الى لوحة التحكم فى بلوجر
- ثم قم بالذهاب الى القالب ثم تحرير html
- ثم بعد ذلك باستخدام لوحة المفاتيح لضغط على ( CTRL + F ) و اكتب الكود التالى
]]></b:skin>
و أضف فوقه الكود التالى مباشرة
#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;
}
و بعد ذلك قم بالبحث عن الكود التالى
</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>
و أضف تحته مباشرة هذا الكود مع تغيير ما باللون الاحمر بما يناسب مدونتك
<div id='mbl-lazyloading'><div id='mbl-progress-bar'/><div id='mbl-loader'>ضع هنا نبذة عن مدونتك أو أكتب ما تريد عن المدوننة<a href='http://blog-ency.blogspot.com/'>موسوعة بلوجر</a></div></div>
و اليكم بعض الصور الجميل و كل ما عليكم هو اختيار ما يناسب مدونتك
و الرابط الخاص بها
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQmwc8D0Fr0dASEVbKaLbKEmIugb0MmfNRRa5Lc6afKZIhpwoJOk9CxX8f8XXbfZvtc5pikjtIW2KQAl2GuseshzeZ_4-_alF5-1IYmuaMmmqX_2hWoxgf7WKJ683GaS-Wkbl8XknFLvk/s1600/Loading-1.gif
و الرابط الخاص بها
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1y_a1Q9b9S-SFQ85R36IGfSWL0FkJ4rKzYtIV5HZC_XSUyXz2detawD9oFA-_DWjPUhPd-kRZewLvNgH8LQYHcULrbGoVhDzgpugzqMrN6xAGNHMsUCfbW1BJy-dCahcxKiBeUWscA3U/s1600/Loading-2.gif
و الرابط الخاص بها
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiE7NarQnqN5L1Q45RNg9W3HPsOY-1ARfArkMHpSt0J5P6Z_jswvCKRZJhV-Xfwr3JQpUDryrKxjwyZrH51RH5CCIxB79klA7d15mroPc_XW9istrB_wUjZfBTFtloGjJRZhPJjn6wWqCg/s1600/Loading-3.gif
و الرابط الخاص بها
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiCtMax_g08fKK43oL81qXozpUvfyJFFD_RhpcWN3Ci-_xahARYEq0oJI1GDSJ4M5kbuKkdBALEvhNs6Md7xJslGFGjBvP0vcdsmENAdOwFY6ThyGcl2Dhs4m2AuwI1qZ2tY69j7ssgsPs/s1600/Loading-4.gif
و الرابط الخاص بها
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjR-MKl7T_cAyW-Uy9gLA3QeDW51vCVQwt3vGkTS7DeEmo5_NcqFrxfRP_eJZpKpfoqKIvQktCWlm0UQizykJbo6dksB3hgtpwVHzPIEXfqKq555Az4C5j5SaaQHnGWMZgCv0B0eEq7hic/s1600/loading-5.gif
و الرابط الخاص بها
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVlzOxa3VD6TWWGmYiajPVrsZtC7u8XLEJqep0pveSPldo48gnH6_fsvEOtP4zhNvUBsR1pNpb3vh_uPuVBPH5JwEG18jD7UX_F5WdGoFqTD7FgA1dsnba7sFbkk7h2MQkgki_Q6ppLiw/s1600/Preloader_1.gif
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiCXVHYhfXQRaRKA7c6c5WlGfG-hovNPNK7Q_MO0FoAseUZFF7g3HuZjQQyu7YB6RA2TJMyCcHQrFPd7p5lF4_EGZrbnYuugWhvWvsoEeIk56QNBFqgyutF49k3NMrVTV5xZMRrvWgy1QE/s1600/Preloader_2.gif
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8ce3bjRPgAY5ddqKqerQhqUICMhhsM4lLvtoZpI51Pz1OjSkd5GMyl-6eawy1szGxKjW69ZkdaQPFfv2G5oEd5gVpjiVoxPyqOjmw_DX6bErS1FD4VeTw4H1x973LVy1Qs-m0lrwF0cI/s1600/Preloader_3.gif
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8tFHbiagmNgUKSMBTNHDpDHHYDSZjyWhpmhFGAhiWrP_2C4H3uhFlGhSNBF2mW_9KIyo5p7Yl31AtJhe27nvaSS5GGr_bPlJ4ADtADIZ1lf18Xzz5RV_jzkoPulFgSB5OAV_ctIGGBBY/s1600/Preloader_4.gif
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg6_PbtQxgO2EHr8Br8dF_wVTDybDp4JPpD324e9taWrdfgfVUDYTMjHbPwhHj6lQmKqnmxwHBv1zPoCSTb-4wYnDv1tcqcEOxK6ifCar6tUkBNXvEWrqn3cveIkLOP5VdQxc7XtyR8Lv0/s1600/Preloader_5.gif
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcccOKpsSiGn3vRJXQy6lpx7s5ex1ptxdCVoPLPYd6lgiqoKuepCE2qxeeIC70SbqUS2MZPdK7gAPKO2OOIUNCH3gnMjlewspWAM4gF9adOLLmpZFT-JpL8MQwKFU4uufH-f2pzdnFHcA/s1600/Preloader_6.gif
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgV6fhufRahTgwkSNw9mGUv6M1nrR6JbGQoMKSPhYhzB8ktGG_WpKYjCKUz9Q_dUDZvwdhMnGkz6usCaAHJfF-yPAHSGN5AjPwVZZ2Rjr1S8Ua3FpmtxItqwVgcxMt52QMxgVaM6yPyZnc/s1600/Preloader_7.gif
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgM8ir9qjG9rR62rWOwTtLkYbjmcKbcnAw1VksIMd7JCanFEP-e5sBq2-bX44VXxCY42h1-lrB-2G9fW4giLkOLjUqSj8wGgyF_BrG6e39j92ZE-wdUm6oZ2xNywdt5exhGBlSW3n5GdHQ/s1600/Preloader_8.gif
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi716KlZDc_RIu_n3PsNC0p-Zxr91uZ4GTHT9mGjImN3d0Gaf3_ATWW6moMKiBigKYn13CdARqnyGynJQyfDQRyYZquxdFO_VgLxSPj0OYlTIkCazhebYSBWiZOaexAkhHt-suYYooh5zU/s1600/Preloader_9.gif
و الرابط الخاص بها
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjbf5SwIzD8OvqomeItKPUzeFiQRbv4YfJblfM3KL8TqwZUcN9TDceRps2I6-jW4aK8bFRHd4mjHiqPNUunXccACNwNuQNO6GMYPoCg2m_LJFxCguGEdhSEW1_J6_q2lK1vxpRFhG8NSfY/s1600/Preloader_10.gif
و فى الاخير اذا واجهتكم مشكلة اترك تعليق و سوف يتم الرد عليكم فى أسرع وقت ان شاء الله و أستودعكم الله الذى لا تضيع ودائعه
.
.
.
.
.
اذا اعجبك الموضوع لاتبخل علينا بتعليق فتعليقك يشجعنا
بارك الله فيك , موقع ممتاز ^^
ردحذفبارك الله فيك , موقع ممتاز ^^
ردحذفأزال المؤلف هذا التعليق.
ردحذفالسلام عليكم أخي شكرا على الإضافة ولكن هناك مشكل أن أيقونة التحميل لاتتوقف ولاتظهر الصفحة الرئيسية ممكن طريقة إعداد الإضافة
ردحذفالسلام عليكم أخي شكرا على الإضافة ولكن هناك مشكل أن أيقونة التحميل لاتتوقف ولاتظهر الصفحة الرئيسية
ردحذف