طريقة تركيب سلايدر شو جد احترافي بطريقة مبسطة جدا

اولا نترككم مع المعاينة

يوضع في السلايد بار للمدونة

طريقة التركيب

1/ الادارة
2/ التخطيط ونضيف اداة جديدة
3/ نضع الكود التالي
رمز Code:

.s3slider {
margin:0 auto 10px;
border:2px solid white;
background:white none no-repeat 50% 50%;
-webkit-box-shadow:0 1px 3px rgba(0,0,0,.4),0 7px 10px -3px rgba(0,0,0,.4);
-moz-box-shadow:0 1px 3px rgba(0,0,0,.4),0 7px 10px -3px rgba(0,0,0,.4);
box-shadow:0 1px 3px rgba(0,0,0,.4),0 7px 10px -3px rgba(0,0,0,.4);
position:relative;
overflow:hidden;
}
.s3slider.loading {
background-image:url('data:image/gif;base64,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');
text-indent:-9999px;
}
.s3slider-content,
.s3slider-content li {
position:absolute;
top:0;
right:0;
bottom:0;
left:0;
margin:0;
padding:0;
list-style:none;
overflow:hidden;
}
.s3slider-content li {
position:static;
display:none;
}
.s3slider-content img {
display:block;
width:100%;
height:100%;
max-width:none;
max-height:none;
border:none;
outline:none;
padding:0;
margin:0;
}
.s3slider-caption {
position:absolute;
right:0;
bottom:0;
left:0;
height:auto;
font:normal normal 11px/normal GESSTwoMediumRegular;
color:white;
background-color:black;
opacity:.8;
filter:alpha(opacity=80);

padding:7px 10px 10px;
display:none;
}
.s3slider-title,
.s3slider-meta {display:block}
.s3slider-title a {
font-size:110%;
font-weight:bold;
color:white;
text-decoration:none;
}
.s3slider-title a:focus,
.s3slider-title a:hover {text-decoration:underline}
.s3slider-meta-comment:before {content:" - "}

Memuat...

4/ نغير مدونة المبدع برابط مدونتك
5 نحفظ العمل ونرى النتيجة

اي استفسار في طريقة التركيب يرجى مراسلتي او ترك تعليق
جميع الحقوق محفوظة لمدونة المبدع