سلايد شو احترافى جدا بمميزات خرافيه يعمل حسب التسميات سلايد قالب تصميمي

سلايد شو جديد أقدمه لكم اليوم وهذا السلايد هو المستخدم فى قالب تصميمي الذى قمت بنشره على المدونة من قبل سوف تجده فى الموضوع تحميل أفضل وأسرع قالب تقني احترافى جدا قالب تصميمي ، ويكنك من خلال هذه الموضوع الحصول على القالب كامل ، ولكن اليوم سوف أقدم لكم سلايد شو الخاص بقالب تصميمي.

سلايد شو احترافى جدا بمميزات خرافيه يعمل حسب التسميات سلايد قالب تصميمي

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

معاينة السلايد 

معاينة 

صورة من السلايد

سلايد شو احترافى جدا بمميزات خرافيه يعمل حسب التسميات سلايد قالب تصميمي

شرح تركيب سلايد قالب تصميمي

سوف تبحث أولا عن هذا الوسم]]>وتقوم بضع الكود التالى فوقه

/* Slider */
.recent-slider{width:auto;padding:15px;background:#fff;border:1px solid #dddddd;border-top:3px solid #0B900C;margin-bottom:15px;position:relative;height:435px;overflow:hidden}
.nivoSlider,.top-l-slider .nivoSlider{width:100%;text-align:Center;overflow:hidden}
.nivo-box,.nivoSlider{overflow:hidden}
.nivoSlider{position:relative;height:400px}
.nivoSlider img{position:absolute;top:0;left:0;max-width:none;height:400px!important}
.top-l-slider .nivoSlider{position:relative;height:400px}
.top-l-slider .nivoSlider img{position:absolute;top:0;left:0;max-width:none;height:400px!important}
.nivo-main-image{display:block!important;position:relative!important;width:100%!important}
.nivoSlider a.nivo-imageLink{position:absolute;top:0;left:0;width:100%;height:100%;border:0;padding:0;margin:0;z-index:6;display:none;background:#fff;filter:alpha(opacity=0);opacity:0}
.nivo-box,.nivo-slice{z-index:5;position:absolute}
.nivo-box,.nivo-box img,.nivo-caption,.nivo-slice{display:block}
.nivo-slice{height:100%;top:0}
.nivo-caption{position:absolute;bottom:20px;left:20px;text-align:center;z-index:8;box-sizing:border-box;color:#fff;right:20px}
.nivo-caption p{text-align:right;display:inline-block;background-color:#000;margin-top:5px;font-size:11px;padding:10px;float:right}
.nivo-caption h3{text-align:right;padding:10px;background:#0B900C;float:right;font-size:18px;color:#fff}
.nivo-caption .sliderdata{margin:10px;text-align:Center;color:#fff}
.nivo-html-caption{display:none}
.nivo-directionNav a{position:absolute;top:45%;z-index:9;font-size:0;display:block;width:30px;height:30px;cursor:pointer;background-color:rgba(0,0,0,0.59)}
.nivo-prevNav{left:10px}
.nivo-nextNav:before,.nivo-prevNav:before{position:Absolute;left:0;top:0;color:#fff;height:30px;width:30px;text-align:center;z-index:100;display:block}
.nivo-prevNav:before{content:"\f104";line-height:30px!important;font-family:fontawesome;font-size:20px}
.nivo-nextNav:before{content:"\f105";line-height:30px!important;font-family:fontawesome;font-size:20px}
.nivo-nextNav{right:10px}
.nivo-controlNav{text-align:center;z-index:9;top:30px;font-size:0;position:absolute;right:25px}
.nivo-controlNav a{cursor:pointer;display:block;width:15px;height:15px;background:#FFF;float:right;border-radius:10px;margin-right:5px}
.nivo-controlNav a.active{background:#0B900C}

بعد ذلك سوف تبحث عن هذا الوسموتقوم بوضع الكود التالى فوقه او فى بعض القوالب سوف تجد الوسم بهذا الشكلضع ايضا الكود فوقه

الأن مع اخر كود وسوف تضعه فى المكان الذى تريده فى مدونتك

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

هذا كل شئ فى موضوع اليوم بالتوفيق للجميع وأنتظرونا بكل جديد بأذن الله على المدونة ، لا تنس مشاركة الموضوع حتى يتسفيد غيرك وأى مشكلة تجدها تضعها فى تعليق .