[Slideshow] إضافة سلايدر شو تلقائي احترافي بلوجر 2014

السلام عليكم ورحمة الله وبركاتة متابعي مدونة المطور .نت

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

صورة السلايدر شو

في البداية قم بالبحث عن
ضع فوقها الكود الاتي

 

 

 

 

ثانياً قم بالبحث عن ]]>
ضع فوقها .

/* Featured Post
----------------------------------------------- */
.featuredpost.box_skitter.box_skitter_home.maxxiz-theme {
padding:4px;
background-color:#FDFDFD;
box-shadow:0 1px 5px #BDBDBD;
-moz-box-shadow:0 1px 5px #BDBDBD;
-webkit-box-shadow:0 1px 5px #BDBDBD;
-webkit-border-radius:3px;
-moz-border-radius:3px;
border-radius:3px;
position:relative;
z-index:88;
margin-bottom:15px;height: 250px;
}
.box_skitter_home.maxxiz-theme .prev_button,
.box_skitter_home.maxxiz-theme .next_button,
.box_skitter_home.maxxiz-theme .info_slide_dots {
background-color:#F3F3F3;
background:-moz-linear-gradient(top,#FFFFFF 0%,#F3F3F3 100%);
background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#FFFFFF),color-stop(100%,#F3F3F3));
background:-webkit-linear-gradient(top,#FFFFFF 0%,#F3F3F3 100%);
background:-o-linear-gradient(top,#FFFFFF 0%,#F3F3F3 100%);
background:-ms-linear-gradient(top,#FFFFFF 0%,#F3F3F3 100%);
background:linear-gradient(top,#FFFFFF 0%,#F3F3F3 100%);
transition:background-color linear .3s;
-moz-transition:background-color linear .3s;
-webkit-transition:background-color linear .3s;
-o-transition:background-color linear .3s;
outline:0;
}
#autorslidertop {
padding:4px;
border:1px solid #DDD;
background-color:white;
box-shadow:0 1px 5px rgba(0,0,0,.15);
-moz-box-shadow:0 1px 5px rgba(0,0,0,.15);
-webkit-box-shadow:0 1px 5px rgba(0,0,0,.15);
-webkit-border-radius:3px;
-moz-border-radius:3px;
border-radius:3px;
}
.box_skitter ul {
display:none;
}
.box_skitter .container_skitter {
overflow:hidden;
position:relative;
width:100% !important;
height:100% !important;
max-width:100%;
}
.box_skitter .image {
overflow:hidden;
max-width:100%;
max-height:100%;
height:250px;
}
.box_skitter .image > a {
display:block;
height:250px;
}
.box_skitter .image img {
display:none;
width:100%;
height:100%;
max-height:100%;
}
.box_skitter .box_clone {
position:absolute;
top:0;
left:0;
width:100px;
overflow:hidden;
display:none;
z-index:20;
}
.box_skitter img {
max-width:none;
}
.box_skitter .box_clone img {
position:absolute;
top:0;
width:780px;
height:250px;
max-width:780px;
left:0;
z-index:19;
}
.box_skitter .prev_button {
position:absolute;
top:50%;
left:35px;
z-index:100;
width:42px;
height:42px;
overflow:hidden;
text-indent:-9999em;
margin-top:-25px;
}
.box_skitter .next_button {
position:absolute;
top:50%;
right:35px;
z-index:100;
width:42px;
height:42px;
overflow:hidden;
text-indent:-9999em;
margin-top:-25px;
}
.box_skitter .info_slide {
position:absolute;
top:15px;
left:15px;
z-index:100;
background:#000;
color:#FFFFFF;
font:padding:5px 0 5px 5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
opacity:0.75;
}
.box_skitter .info_slide .image_number {
background:#333;
float:left;
padding:2px 10px;
margin:0 5px 0 0;
cursor:pointer;
-moz-border-radius:2px;
-webkit-border-radius:2px;
border-radius:2px;
}
.box_skitter .info_slide .image_number_select {
background:#c00;
float:left;
padding:2px 10px;
margin:0 5px 0 0;
}
.box_skitter .container_thumbs {
position:relative;
overflow:hidden;
height:50px;
}
.box_skitter .info_slide_thumb {
-moz-border-radius:0;
-webkit-border-radius:0;
border-radius:0;
overflow:hidden;
height:45px;
top:auto;
bottom:-5px;
left:-5px;
padding:5px;
opacity:1.0;
}
.box_skitter .info_slide_thumb .image_number {
overflow:hidden;
width:70px;
height:40px;
position:relative;
}
.box_skitter .info_slide_thumb .image_number img {
position:absolute;
top:-50px;
left:-50px;
}
.box_skitter .box_scroll_thumbs {
padding:0 10px;
}
.box_skitter .box_scroll_thumbs .scroll_thumbs {
position:absolute;
bottom:60px;
left:50px;
background:#ccc;
background:-moz-linear-gradient(-90deg,#555,#fff);
background:-webkit-gradient(linear,left top,left bottom,from(#555),to(#fff));
width:200px;
height:10px;
overflow:hidden;
text-indent:-9999em;
z-index:101;
-moz-border-radius:20px;
-webkit-border-radius:20px;
border-radius:20px;
cursor:pointer;
border:1px solid #333;
}
.box_skitter .info_slide_dots {
position:absolute;
bottom:-40px;
z-index:151;
padding:5px 0 5px 5px;
-moz-border-radius:50px;
-webkit-border-radius:50px;
border-radius:50px;
}
.box_skitter .info_slide_dots .image_number {
background:#333;
float:left;
margin:0 5px 0 0;
cursor:pointer;
-moz-border-radius:50px;
-webkit-border-radius:50px;
border-radius:50px;
width:18px;
height:18px;
text-indent:-9999em;
outline:0;
overflow:hidden;
}
.box_skitter .info_slide_dots .image_number_select {
background:#c00;
float:left;
margin:0 5px 0 0;
}
.box_skitter .label_skitter {
z-index:80;
position:absolute;
bottom:0;
left:0;
display:none;
}
.loading {
position:absolute;
top:50%;
right:50%;
z-index:10000;
margin:-16px -16px;
color:#FFFFFF;
text-indent:-9999em;
overflow:hidden;
background:#FFFFFF no-repeat left top;
width:32px;
height:32px;
}
.label_skitter {
z-index:150;
position:absolute;
bottom:0;
left:0;
color:#FFFFFF;
display:none;
opacity:0.9;
}
.label_skitter p {
padding:5px;
margin:0;
}
.info_slide * {}
.box_skitter .progressbar {
background:#000;
position:absolute;
bottom:5px;
left:10px;
height:5px;
width:940px;
z-index:99;
border-radius:20px;
}
.preview_slide {
display:none;
position:absolute;
z-index:999;
bottom:40px;
left:-40px;
width:100px;
height:50px;
border:3px solid #FFFFFF;
background:rgba(0,0,0,.5);
-moz-box-shadow:rgba(0,0,0,0.7) 0 0 10px;
-webkit-box-shadow:rgba(0,0,0,0.7) 0 0 10px;
box-shadow:rgba(0,0,0,0.7) 0 0 10px;
overflow:hidden;
}
.preview_slide ul {
width:100px;
height:50px;
padding:0;
overflow:hidden;
margin:0;
list-style:none;
display:block;
position:absolute;
top:0;
left:0;
}
.preview_slide ul li {
width:100px;
height:55px;
overflow:hidden;
float:left;
margin:0;
padding:0;
position:relative;
display:block;
}
.preview_slide ul li img {
position:absolute;
top:0;
left:0;
height:55px;
width:100px;
}
#overlay_skitter {
position:absolute;
top:0;
left:0;
width:100%;
z-index:9998;
opacity:1;
background:#000;
}
.box_skitter_home {
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiuENsRud0J61C8TiwWUfBL_EgAhrImGcdjMMWWT4eAyL_cOZTx8BPj-xfJAg_ZVj3wuy0jju3IH73v2sI70eP_be5Ybdg-DfO1tb71Wj7aZyPA5Ipv1YXJ-wwRoVeFR_I6wqe9JnEKO_U/s1600/anim_loading_sm_082208.gif);
background-position:center center;
background-repeat:no-repeat;
}
.box_skitter_home.maxxiz-theme .prev_button,
.box_skitter_home.maxxiz-theme .next_button,
.box_skitter_home.maxxiz-theme .info_slide_dots {
border:1px solid #FFFFFF;
box-shadow:0 1px 3px #BDBDBD;
-moz-box-shadow:0 1px 3px #BDBDBD;
-webkit-box-shadow:0 1px 3px #BDBDBD;
-moz-border-radius:0;
-webkit-border-radius:0;
border-radius:0;
}
.box_skitter_home.maxxiz-theme .info_slide {}
.box_skitter_home.maxxiz-theme .info_slide_dots {
bottom:-14px;
height:30px;
padding:0 4px;
z-index:99;
left:43% !important;
margin-left:-59px;
}
.box_skitter_home.maxxiz-theme .info_slide_dots span {
transition:background linear .3s;
-webkit-transition:background linear .3s;
-moz-transition:background linear .3s;
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjbzYPsO5krD7d-Dnm6UNLEsl5itxdMnWO9C8kS9IfuJuNSVqfLWJvezJ0C5obMNiB8P1QFQeQZfgj0fdLU81zzQrpVajsErLl5iQtdpojlxxDtusRxl11d4DGp8Rq0pr9u7zyPG5-paeI/s1600/light-overlay.png);
background-repeat:repeat-x;
background-position:left -13px;
background-color:#d1d1d1;
color:#777777;
-webkit-border-radius:50%;
-moz-border-radius:50%;
border-radius:50%;
border-bottom:1px solid #FFFFFF;
display:block;
width:10px;
height:10px;
text-indent:-9999px;
float:left;
margin:10px 6px 0 6px;
}
.box_skitter_home.maxxiz-theme .info_slide_dots span:hover {
background-color:#777777;
}
.box_skitter_home.maxxiz-theme .info_slide_dots span.image_number_select {
background-color:#F0BF4A;
border:none;
width:14px;
height:14px;
margin:8px 3px 0 3px;
box-shadow:inset 1px 0 0 rgba(0,0,0,.1),inset -1px 0 0 rgba(0,0,0,.1),inset 0 1px 0 rgba(0,0,0,.1),inset 0 -1px 0 rgba(0,0,0,.1);
-webkit-box-shadow:inset 1px 0 0 rgba(0,0,0,.1),inset -1px 0 0 rgba(0,0,0,.1),inset 0 1px 0 rgba(0,0,0,.1),inset 0 -1px 0 rgba(0,0,0,.1);
-moz-box-shadow:inset 1px 0 0 rgba(0,0,0,.1),inset -1px 0 0 rgba(0,0,0,.1),inset 0 1px 0 rgba(0,0,0,.1),inset 0 -1px 0 rgba(0,0,0,.1);
}
.box_skitter_home.maxxiz-theme .prev_button,
.box_skitter_home.maxxiz-theme .next_button {
display:block;
width:75px;
height:22px;
line-height:30px;
text-decoration:none;
font-size:10px;
text-transform:uppercase;
transition:none;
-webkit-transition:none;
-o-transition:none;
-moz-transition:none;
text-indent:0;
bottom:-11px;
top:auto;
color:#777777;
z-index:98;
cursor:pointer;
}
.box_skitter_home.maxxiz-theme .prev_button:hover,
.box_skitter_home.maxxiz-theme .next_button:hover,
.box_skitter_home.maxxiz-theme .prev_button:active,
.box_skitter_home.maxxiz-theme .next_button:active {
opacity:1 !important;
}
.box_skitter_home.maxxiz-theme .next_button {
right:22.5%;
padding-right:5px;
text-align:right;
line-height:22px;
opacity:1 !important;
}
.box_skitter_home.maxxiz-theme .next_button span {
padding-right:20px;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiwkVRecoeDIXbr9jjeFtuY38aBi_Fzmp9AKPkPQmT5z_Lf1P2kDmStiw_yOKUjMo_tpimSUzHhaulfEJj0vW8pxJJ4ZNOrDphvBznsoMOCYi737vYz0z4qmaqP_D7Hyqgf9fcFs0yIW7I/s1600/nav-next.png) no-repeat left top;
background-position:right center;
padding-bottom:1px;
display:block;
}
.box_skitter_home.maxxiz-theme .prev_button {
left:22.5%;
padding-left:5px;
text-align:left;
line-height:22px;
opacity:1 !important;
}
.box_skitter_home.maxxiz-theme .prev_button span {
padding-left:20px;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfulheXTJflrcETfIl7_6Sdr5VePZ_73MiWTS_LKXZuvM2sqpwkPQaHxObOLNmfBA9CMGJF7-PivnqBgxFtZEpLpyjZXzjqt-S2JmxkABk7zDGX8etl-WleZWLLCatRkwLmm6X35nFW4c/s1600/nav-prev.png) no-repeat left top;
background-position:left center;
padding-bottom:1px;
display:block;
}
.box_skitter_home.maxxiz-theme .label_skitter {
width:90%;
padding:0;
left:50%;
margin-left:-45%;
bottom:10%;
text-align:right;
height:auto;
color:white;
}
.box_skitter_home.maxxiz-theme .label_skitter .inner {
padding:5px 8px 5px;
background:#F0BF4A;
border-right:5px solid white;
border-left:5px solid white;
}
.box_skitter_home.maxxiz-theme .label_skitter p {
padding:0;
margin-top:5px;
margin-bottom:5px;
font-size: 11px;
text-shadow:0 1px 0 rgba(0,0,0,0.3);
}
.box_skitter_home.maxxiz-theme .label_skitter strong {
margin-top:0;
line-height:20px !important;
font-size:15px;
text-shadow:0 1px 0 rgba(0,0,0,.3);
color:white;
}
.box_skitter_home.maxxiz-theme .label_skitter a {
color: #333;
text-decoration: none;
font-family: arial,tahoma;
font-size: 17px;
text-shadow: 1px 1px #E2D6A7;
}
.box_skitter_home.maxxiz-theme .label_skitter a:hover {
color:#555;
}
.box_skitter_home.maxxiz-theme .info_slide_thumb {
background-color:#FFFFFF;
}
.box_skitter.maxxiz-theme .info_slide_thumb .image_number {
margin:5px;
}
.box_skitter .container_skitter .date,
.box_skitter .container_skitter .cm {
font-size:8px;
}
.box_skitter .container_skitter .date span {
margin-right:3px;
}
#autoslidenya .widget-content,
#manualslidenya1 .featuredarea {
margin:0;
padding:2px;
}
#manualslidenya1 .featuredarea {
margin:0 0 15px;
}

  الان قم بالتوجة الى التخطيط من لوحة تحكم بلوجر الخاص بك 

ثم اضغط على اضافة اداة 

وقم باضافة الكود الاتي

        

 

 نأتي لتخصيص الاضافة 

استبدل رابط مدونتك باللون الاحمر 

اللون البرتقالي لعدد التدوينات يمكنك تغيره بالعدد الذي تريد

اللون الازرق بالتسمية التي تريد 

تحميل الاكواد