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

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

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

تحميل مرفقات الإضافة

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

نتوجه الى المدونة
ثم قالب ،
تحرير HTML
نبحث عن الكود الثالي

ثم نضيف الكود الثالي فوقه " قبل الوسم

نبحث مرة أخرى عن الوسم

ثم نضيف الكود التالي فوقه " قبل الوسم

نبحث عن الكود

]]>

ثم نضيف الكود التالي قبله - فوقه

/*--------------Slider-------------*/
#alwansd{
height: 276px;
margin: 0 auto;
padding: 18px;
background: #fbfbfb;
width: 1229px;
margin-right: -132px;
border-bottom: 2px solid #E6E6E6;
position: relative;
}
.alwanw{
position: relative;
height: 241px;
width: 78%;
margin: 0 auto;
}
.alwanw .contentdiv{
visibility: hidden;
opacity: 1;
position: absolute;
height: 240px;
}
.alwan-ps{
text-align: right;
float: left;
width: 490px;
height: 13px;
margin: 0 auto;
}
.alwan-ps .toc {
float: right;
font-size: 0;
width: 13px;
height: 13px;
background: #e74c3c;
margin-left: 8px;
border-radius: 60px;
}
.alwan-ps .selected {background: #95A5A6;}
.alwan-ps .prev ,.alwan-ps .next{
display:none;
}
.alwan-ps .next:hover{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinU2Kq3LK7oCOjWaznI3zI83ziPyuUVsAWGaAFX7tlaqFkMdLIhzla_pSWIzjFEftQ2wpjBsnRMrs2l6QhNTtD54Rn7wJel44T8GbQLNTF6qkxIbz_bhugPq12u49WRqr9iA8fSVWM6mg/s1600/next-h.png);}
.alwanip{
width: 486px;
float: left !important;
padding: 0 37px 0 0;
margin: 0 auto;
}
.alwanip a{
color: #2c3e50;
font: 19px DroidKufi-Bold;
margin: 0 auto;
line-height: 37px;
}
.post-body img {
margin: -1px 0 0 8px;
padding: 3px;
border: 1px solid #dfdfdf;
border-radius: 3px;
}
.alwanip h6{margin: 0;}
.alwanip h6 a:hover {color:#95A5A6;}
.alwanip .alwand{
color:#fff;
}
.alwanip p{
margin: 0 auto;
color: #95A5A6;
font-family: hacen_liner;
}
.alwansf {
float: right !important;
margin:0 auto;
}
.alwansf a img {
width: 435px;
height: 275px;}
.alwansf a img:hover{
}
.alwansf a img:hover {
-webkit-transform: scale(1.1);
-moz-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1);
-webkit-transition: -webkit-transform 0.4s;
-moz-transition: -moz-transform 0.4s;
transition: transform 0.4s;
}