عمل قائمة جانبية لاقسام المدونة بلوجر

بسم الله الرحمن الرحيم 

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

للمزيد من اضافات بلوجر من هنا 

صورة للاضافة 

اضافة لعرض اقسام المجدونة

مثال حي للاضافة من هنا 

طريقة التركيب

1 - أذهب التخطيط >>>> وقم بإنشاء آداة html javascript جديدة وأضف إليها الكود التالي :

   

<style type="text/css">
table{
width:300px;
height:375px;
border:3px solid#333;
border-collapse:collapse;
margin:0px;
font-size:20px;
margin-bottom:20px;
text-align:center;
}
#minnn{
background:hsl(0,100%,60%);}
#minnn:hover{
color:hsl(0,0%,100%);}
#minnn:hover{
background:#ff8d45;}
#shrohat{
background:#009d73;}
#shrohat:hover{
color:hsl(0,0%,100%);}
#shrohat:hover{
background:#1dbe60;}
#aandroid{
background:#165aa5;}
#aandroid:hover{
color:hsl(0,0%,100%);}
#aandroid:hover{
background:#0098cf;}
#hmaya{
background:#e8404d;}
#hmaya:hover{
color:hsl(0,0%,100%);}
#hmaya:hover{
background:#d92f67;}

a{
text-decoration:none;
color:hsl(0,0%,0%);}
a:hover{
color:hsl(0,0%,100%)}
#bloggerr{
background:#ff892f;}
#bloggerr:hover{
background:#fc5d43;}
#moneyy{
background:#6c96ca}
moneyy:hover{
background:#64add5;}
#desss{
background:#6547ec;}
#desss:hover{
background:#ff8571;}




</style>



<table id="1111" border="3px">
<tr id=shrohat><td><a href="http://www.ahmad-web.com/search/label/%D8%A7%D9%84%D8%AD%D9%84%D9%82%D8%A7%D8%AA?max-results=8">الحلقات</a></td></tr>
<tr id=bloggerr><td><a href="http://www.ahmad-web.com/search/label/%D8%A7%D8%B6%D8%A7%D9%81%D8%A7%D8%AA%20%D8%A8%D9%84%D9%88%D8%AC%D8%B1?max-results=8">اضافات بلوجر</a></td></tr>
<tr id=moneyy><td><a href="http://www.ahmad-web.com/search/label/%D9%82%D9%88%D8%A7%D9%84%D8%A8%20%D8%A8%D9%84%D9%88%D8%AC%D8%B1?max-results=8">قوالب بلوجر احترافية</a></td></tr>
<tr id=desss><td><a href="http://ahwebs.blogspot.com/search/label/%D9%81%D9%8A%D8%B3%20%D8%A8%D9%88%D9%83?max-results=8">الفيس بوك</a></td></tr>
<tr id=minnn><td><a href="http://www.ahmad-web.com/search/label/%D8%A8%D8%B1%D8%A7%D9%85%D8%AC?max-results=8">برامج</a></td></tr>
<tr id=hmaya><td><a href="http://www.ahmad-web.com/search/label/%D8%A7%D9%87%D9%85%20%D8%A7%D9%84%D8%A7%D8%AE%D8%A8%D8%A7%D8%B1">اخبار التقنية</a></td></tr>
<tr id=shrohat><td><a href="http://www.ahmad-web.com/search/label/%D8%AA%D9%88%D8%A8%2010">توب 10</a></td></tr>
<tr id=bloggerr><td><a href="http://www.ahmad-web.com/search/label/%D8%A7%D9%84%D9%88%D9%8A%D9%86%D8%AF%D8%B2">الويندز</a></td></tr>
<tr id=desss><td><a href="http://www.ahmad-web.com/search/label/%D8%A7%D9%84%D8%A7%D9%84%D8%B9%D8%A7%D8%A8?max-results=8">الألعاب</a></td></tr>


</table>

لتحميل كود الاضافة من هنا 
ثم قم بحفظ قالبك ومبروك عليك الاضافة، عندي إضافة أخرى أكثر إحترافية وأناقة من هذه الإضافة، إن كنتم تريدون مني طرحها لكم، أروني تفاعلكم في قائمة التعاليق.