بسم الله الرحمن الرحيم والصلاة علي رسول الله سيدنا محمد صلي الله عليه وسلم أما بعد احبائي في الله اقدم لكم اليوم موضوع جميل جدا ويحتاجه الكتير وهو عن اضافة سلايدشو يدوي احترافي لمدونات بلوجر مثل الموجود في مدونة عمرو ويب ويمكنك معيانته عبر الرابط تالي من هنا والان تابع معي طريقة تركيب علي مدونة بلوجر
اول شيئ قم بدهاب الي لوحة تحكم مدونتك من هنا ثم اختر مدونتك ثم قالب ثم تحرير HTML
ثم ابحث عن
وضع بعده تماما الكود تالي
لتحميل الكود اضغط هنا
ثانيا : قم بالبحث عن الوسم تالي ]]>
وضع قبله تماما الكود تالي
وضع قبله تماما الكود تالي
لتحميل الكود اضغط هنا
/* top slider */
position:relative;
display:block;
width:940px;
height:240px;
overflow:hidden;
margin:18px auto -15px;
margin-top: 0px;
}
.works .slide-works{
width:972px;
}
.works h2{
display: inline-block;
height: 20px;
font-family: ge_dinar, arial, tahoma;
font-size: 18px;
color: #535353;
font-weight: normal;
line-height: 20px;
padding-right: 15px;
border-right: 3px solid #e71a1f;
float: right;
}
#nav-work{
position:absolute;
left:0; top:0;
z-index:999;
width:38px;
height:18px;
}
#nav-work #prev{ width:18px; height:18px; float:left; background:#f9f8f8 url(http://khadamatplus.com/wp-content/themes/alwan/img/nav.png) no-repeat scroll 0 0; }
#nav-work #prev:hover{ background:rgb(235, 235, 235) url(http://khadamatplus.com/wp-content/themes/alwan/img/nav.png) no-repeat scroll 0 0; }
#nav-work #next{ width:18px; height:18px; float:right; background:#f9f8f8 url(http://khadamatplus.com/wp-content/themes/alwan/img/nav.png) no-repeat scroll -19px 0; }
#nav-work #next:hover{ background:rgb(235, 235, 235) url(http://khadamatplus.com/wp-content/themes/alwan/img/nav.png) no-repeat scroll -19px 0; }
.list-works{
width:972px;
height:210px;
}
.list-works .work{
position:relative;
display:block;
width:210px;
height:200px;
float:right;
margin-left:33px;
text-decoration:none;
}
.list-works .work .pic{
display: table-caption;
width:210px;
height:140px;
overflow:hidden;
background:#F9F8F8;
text-align:center;
vertical-align:middle;
}
.list-works .work .hover-pic{
position:absolute;
left:0; top:0;
z-index:99;
display: block;
width:210px;
height:140px;
overflow:hidden;
transition: all 0.5s ease-out;
}
.list-works a.work:hover .hover-pic{ background:url(http://im54.gulfup.com/fT8fg5.png) center no-repeat, url(http://im67.gulfup.com/9ka0zL.png);}
.list-works a.work:hover .detail-work{ background:#152836;}
.list-works a.work:hover .detail-work .titre-work{ color:#fff;}
.detail-work{
display:block;
width:200px;
height:50px;
padding:5px;
background-color: #152836;
margin-top:3px;
font-family:'tahoma;
font-size:11px;
color:#fff;
line-height:11px;
text-align:center;
transition: all 0.5s ease-out;
}
.detail-work .titre-work{
font-family:ge_dinar, arial, tahoma;
font-size:14px;
color:#fff;
font-weight:normal;
line-height:26px;
text-align:center;
transition: all 0.5s ease-out;
width: 100%;
display: table;
}
.works2 { display:none; width:748px;}
.works2 .list-works{width: 804px; }
.works2 .list-works .slide-works {width: 804px;}
.works2 .list-works .work{ margin-left:58px;}
.works{
ثم قم بعمل حفظ النمودج ومبروك عليك السلايدر والان انتها الموضوع اتمنا ان يكون نال اعجابكم لاتنسا وضع تعليق بتقيمك
تصميم : مودي بولس
للموضوع وسلام عليكم ورحمته الله وبركاته
تصميم : مودي بولس
للموضوع وسلام عليكم ورحمته الله وبركاته
0 التعليقات:
إرسال تعليق