معهد خبراء بلوجر

معهد خبراء بلوجر (https://www.bloggerexp.com/index.php)
-   إضافات وأدوات بلوجر (https://www.bloggerexp.com/forumdisplay.php?f=10)
-   -   اضافة تأثير تحميل المدونة الى بلوجر (https://www.bloggerexp.com/showthread.php?t=15519)

احمد مجدي 09-15-2014 03:30 PM

اضافة تأثير تحميل المدونة الى بلوجر
 

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

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


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

http://2.bp.blogspot.com/-uOIlJgeINn...9%84%2B(4).jpg


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

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

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

طريقة اضافة الاداة

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

]]></b:skin

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

    /*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-width768px) {#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) */ 

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

</head

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

    <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> 

وفي الاخير قم بالبحث عن
كود PHP:

</body

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

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

واليكم مجموعه من روابط الصور يمكنكم استخدامها

http://4.bp.blogspot.com/-RBxtljDB4Y...ogspot.com.gif

http://2.bp.blogspot.com/-9ZaBj6a_F1...ogspot.com.gif

http://4.bp.blogspot.com/-7TggH78GRu...ogspot.com.gif

http://2.bp.blogspot.com/-zmkoKuMiVF...ogspot.com.gif

http://3.bp.blogspot.com/-q7cQxzltpl...ogspot.com.gif

http://4.bp.blogspot.com/-4fBszryFHI...ogspot.com.gif

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

المصدر:اضافة تأثير تحميل المدونة الى بلوجر - مدونة الاوائل

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



الساعة الآن 02:40 AM

Powered by vBulletin® Copyright ©2000 - 2025 Dov By EGYNT.Co
new notification by 9adq_ala7sas
Developed By Marco Mamdouh
معهد خبراء بلوجر - 2012