اضافة لعرض مواضيع المدونة بتقنية jquery
كود:
ul.slideshow {
list-style:none;
width:600px;
height:200px;
overflow:hidden;
position:relative;
margin:0;
padding:0;
}
ul.slideshow li {
position:absolute;
right:0;
left:0;
}
ul.slideshow li.show {
z-index:500;
}
ul img {
border:none;
}
#slideshow-caption {
width:600px;
height:65px;
position:absolute;
bottom:0;
right:0;
color:#fff;
background:#055373;
z-index:500;
}
#slideshow-caption .slideshow-caption-container {
padding:5px 10px;
z-index:1000;
}
#slideshow-caption h3 {
margin:0;
padding:0;
font-size:14px;
font-weight:bold;
font-align: center;
font-family:tahoma;
}
#slideshow-caption p {
font-size:11px;
margin:5px 0 0 0;
padding:0;
font-family:tahoma;
}
3- احفظ القالب ،،،
4- اذهب الى التخطيط - ثم اختر اضف اداة HTML/JavaScript - ثم انسخ الكود التالي والصقه داخله :
كود:
<ul class='slideshow'>
<li><a href='رابط الموضوع المختارة'><img alt='الوصف الخاص بالرابط' height='200' src='رابط الصورة' title='عنوان الموضوع' width='600'/></a></li>
<li><a href='رابط الموضوع المختارة'><img alt='الوصف الخاص بالرابط' height='200' src='رابط الصورة' title='عنوان الموضوع' width='600'/></a></li>
<li><a href='رابط الموضوع المختارة'><img alt=' الوصف الخاص بالرابط' height='200' src='رابط الصورة' title='عنوان الموضوع' width='600'/></a></li>
<li><a href='رابط الموضوع المختارة'><img alt=' الوصف الخاص بالرابط ' height='200' src='رابط الصورة' title='عنوان الموضوع' width='600'/></a></li>
<li><a href='رابط الموضوع المختارة'><img alt='الوصف الخاص بالرابط' height='200' src='رابط الصورة' title='عنوان الموضوع' width='600'/></a></li>
</ul>
غير مايلزم من الكود السابق كالرابط الصورة والوصف الخاص بالموضوع ورابط الموضوع علما بان ارتفاع الصورة 200 وعرضها 600 وبامكانك التعديل عليها
- احفظ الاداة وقم بنقلها الى اعلى رسائل المدونة الالكترونية
