Admin المدير العام
عدد المساهمات : 46 السٌّمعَة : 0 تاريخ التسجيل : 30/01/2014
| موضوع: كود نافبار حوف نت الفريد الجمعة أكتوبر 09, 2015 9:08 am | |
|
نافبار حوف نت الفريد الحصري تماما الذي تمناه كل صاحب منتدى من احلى منتدى والذي يعتبر ثورة احلى منتدى!الآن الكود نقدمة لكم كهدية من ارض الكرم "حوف نت" لاعضاؤنا الكراماولا استعرض لكم مميزات هذا النافبار: 1- شعار منتداك عليه 2- قوائم منسدلة ويمكنك زيادتها ان اردت 3- منطقة تسجيل الدخول وهي بحد ثاتها اخترافية ولن تجد مثلها 4- ترحيب بعد الدخول مع صورة رمزية مصغرة لصورتة في البيانات الشخصية لكل عضو بشكل عصري مثل المواقع العالمية الكبرى 5- زر البحث تنسدل منه نافذه البحث مثل النافبار الاصلي لاحلى منتدى .. 6- النافبار يحتوي على قوائم كتابية و ايقونات نافبار احلى منتدى الاصلية 7- الازرار تتغير بعد تسجيل الدخول 8- ايقونة الرسائل الجديدة بشكل عصري وتنبهك بوجود رسالة جديدة يعتبر افضل كود نافبار في منتديات احلى منتدى وايضا لن تجد مثله في منتديات VB الخطوة الثانية:
هذه الخطوة لاضافة كود النافبار كامل في التمبلات مظهر المنتدى - التمبلات والقوالب - ادارة عامة -فتح قالب overall_header الان ابحث عن واحذفة الرمز: الرمز: - الكود:
-
<table cellspacing="0" cellpadding="0" border="0" align="{MENU_POSITION}"> <tr> <td align="{MENU_POSITION}"{MENU_NOWRAP}>{GENERATED_NAV_BAR}</td> </tr> </table>
ثم ابحث عن الرمز: الرمز: - الكود:
-
{JAVASCRIPT} وضع اسفلة مباشرة كود النافبار كامل [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة] الرمز: الرمز: - الكود:
-
<!-- نافبار حوف نت بداية --> <ul class="menu" > <li><a href="http://www.7ooof.net/" alt="حوف نت" title="الرئيسية"><img src="http://i49.servimg.com/u/f49/16/89/40/74/homelo10.png" /></a></li> <li><a title="مكتبة الصور" href="http://www.7ooof.net/gallery//-cat_c1.htm" >مكتبة الصور</a></li> <li><a title="الاعضاء" href="#">الأعضاء ▼ </a> <ul> <li><a title="قائمة الأعضاء" href="http://www.7ooof.net/memberlist" class="documents" > » قائمة الأعضاء </a></li> <li><a title="أفضل 20 عضو" href="http://www.7ooof.net/memberlist?mode=overall_posters" class="messages" > » أفضل 20 عضو </a></li> <li><a title="أفضل أعضاء اليوم" href="http://www.7ooof.net/memberlist?mode=today_posters" class="signout" > » أفضل أعضاء اليوم </a></li> </ul> <li><a title="اسألة شائعة" href="http://www.7ooof.net/faq">اسألة شائعة</a></li> <li><a title="ما الجديد؟" href="http://www.7ooof.net/search.forum?search_id=newposts" class="documents" >ما الجديد؟ </a></li> <li><a title="خيارات سريعة" href="#"><img src="http://i49.servimg.com/u/f49/16/89/40/74/uoouo11.png" /></a> <ul> <li><a title="جميع مشاركاتي" href="http://www.7ooof.net/search.forum?search_id=egosearch" class="messages" > » جميع مشاركاتي </a></li> <li><a title="مواضيع لم يرد عليها" href="http://www.7ooof.net/search.forum?search_id=unanswered" class="signout" > » مواضيع لم يرد عليها </a></li> <li><a title="#" href="#" class="signout" > » قريبا </a></li> </ul> </li> <a>{GENERATED_NAV_BAR}</a> </ul>
<style Type="Text/css"> /* Reset */ .menu, .menu ul, .menu li, .menu a {margin: 0; padding: 0; border: none; outline: none;} /* Menu */ .menu {height: 42px; width: 100%; background: #2e2e2e; box-shadow: 0 1px 5px rgba(0, 0, 0, 0.3); background: -webkit-linear-gradient(top, #494949 0%,#202020 100%); background: -moz-linear-gradient(top, #494949 0%,#202020 100%); background: -o-linear-gradient(top, #494949 0%,#202020 100%); background: -ms-linear-gradient(top, #494949 0%,#202020 100%); background: linear-gradient(top, #494949 0%,#202020 100%); } .menu li {position: relative; list-style: none; float: right; display: block; height: 40px;} /* Links */ .menu li a { display: block; padding: 0 8px; margin: 6px 0; line-height: 30px; text-decoration: none; border-left: 1px solid #393942; border-right: 1px solid #161616; font-family: Tahoma; font-weight: bo#ld; font-size: 12px; color: #bdbdbd; text-shadow: 1px 1px 1px rgba(0,0,0,.6);} .menu li:hover > a { color: #8fde62; } /* Sub Menu */ .menu ul { position: absolute; top: 40px; left: 0; opacity: 0; background: #1f2024; -webkit-border-radius: 0 0 5px 5px; -moz-border-radius: 0 0 5px 5px; border-radius: 0 0 5px 5px; -webkit-transition: opacity .25s ease .1s; -moz-transition: opacity .25s ease .1s; -o-transition: opacity .25s ease .1s; -ms-transition: opacity .25s ease .1s; transition: opacity .25s ease .1s; } .menu li:hover > ul { opacity: 1;} .menu ul li { height: 0; overflow: hidden; padding: 0; -webkit-transition: height .25s ease .1s; -moz-transition: height .25s ease .1s; -o-transition: height .25s ease .1s; -ms-transition: height .25s ease .1s; transition: height .25s ease .1s; } .menu li:hover > ul li { height: 34px; overflow: visible; padding: 0;} .menu ul li a {width: 130px; padding: 4px 0 4px 40px; margin: 0; border: none; border-bottom: 1px solid #353539;} .menu ul li:last-child a { border: none; } </style> <!-- نافبار حوف نت نهاية-->
الان غير صورة الشعار والروابط واضافة ما تريدة ثم سجل وانشرالخطوة الثالثة والاخيرة:
هذه الخطوة لاظهار خانة تسجيل الدخول عبارة مرحبا بك والصورة الرمزية المصغرة عناصر اضافية - ادارة العناصر المستقلة على المنتدى ملاحظة: الاعدادات اجعلها على ماهي علية في منتداك حتى لا تاثر على شيء آخر.. اذا لم تظهر الاكواد التالية غير الاعدادات وليس شرطا ان تكون بارقام معينةمثال : هذه اعدادات منتديات حوف نت [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]الان انشأ عنصر جديد وسمية مثلا "خانه الدخول" واجعل صلاحياتة للزوار فقط ومن دون جدول وضع فية هذا الكود [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة] الرمز: الرمز: - الكود:
-
<div style="left: 3px; overflow: visible; width: 250px; position: absolute; top: 10px; height: 30px;" align="center">
<form action="http://www.7ooof.net/login" method="post" dir="rtl"> <input name="username" value="اسم العضو" onclick="if (this.value == 'اسم العضو') this.value = '';" onblur="if (this.value == '') this.value = 'اسم العضو';" size="9" maxlength="40" type="text"> <input name="password" value="كلمه سر" onclick="if (this.value == 'كلمه سر') this.value = '';" onblur="if (this.value == '') this.value = 'كلمه سر';" size="9" maxlength="32" type="password"> <input class="mainoption" name="login" value="دخول" size="9" type="submit">
<br /><br />
<input name="autologin" checked="true" type="checkbox"> <font title="تذكر بياناتي في المرة القادمة" color="#4F4F4F" size="1" >تذكرني</font> <a title="استعادة كلمه السر من هنا" href="http://www.7ooof.net/profile?mode=sendpassword"><font color="#4F4F4F" size="1">| نسيت كلمة السر؟ |</font></a> <a title="سجل كعضو جديد" href="http://www.7ooof.net/register?agreed=true&step=2"><font color="#db4804" size="2"><b> عضو جديد</b></font></a>
</form> <style type="text/css"></style> </div> لا تنسى تغيير رابط المنتدى ثم سجل وايضا انشأ عنصر جديد آخر وسمية مثلا " مرحبا بك" واجعل صلاحياتة للجميع ما عدا الزوار ومن دون جدول وضع فية هذا الكود [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة] الرمز: الرمز: - الكود:
-
<div style="left: 46px; overflow: visible; width: 300px; position: absolute; top: 12px; height: 30px;" align="center"><div style="text-align: left;"><font color="#C0C0C0" size="2">مرحباً بك <b>{USERNAME}</b></font><a href="http://www.7ooof.net/login?logout"><font size="2"> [ خروج ] </font></a></div> <style Type="Text/css"></style> </div> <div style="left: 20px; overflow: visible; width: 15px; position: absolute; top: 7px; height: 30px;" align="center"> <script> jQuery(document).ready(function(){ jQuery.get('/profile?mode=editprofile&page_profil=avatars', function(data) { link = jQuery('#register .forumline td.row1 img', data).attr('src'); if(link){ jQuery('#avatar').html('<center><img src="'+link+'" alt=""></center>'); }else{ jQuery('#avatar').html(''); } }); }); </script><div id="avatar"></div> <style Type="Text/css"> #avatar img{ max-height: 27px; max-width: 27px; border: 1px solid #4F4F4F; border-radius: 4px; } </style> </div>
لا تنسى تغيير رابط المنتدى ثم سجل هكذا انتهينا والف مبروك لكم لحصولكم على النافبار يمنع نقل الكود دون ذكر المصدرهنيئا لكم به وبالتوفيق للجميع [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة] لا تحرموني من صالح الدعاء مع فائق الاحترام والتقدير ابو مازن | |
|