اضافة قائمة افقية لمدونتك بشكل جذاب

اضافة قائمة افقية..

اضافة احببتها كثيراً..

كيفية وضعها في مدونتك..

في البدايه سنضع كود هذة الاداه في منسق الـــHTML

الخطوات:

1.سجل دخولك لمدونتك ------> تصميم ------> تحرير HTML

2. ابحث عن كلمة ]]></b:skin> في الاسفل.

للمساعدة على البحث: اضغط F3 ثم ضع الكلمة المراد البحث عنها.

3.انسخ الكود الذي تراه في المربع في الاسفل.. والصقه بعد ]]></b:skin> مباشرتاً

 

<style type='text/css'>
#top_navigation {
background : transparent;
width: 800px;
height : 77px;
list-style : none;
margin-top : 7px;
margin-bottom : 11px;
width : 100%;
}
ul.nav {
background : transparent;
width: 800px;
height : 57px;
line-height : 31px;
list-style : none;
padding : 0 10px;
font-size : 14px;
}
ul.nav li {
display : inline;
padding : 0;
background : transparent;
}
ul.nav a {
background : transparent;
height : 30px;
font-size : 16px;
color : #808080;
float : left;
padding : 11px 19px 11px 16px;
text-decoration : none;
border-top: 1px solid #252525;
border-bottom : 4px solid #252525;
border-left : 1px solid transparent;
border-right : 1px solid transparent;
border-radius : 4px;
-moz-border-radius : 4px;
-webkit-border-radius: 4px;
}
ul.nav a:hover {
background : #252525;
border-top : 1px solid #252525;
border-bottom : 4px solid #000;
border-left : 1px solid #252525;
border-right : 1px solid #252525;
color : #FFF;
padding : 11px 19px 11px 16px;
border-radius : 4px;
-moz-border-radius : 4px;
-webkit-border-radius: 4px;
}
</style>

4. قم بحفظ عملك.

5. الان اضغط على عناصر الصفحة ------> إضافة أداه

6. ثم اختر 'HTML/Javascript'  من القائمة.. والصق فيه الكود الذي تراه في المربع السفلي.

<div id="top_navigation">
<ul class="nav">
<li><a href="Url here 1"> Home </a></li>
<li><a href="Url here 2"> Your Blog </a></li>
<li><a href="Url here 3"> About You </a></li>
<li><a href="Url here 4"> More stuff </a></li>
<li><a href="Url here 5"> Contact </a></li></ul>
</div>

ملاحظة: 
- من الكلمات الملونه باللون البنفسجي تستطيع تغيير اسماء التبويبات في القائمة الافقية.
- ومن الكلمات الملونة باللون الاحمر.. يجب ن تضع الرابط الذي تريده.

7. احفظ عملك.. وها انت قد انتهيت..

اتمنى لكم التوفيق..

[..[خربوشة