إضافة سلايدرشو احترافي إلى مدونة بلوجر

السلام عليكم ورحمة الله
في هذا الموضوع سنعرض كيفية إضافة سلايدرشو احترافي إلى مدونة بلوجر بكل سهولة ودون اللجوء إلى التعديل على القالب. وكل ما عليك فعله هو:



1- الذهاب إلى تخطيط
2- اختيار أداة جديدة
3- نختار أداة HTML/JAVASCRIPT
4- لا يجب أن نضع عنوان بل الذهاب مباشرة إلى المكان المخصص لإضافة الكود حتى لا تظهر الإضافة بالصفحة الرئيسية.
5- نقوم بلصق الكود التالي:
رمز Code:

#slides *{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}
#slides ul,#slides li{padding:0;margin:0;list-style:none;position:relative}
#slides ul{height:250px}
#slides li{width:49.9%;height:100%;position:absolute;displ ay:none}
#slides li:nth-child(1), #slides li:nth-child(2), #slides li:nth-child(3), #slides li:nth-child(4){display:block}
#slides li:nth-child(1){left:0;top:0}
#slides li:nth-child(2){left:50.1%;width:24.8%;height:49.8%}
#slides li:nth-child(3){left:75.2%;width:24.8%;height:49.8%}
#slides li:nth-child(4){left:50.1%;top:50.2%;height:49.9%}
#slides a{display:block;width:100%;height:100%;overflow:hi dden}
#slides img{display:block;width:100%;height:100%;border:0; padding:4px;background-color:#0097BD;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px}
#slides .overlayx{width:100%;height:100%;position:absolute ;z-index:2;background-image:url(http://softglad.at.ua/images/fadebg....d-position:50% 50%;background-repeat:repeat-x;border:4px solid #00BD79;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px}
#slides h4{position:absolute;bottom:30px;margin:0;font-size:18px;font-family:Arial;left:0;padding:0 10px;color:white;z-index:3;line-height:20px;font-weight:normal}
#slides li:nth-child(2) h4,#slides li:nth-child(3) h4{font-size:13px;line-height:15px}
#slides .label_text{font-size:9px;color:white;bottom:10px;z-index:3;left:10px;font-family:Verdana,Geneva,sans-serif;position:absolute}
#slides li:nth-child(2) .autname,#slides li:nth-child(3) .autname{display:none}
#slides .overlayx,#slides li{-webkit-transition:all .4s ease-in-out;-moz-transition:all .4s ease-in-out;-o-transition:all .4s ease-in-out;-ms-transition:all .4s ease-in-out;transition:all .4s ease-in-out}
#slides li:hover .overlayx{-ms-filter:"progid:DXImageTransform.Microsoft. Alpha(Opacity=10)";filter:alpha(opacity=10);-khtml-opacity:0.1;-moz-opacity:0.1;opacity:0.1}
#buttons{margin: 5px auto;text-align: center;background:#00BD79;width: 10%;}
#buttons a{display:inline-block;text-indent:-9999px;width:15px;height:25px;position:relative}
#buttons a::before{content:"";width:0;height:0;border-width:8px 7px;border-style:solid;border-color:transparent #535353 transparent transparent;position:absolute;top:50%;margin-top:-8px;margin-left:-10px;left:50%}
#buttons a#nextx::before{border-color:transparent transparent transparent #535353;margin-left:-3px}
@media only screen and (max-width:600px){
#slides ul{height:600px}
#slides li:nth-child(1){width:100%;height:49.8%}
#slides li:nth-child(2){top:50.2%;height:24.8%;left:0;width:49.8% }
#slides li:nth-child(3){left:50.2%;top:50.2%;width:49.8%;height:2 4.8%}
#slides li:nth-child(4){left:0;top:75.3%;height:24.8%;width:100%}
}






6- نضع الإصافة الجديدة فوق رسائل المدونة مباشرة
7- نقوم بحفظ الترتيب
ومبروك عليك السلايدر شو الاحترافي
ولمعاينته السلايدرشو وشكله إليكم الرابط التالي: معاينة
وكل ما عليكم فعله هو تغيير رابط المدونة إلى رابط مدونتكم
ملحوظة: السلايدر شو يعمل بشكل تلقائي دون الحاجة إلى تخصيص قسم معين لتظهر مواضيعه به بل تظهر به كل المشاركات الجديدة وفي مختلف الأقسام
تحيتي لكم

أكثر...