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

ما يميز شكل المدونة عن الأخرى , هي الإضافات و التعديلات و التميز و الإختلاف .. إضافة تأثير تحميل المدونة لمدونات بلوجر , إضافة مميزة , خفيفة و لا تأثر في سرعة مدونتك كما أنها متوافقة مع جميع المتصفحات و الأجهزة. إضافة إلى أنها تجعل الزائر مهتما أكثر من ذي قبل لقراءة التدوينة أو مشاهدة الموقع .. فلو كانت تحميل مدونتك بطيئا , فالزئر سيملّ من الإنتظار أمام صفحة بيضاء ..!

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

على أساس الحصل على الإضافة لمدونتك , توجه نحو لوحة التحكم الخاصة بك في بلوجر. و توجه نحو تعديل القالب .
ابحث عن هذا الكود:
</body>
فوقه مباشرة أضف هذا الكود:

 <div dir="rtl" style="text-align: right;">
<style></div>
<div dir="rtl" style="text-align: right;">
#abt-page-loader {</div>
<div dir="rtl" style="text-align: right;">
        position: fixed!important;</div>
<div dir="rtl" style="text-align: right;">
        top: 0;</div>
<div dir="rtl" style="text-align: right;">
        right: 0;</div>
<div dir="rtl" style="text-align: right;">
        bottom: 0;</div>
<div dir="rtl" style="text-align: right;">
        left: 0;</div>
<div dir="rtl" style="text-align: right;">
        z-index: 9999;</div>
<div dir="rtl" style="text-align: right;">
        background:#000 url('<span style="color: red;">https://lh4.googleusercontent.com/-mQD0pkXM2Mk/UrBy0Cd7aVI/AAAAAAAAJ4A/JD-zaaFSku8/w43-h11-no/www.madad2.com1.gif</span>') no-repeat 50% 30%;</div>
<div dir="rtl" style="text-align: right;">
        color: #FFF;</div>
<div dir="rtl" style="text-align: right;">
        display: none;</div>
<div dir="rtl" style="text-align: right;">
        font: 0/0 a;</div>
<div dir="rtl" style="text-align: right;">
        text-shadow: none;</div>
<div dir="rtl" style="text-align: right;">
        padding: 1em 1.2em;</div>
<div dir="rtl" style="text-align: right;">
}</div>
<div dir="rtl" style="text-align: right;">
</style></div>
<div dir="rtl" style="text-align: right;">
<script type='text/javascript'></div>
<div dir="rtl" style="text-align: right;">
//<![CDATA[</div>
<div dir="rtl" style="text-align: right;">
$(document.body).append('<div id="abt-page-loader">
تحميل...</div>
');</div>
<div dir="rtl" style="text-align: right;">
$(window).on("beforeunload", function() {</div>
<div dir="rtl" style="text-align: right;">
    // ... Show the Animation `.fadeIn()`</div>
<div dir="rtl" style="text-align: right;">
    $('#abt-page-loader').fadeIn(1000).delay(6000).fadeOut(1000);</div>
<div dir="rtl" style="text-align: right;">
});</div>
<div dir="rtl" style="text-align: right;">
//]]></div>
</div> 

الصورة الموجودة عند التحميل لم تعجبك ؟ لا يوجد إشكال إستعمل احد الصور التالية , فقط عوض :

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEjFNB8JneGg6yxvaY5ElI00QzrWYbWiDN53fduWM7PHAG41dAqLu4Hmas_VRZZee3sr0qvLZemYuCXb04Q5g7o4RsgKAqO22_-xgDh5O2sg_-Fk6Dsn6yBvt-3y7bgbpEL0g4XUwRI9W0/s1600/modawin-blogger4.gif

برابط الصورة التي تريدها.
إليك الصور :



الرابط :
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZihVlpDYO1ARsd2ZlX3lHlDqEp7ZB6cILyaYlQrTlsk4jfVsKetqjsAorZkp_90v6ezC6XqDu6lY54fO84k0Mbb-Yi09CVDfxiQWMu5PkqmQuetpLwIZV9EOk0j-PXIvqSUi8ao2KXOcx/s1600/modawin-blogger1.gif 

 

الرابط :
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8ZF88osfuomY8gahmIlSZfZ6c6XI5-akZrg99xiEDCNJw9pOccRG-l77HmKjGBGxLyh8rRyRWDb7VqQmLXPosJEmgNjkySC7xtAFL4dqkh73uM1LX0J3fbf7UiU9aOR9cMvTxqkYKk_7O/s1600/modawin-blogger2.gif




الرابط :
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgsE4YiR2oBd86SMsHSYH7kxuNFom_GG8frY9p1CD8T97C6FdUwfu2ietsR3shiplqNq1qERXwa6MqGSJy053H7tFWefbVHnV_4F-J5JBDPAgVao4qBpWUGXss1LijIVAnR1r44EdqbyhrV/s1600/modawin-blogger3.gif

الرابط :
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEjFNB8JneGg6yxvaY5ElI00QzrWYbWiDN53fduWM7PHAG41dAqLu4Hmas_VRZZee3sr0qvLZemYuCXb04Q5g7o4RsgKAqO22_-xgDh5O2sg_-Fk6Dsn6yBvt-3y7bgbpEL0g4XUwRI9W0/s1600/modawin-blogger4.gif