مرحباً بكم زواري واصدقائي
اليوم لدينا لكم اضافة جديده وهي عبارة عن قائمة لكن شكلها احترافي وممبز
طريقة التركيب كما تعودنا دائماً ^_^
1- الذهاب الى لوحة التحكم
2- انقر على تخطيط
3- اختار اضافة اداة
4- اختر اداة الـ html/javascript
ضع الكود ادناه
الكود
<style>
.category {
width: 182px;
float: left;
border-top: 8px solid #CCC;
display:block
margin: 0px;
padding: 6px 10px 15px 10px;
background: #FFF;
font-size: 1.2em;
font-family: georgia, times new roman, verdana;
font-weight: bold;
cursor: pointer;
text-shadow: 0 0 2px #CCC;
letter-spacing: inherit;
}
.category p {
margin: 0px;
font-family: Tahoma, 'Trebuchet MS', 'Lucida Grande', Verdana, Arial, Sans-Serif;
font-size: 11px;
font-weight: normal;
color: #444;
letter-spacing: .03em;
}
#middle {
margin: 0 auto;
background: #FAFAFA;
width: 1010px;
border-left: 1px solid #F8F8F8;
border-right: 1px solid #F8F8F8;
}
#cat-4 {border-top: 8px solid #FF95F9;}
#cat-4:hover {background: #FF95F9;}
#cat-5 {border-top: 8px solid #9CFFB1;}
#cat-5:hover {background: #9CFFB1;}
#cat-6 {border-top: 8px solid #FF6767;}
#cat-6:hover {background: #FF6767;}
#cat-8 {border-top: 8px solid #9CDBFF;}
#cat-8:hover {background: #9CDBFF;}
#cat-9 {border-top: 8px solid #FFD29C;}
#cat-9:hover {background: #FFD29C;}
.category span.cat_title, #front-popular h3, #front-list .cat_title, #gallery h3 {
text-transform: lowercase;margin: 0;}
</style>
<div class='clearfloat' id='middle'>
<div class='category' id='cat-4' onclick='window.location.href='http://www.add-b.blogspot.com/';'>
<span class='cat_title'>اسم-الموضوع</span><p>وصف-الموضوع</p></div>
<div class='category' id='cat-5' onclick='window.location.href='http://www.add-b.blogspot.com/';'>
<span class='cat_title'>اسم-الموضوع</span><p>وصف-الموضوع</p></div>
<div class='category' id='cat-6' onclick='window.location.href='http://www.add-b.blogspot.com/';'>
<span class='cat_title'>اسم-الموضوع</span><p>وصف-الموضوع</p></div>
<div class='category' id='cat-8' onclick='window.location.href='http://www.add-b.blogspot.com';'>
<span class='cat_title'>اسم-الموضوع</span><p>وصف-الموضوع</p></div>
<div class='category' id='cat-9' onclick='window.location.href='http://www.add-b.blogspot.com/';'>
<span class='cat_title'>اسم-الموضوع</span><p>وصف-الموضوع</p></div></div>
التعديلات على الكود :
استبدل ( اسم-الموضوع ) بالعنوان القسم الذي ترغب فيه
استبدل ( وصف-الموضوع ) بفقرة صغيرة تكون هي وصف القسم
استبدل رابط مدونتي بالقسم
نتمنى ان الاضافة نالت اعجابكم
دمتم بود