اضافة سلايد شو افقي لمدونات بلوجر 2015

السلام عليكم ورحمة الله تعالى وبركاته الكل يريد ان يعرض تدويناته داخل مدونته بطريقة رائعة وفريدة من نوعها فالكثير من المدونين يحثون عن السلايد شو المناسب لوضعه في مدونتهم فاليوم في تقني الانترنت احضرنا لكم سلايد شو افقي رائع يغرض اخر تدوينات الموقع بطريقة تلقائية ورائعة واضافته سهلة جدا ولا تتطلب اي تركيز ويتركب هذا السلايد شو من التخطيط بابسط طريقة.

معاينة

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

توجه لتخطيط ثم اضف اداة جديدة وضع الكود التالي في اداة جافا سكربت ومبروك عليك الاضافة.

<style> /* Css Slider Posts */ #featured-wrap {position: relative;height: 175px;margin: 0 auto;border-radius: 4px;} #featured {border: 0;outline: none;position: relative;width: 890px;height: 150px;overflow: hidden;top: 10px;margin: 0 auto;} .datex {display: none;} #featured ul{width:9999px} #featured ul,#featured li{list-style:none;padding:0;margin:0;overflow:hidden} #featured li {width: 150px;display: inline-block;float: left;height: 150px;background: #fff;} .thumb-featured {width: 130px;height: 100px;margin: 5px auto;border: 1px solid #fff;} .thumb-featured img {display: block;width: 134px;height: 94px;border: 1px solid #ddd;padding: 2px;cursor: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOxTnZ74ZR5F5k3JqKoza5hVKkCLrupQYQjxGGxbWFdvmpCesdr6fcTxEtjDBQ4yHo-3ZSVOsSBjjzBrAUnugRXKJfqiXjSu2nF9Yl6jcjLB-Y1pKMlV8n8EBt636wVH3VqHIFNZGbAA/s1600/Untitled-2.png),pointer;-moz-transition: all .3s ease 0s;} .title-featured {text-align: center;position: relative;margin: 0 4px;font: 10px Electrolize,ge_dinar_oneregular;} .title-featured a {color: #555;} .title-featured h4{overflow:hidden} .arrow {position: absolute;display: block;width: 32px;height: 32px;top: 60px;text-indent: -9999px;} .arrow.back {left: 13px;background: transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgDeJq11ooLE7ZF8avw_LEicGZCvw7hxmPibJInnV2CzSV9hoOlCyImxw4oG0rbIWtAPFElT0Wk0N_HiJMycVej4uOg39kwUixCdGGsLEhpxbELl157BXLPgLPCxL4Cmm60eULbRg1tgl0/s1600/lefthm.png)no-repeat;} .arrow.forward {background-position: 100% 50%;right: 10px;background: transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhj1fO52aVa8t_4BKhH1D0WqPibGX4YrMJWoeJDgavSgWPoNFFpriAZZsrhFqzS867oIXH7eAgIHIMV9F8Pabh25ep5cpCb8rwXtV3GJT3MfjBDfFsiKmudhyphenhyphenN1lnrQ9EOcvSw2XIuHdg8/s1600/righthm.png)no-repeat;} span.slideloading{text-indent:-9999px;margin:50px auto;font-family:Electrolize,ge_dinar_tworegular} </style> <div id='featured-wrap'> <div id='featured'> <span class='slideloading'>جاري التحميل ...</span> </div> </div> <script src='https://ar1web-com.googlecode.com/svn/Hm/slider-iHussam.js'/>

مصدر الكود مدونة عرب ويب

ارجو ان تكون الاضافة قد اعجبتكم تابعو مدونتنا للمزيد من الاضافات والقوالب الرائعة