كيفية إضافة قائمة عمودية لبلوجر

اليوم اقدم لكم اضافة تعتبر ضرورية لمدونتك انها قائمة عمودية لبلوجر جميلة وامكانك استعمالها لاغراض متعددة وتوضع في اي مكان تحبذه. قد تحتاج اليها في تصنيف مواضيع مدونتك وجعلها سهلة التصفح بالنسبة للزائر او استخدامها كاداة للتبادل الاعلاني النصي.

اذا اعجبتك الاضافة وتريد تركيبها تابع الخطوات التالية :

 الخطوة 1:

 سجل الدخول إلى حساب Blogger الخاص بك واذهب إلى تصميم >> تحرير HTML ثم ابحث عن

 ]]></b:skin>

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

/* www.ta3lemblog.blogspot.com*/
 
*{
 list-style:none;
 margin:0px;
 padding:0px;
}

#menu4 {
 width: 200px;
 border-style: solid solid none solid;
 border-color: #D76100;
 border-size: 0px;
 border-width: 0px;
 }
 
#menu4 li a {
   height: 32px;
   voice-family: "\"}\""; 
   voice-family: inherit;
   height: 24px;
 text-decoration: none;
 }
 
#menu4 li a:link, #menu4 li a:visited {
 color: #9E3C02;
 display: block;
 background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_pOL-iA4liEg8RiUH2EHyr04d10dseyrcAZDrFmiWxDSf4eFiJ8m0Fqc_x72lyuufUQIQrCPgJk4K-Pe6eK9W4iSGBIQSpHrWtXyNXFVGUR-rY9bnTiFWXkkATrik0pFUwdapze8Gm00/s1600/menu4.gif);
 padding: 8px 0px 0px 30px;
 }
 
#menu4 li a:hover {
 color: #fff;
 background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_pOL-iA4liEg8RiUH2EHyr04d10dseyrcAZDrFmiWxDSf4eFiJ8m0Fqc_x72lyuufUQIQrCPgJk4K-Pe6eK9W4iSGBIQSpHrWtXyNXFVGUR-rY9bnTiFWXkkATrik0pFUwdapze8Gm00/s1600/menu4.gif) 0 -32px;
 padding: 8px 0 0 30px;
 }
 
#menu4 li a:active {
 color: #fff;
 background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_pOL-iA4liEg8RiUH2EHyr04d10dseyrcAZDrFmiWxDSf4eFiJ8m0Fqc_x72lyuufUQIQrCPgJk4K-Pe6eK9W4iSGBIQSpHrWtXyNXFVGUR-rY9bnTiFWXkkATrik0pFUwdapze8Gm00/s1600/menu4.gif) 0 -64px;
 padding: 8px 0 0 30px;
 } 
/* www.ta3lemblog.blogspot.com*/

 الخطوة 2:

من لوحة التحكم بمدونتك قم بالضغط علي التخطيط ثم اضافة أداة>> Html/java script بلصق الكود ثم قم بلصق الكود التالي

<div id="menu4">
 <ul>
   <li><a href="#1" title="Home">تعديل</a></li>
   <li><a href="#2" title="About">تعديل</a></li>
   <li><a href="#3" title="Services">تعديل</a></li>
   <li><a href="#4" title="Portfolio">تعديل</a></li>
   <li><a href="#5" title="Store">تعديل</a></li>
   
 </ul>

</div> 

استبدال ما باللون الأحمر بالروابط التي ستضيفها وغير كلمة تعديل باسماء الروابط التي ستضيفها.

وأخيرا،قم بحفظ النموذج.

 

منشورة في: اضافات وادوات بلوجر, بلوجر