اضافه قائمه افقيه في مدونة بلوجر
الزيارات:
الزيارات:
Unknown | 2:09 م |
اضافات وقوالب بلوجر
اضافه قائمه افقيه في مدونة بلوجر
مدونة بلوجر,قائمه افقيه,اضافة,BLOGGER,بلوج
سبوت,اضافات لبلوجر,تعلم التدوين,ادوات بلوجر
احيانا نريد اضافه قائمه افقيه في مدونة بلوجر الطريقه
التاليه توضح لك ذلك
انظر لشكل القائمه الافقيه التالي :
طريقه الاضافه بالدخول علي
لوحه تحكم المدونه
منها اضغط علي تصميم ومن تصميم عناصر الصفحة ...
وعناصر التي تكون الافتراضيه
اضغط علي اضافه اداه انظر للصورة التاليه توضح ما سبق
:
ملحوظه في الواجهه الجديد في بلوجر بدلا من تصميم
اختار تخطيط
ثم بعد ذلك اختار الاداه
HTML/JavaScript
كما توضح الصورة التاليه :
ثم قم باضافه الكود التالي
كود PHP:
واحفظه في المكان الذي توضحه الصورة التاليه :
<style> /*Start Css Menu*/ .menu {
border: none;
border: 0px;
margin: 0px;
padding: 0px;
font-family: verdana,geneva,arial,helvetica,sans-serif;
font-size: 14px;
font-weight: bold;
color: 8e8e8e;
}
.menu ul {
background: url(http:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOy7b4DVukNiB2KCevEJL56LqmPnpVhV6hHhytNTP7PXgFXjehBgSDDUjJaAEvIs7Ec-t3IXk_26dpXTP_AYBKb0neuScy9rxkvVrEI3B_DzFrevwOI30gsIE-6khhCa5PqenieDJHNs8/s1600/helperblogger.com-menu-bg.gif) top left repeat-x;
height: 43px;
list-style: none;
margin: 0;
padding: 0;
}
.menu li {
float: left;
padding: 0px 8px 0px 8px;
}
.menu li a {
color: #666666;
display: block;
font-weight: bold;
line-height: 43px;
padding: 0px 25px;
text-align: center;
text-decoration: none;
}
.menu li a:hover {
color: #000000;
text-decoration: none;
}
.menu li ul {
background: #e0e0e0;
border-left: 2px solid #a80329;
border-right: 2px solid #a80329;
border-bottom: 2px solid #a80329;
display: none;
height: auto;
filter: alpha(opacity=95);
opacity: 0.95;
position: absolute;
width: 225px;
z-index: 200; /*top:1em;
/*left:0;*/ }
.menu li:hover ul {
display: block;
}
.menu li li {
display: block;
float: none;
padding: 0px;
width: 225px;
}
.menu li ul a {
display: block;
font-size: 12px;
font-style: normal;
padding: 0px 10px 0px 15px;
text-align: left;
}
.menu li ul a:hover {
background: #949494;
color: #000000;
opacity: 1.0;
filter: alpha(opacity=100);
}
.menu p {
clear: left;
}
.menu #current {
background: url(http://1.bp.blogspot.com/-Z9bi1D4dtH8/T7zWalpDEWI/AAAAAAAABzI/iX
hXlizOKO8/s1600/helperblogger.com-current-bg.gif) top left repeat-x;
color: #ffffff; }
/*End Css Menu from http://www.vitchawee.com/*/ </style>
<div class="menu">
<ul>
<li><a href="http://www.vitchawee.com/" id="current">الرئيسية</a></li>
<li><a href="#">غرائب وعجائب</a>
<ul>
<li><a href="#">الصور</a></li>
<li><a href="#">الفيديو</a></li>
<li><a href="#">مضحكة</a></li>
<li><a href="#">البلدان</a></li>
</ul>
</li>
<li><a href="#">كمبيوتر وإنترنت</a>
<ul>
<li><a href="#">صيانه</a></li>
<li><a href="#">فيديوهات تعليمية</a></li>
<li><a href="#">برامج</a></li>
<li><a href="#">إنترنت</a></li>
</ul>
</li>
<li><a href="#">صحتك بالدنيا</a></li>
<li><a href="#">قصص وعبر</a></li>
</ul>
</div>
واحفظه في المكان الذي توضحه الصورة التاليه :
مكان علامه # تضع رابط القسم الذي تريده ...
التسميات:
اضافات وقوالب بلوجر
بقلم Ahmed Al-Saadi
إسمـي احمـد مـن مواليـد سنـة 1992 ،بلـدي هـو العـراق، أهتم بتقنيـات الحاسـوب وتطويـر المواقـع والمدونات اهم البرامج التي استخدمها في اعمالي الفوتوشوب, السويش ماكس وغيرها.روابط هذه التدوينة قابلة للنسخ واللصق | |
URL | |
HTML | |
BBCode |
0 التعليقات:
إرسال تعليق