#1
مدون نشيط
تاريخ التسجيل: Feb 2014
المشاركات: 124
اضافة قائمة باهم روابط مدونتك - اضافات بلوجر
السلام عليكم ورحمة الله وبركاتة
اقدم لكم اضافة قائمة افقية لاهم روابط مدونتك بشكل انيق وجميل
تضع به روابط اقسامك او مدونتك المفيدة بشكل بسيط
الشرح :
اذهب الي صفحة التخطيط ثم اضافة اداة جديدة HTML واضف بها الكود التالي :
كود PHP:
< style > #vbar ul{list-style-type:none;list-style: none;margin:0px;padding:0px 8px 6px 8px;border-top:1px solid #d6d6d6;}#vbar ul li{background:#f8f7f7;padding:10px 10px;margin-right: 6px;color:#666;box-shadow:inset 0 0 1px #fff;border-bottom:1px solid #d6d6d6;border-left:1px solid #d6d6d6;border-right:1px solid #d6d6d6;margin:0;-webkit-transition: All 0.5s ease;-moz-transition: All 0.5s ease;-o-transition: All 0.5s ease;-ms-transition: All 0.5s ease;transition: All 0.5s ease;}#vbar ul li:hover{background:#efefef;box-shadow:inset 0 0 2px #ddd;-webkit-transition: All 0.5s ease;-moz-transition: All 0.5s ease;-o-transition: All 0.5s ease;-ms-transition: All 0.5s ease;transition: All 0.5s ease;}#vbar a{text-decoration:none;color:#2D2D2D;}#vbar a:hover{text-decoration:none;color:#037DFF;}#vbar h2{margin:8px;color:#666;border:1px solid #d6d6d6;background: -moz-linear-gradient(top, #f8f8f8, #eaeaea);background: -webkit-gradient(linear top, #f8f8f8, #eaeaea);background: -ms-linear-gradient(top, #f8f8f8, #eaeaea);background: -o-linear-gradient(top, #f8f8f8, #eaeaea);padding:8px;font-family:'alweeam', 'Droid Arabic Kufi', Arial,Helvetica,Sans-serif;font-size:12px;line-height:24px;font-weight:bold;-webkit-transition: All 1s ease;-moz-transition: All 1s ease;-o-transition: All 1s ease;-ms-transition: All 1s ease;transition: All 1s ease;}#vbar ul li a {color:#000;font-size:12px;font-family: Tahoma, Arial;font-weight: normal;text-decoration: none;-webkit-transition: All 0.5s ease;-moz-transition: All 0.5s ease;-o-transition: All 0.5s ease;-ms-transition: All 0.5s ease;transition: All 0.5s ease;}#vbar .widget { border: 1px solid #ddd; background-color: #fff; margin-bottom: 10px; box-shadow:inset 0 0 4px #eee; }.menu a img {float:right;padding-left:10px;}</style>
< div id = "vbar" >
ul >
li class= "menu" >
a href = "رئيسية موقعك" >
img src = "http://im38.gulfup.com/jFpV7.png" /> الرئيسية </ a >
li >< li class= "menu" >
a href = "رابط من نحن هنا" >
img src = "http://im38.gulfup.com/U00k5.png" /> من نحن </ a ></ li >< li forclass = "menu" >
a href = "رابط سجل الزوار" >
img src = "http://im38.gulfup.com/SrrEm.png" /> سجل الزوار </ a ></ li >
li class= "menu" >< a href = "ضع الرابط الاضافي هنا" >
img src = "http://im35.gulfup.com/V9qDM.png" /> رابط اضافي </ a ></ li >< li class= "menu" >
a href = "رابط اتصل بنا" >< img src = "http://im38.gulfup.com/LmV2W.png" /> اتصل بنا </ a ></ li ></ ul ></ div >
وغير الروابط والاسماء كما تريد واحفظ العمل
__________________
من مواضيع Blog-Add
02-24-2014, 02:26 PM
اضافة قائمة باهم روابط مدونتك - اضافات بلوجر
المواضيع المتشابهه
العرض العادي
