يهمنا غير الباك: اضافة قائمة عمودية css-html لمدونات البلوجر

بسم الله الرحمان الرحيم و الصلاة و السلام على اشرف المرسلين اليوم احببت ان اقدم لكم شرح لكيفية اضافة قائمة css جانبية بشكل جذاب لمدونات البلوجر و هي اضافة بسيطة جداصادفتها في احدى المواقع الاجنبية  اتمنى ان تعجبكم
قائمة css زرقاء و برتقالية رائعة
و هذه الصورة المقابلة كمثال للقائمة التي ساقوم بشرحها





نتابع الشرح لاضافة القائمة :
أولا نضيف كود css
نبحث عن :

]]></b:skin>

 ونضع قبله هذا الكود:

#menu9 ul { list-style: none; margin: 0; padding: 0; } #menu9 img { border: none; } #menu9 { width: 200px; margin: 10px; } #menu9 li a { height: 32px; font-family: Verdana, Arial, Helvetica, sans-serif; margin: 0; font-size: 10pt; font-weight: bold; background: #FFF; height: 24px; text-decoration: none; } #menu9 li a:link, #menu9 li a:visited { color: #FFF; display: block; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUVA2hqsJzEO4xIGvi-uGts89O7KNnMt4NKbXtSbHtEXBjYhDomum1KkKyoR50ctuwYDYl39Y_iJAASxN62XMdXiYrkSGBheTjYMVC3Y9LIfR7r_H2VwGXTjQxJVvPX2nJSycLVH6OI5o/s800/menu9.gif); padding: 8px 0 0 35px; } #menu9 li a:hover { color: #FFF; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUVA2hqsJzEO4xIGvi-uGts89O7KNnMt4NKbXtSbHtEXBjYhDomum1KkKyoR50ctuwYDYl39Y_iJAASxN62XMdXiYrkSGBheTjYMVC3Y9LIfR7r_H2VwGXTjQxJVvPX2nJSycLVH6OI5o/s800/menu9.gif) 0 -32px; padding: 8px 0 0 35px; }

 ثم احفظ القالب و توجه الى عناصر الصفحة و اختر اضافة اداة html و ضع هذا الكود :

<div id="menu9"> <ul> <li><a href="tha3loub.blogspot.com">مدونة يهمنا غير الباك قائمة css</a></li> <li><a href="tha3loub.blogspot.com">عنوان2 </a></li> <li><a href="tha3loub.blogspot.com">عنوان 3</a></li> <li><a href="tha3loub.blogspot.com">Link 4</a></li> <li><a href="tha3loub.blogspot.com">عنوان 4</a></li> </ul> </div>

غير رابط المدونة' tha3loub.blogspot.com'الى الرابط الخاص بك و العناوين و  استمتع بالقائمة

 

/a>
طريقة الحصول على مدونة كاملة من هنا
تحصل على كامل المدونة من هنا
للمزيد من المدونات من هنا<