dourjan عضو جديد
Mensajes : 11 Fecha de inscripción : 30/04/2014
| موضوع: شريط تحكم اكثر من رائع اعلى المنتدى الأربعاء أبريل 30, 2014 10:14 pm | |
| اولا الكود ده تجميعة اكواد فى كود واحد لحة دخول ولوحة تحكم احدى صور المعاينة والتى تظهر للزوار
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]
وللمعاينة الحية الشريط موجود فى المنتدى بالاعلى
اولا عليك بمعرفة اين تضع الاكواد لوحة الادارة > عناصر اضافية > ادارة العناصر المستقلة > انشاء عنصر شخصى جديد واضف الكود
اولا هذا الكود تجعل صلاحيته للزوار فقط اسم العنصر لوحة التحكم المطورة زائر - الكود:
-
<style type="text/css"> #spinningbox{ position:fixed !important; left:0px; top: 0px; padding-bottom:14px; padding-top:15px; text-align:left; height:1px; width:999px; overflow:show; </style> <div id="spinningbox"> <link rel="stylesheet" href="http://web-kreation.com/demos/login_form_mootools_1.2/fx.slide.css" type="text/css" media="screen" /> <style> #login { overflow: visible; height: auto; -webkit-transition: margin-top 0.5s ease-in-out 0s; -moz-transition: margin-top 0.5s ease-in-out 0s; -o-transition: margin-top 0.5s ease-in-out 0s; transition: margin-top 0.5s ease-in-out 0s; } /* Login Panel I */ #topp { height: 38px; position: relative; } #topp ul.login { display: blue; position: relative; float: right; clear: right; height: 38px; width: auto; font-weight: bold; line-height: 38px; margin: 0; right: 150px; color: white; font-size: 100%; text-align: center; padding-right: 45px; } #topp ul.login li.left { height: 38px; width: 45px; padding: 0; margin: 0; display: blue; float: left; } #topp ul.login li { text-align: left; padding: 0 6px; display: blue; float: left; height: 38px; } #topp ul.login li a {color: #9CCCFF;} #topp ul.login li a:hover {color: white;} /* Login Panel */ #topp { background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/login_top.jpg) repeat-x 0 0;} #topp ul.login { background: url(http://micsoft.xp3.biz/micbar/images/login_r.png) no-repeat right 0;} #topp ul.login li.left { background: url(http://micsoft.xp3.biz/micbar/images/login_l.png) no-repeat left 0;} #topp ul.login li { background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/login_m.jpg) repeat-x 0 0;} /*Login*/ /* toggle effect - show/hide login*/ #login { background: #1E1E1E;} #login .loginContent input:focus.field { background: #1E1E1E;} #login .loginContent{padding-top:0px;width:790px;height:120px;} #login .loginContent input.button_login { background: transparent url(http://web-kreation.com/demos/login_form_mootools_1.2/images/button_login.jpg) no-repeat 0 0;} #login .loginClose a {
background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/button_close.jpg) no-repeat right 0;} #login .loginClose a:hover { background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/button_close.jpg) no-repeat right -20px;} </style> <!-- Login --> <div _moz_abspos="white" id="loginn" style="display: block;position: absolute;left: 0px;top: 0px;width: 100%;"> <div id="login" style="margin-top: -125px;"> <div class="loginContent"> <table style="width:100%;" border="0"> <tbody> <tr> <td style="text-align:center;"> <table _moz_resizing="true" border="0"> <tbody> <tr> <td> <script> jQuery(document).ready(function(){ jQuery.get('/profile?mode=editprofile&page_profil=avatars', function(data) { link = jQuery('.panel dl:first img', data).attr('src'); if(link){ jQuery('#avatar').html('<img src="'+link+'" align="left" width="60" height="80">'); }else{ jQuery('#avatar').html(''); } }); }); </script> <div id="avatar"> <center> <img src="http://i53.tinypic.com/1e1fex.gif" /> </center> </div> </td> <td style="color: rgb(102, 0, 0);"> <form method="post" name="form_login" action="/login.forum"> <table _moz_resizing="true" style="PADDING-LEFT: 20px" border="0" cellpadding="0" cellspacing="3"> <tbody> <tr> <td> <span class="genmed"><img src="http://i65.servimg.com/u/f65/13/95/29/87/56x76311.gif" /> </span> </td> <td> <input id="Post" value="" size="10" name="username" type="text" /> </td> <td> <input checked="" name="autologin" type="checkbox" /><span style="color: rgb(238, 238, 238); font-weight: bold;" span="" lang="ar-sa"> حفظ البيانات؟ <a href="/h1-page">التسجيل الان</a></span> </td> </tr> <tr> <td> <span class="genmed"><img src="http://i65.servimg.com/u/f65/13/95/29/87/a3d76410.gif" /> </span> </td> <td> <input id="Post" value="" size="10" name="password" type="password" /> </td> <td> <input class="mainoption" tabindex="104" value="تسجيل الدخول" name="login" type="submit" /> </td> </tr> </tbody> </table> </form><span style="font-size: 1.2em;"><span style="font-size: 18px; color: rgb(0, 255, 255);"><span style="font-weight: bold;"></span></span><span style="font-weight: bold;"><span style="color: rgb(0, 255, 255);"><br /></span></span></span> </td> </tr> </tbody> </table> </td> <td style="text-align:center;"> <span style="font-size: 1.2em; color: rgb(0, 255, 255);"><strong>للتمتع بكامل خصائص الموقع<br />عليك بتسجيل الدخول</strong></span><span style="font-size: 1.2em;"><a style="color: rgb(102, 0, 0);" href="../profile.forum?mode=editprofile&page_profil=avatars"></a></span><br /> </td> <td style="text-align: center; color: rgb(0, 255, 255);"> <span style="font-size: 1.2em;"><strong></strong><br /> </span> </td> <td style="text-align: center; color: rgb(0, 255, 255);"> <span style="font-size: 1.2em;"><strong></strong></span><span style="font-size: 1.2em;"><br /> </span> </td> </tr> </tbody> </table> </div> </div> <!-- /login --> <div id="container"> <div style="color: rgb(0, 255, 255);" id="topp"> <!-- login --> <ul class="login"> <li class="left"> </li> <li> <a id="toggleLogin" onclick="document.getElementById('login').style.marginTop=((document.getElementById('login').style.marginTop=='0px')? '-125px' : '0px');">تسجيل الدخول مايكل سوفت</a> </li> </ul> <!-- / login --> </div> <!-- / topp --> <div class="clearfix"> </div> </div> <p> </p> </div> </div> <strong></strong> <strong></strong> الكود الثانى اجعلة للاعضاء والمشرفين اسم العنصر لوحة الدخول المطورة عام واذا اردت ان تجعلها للمدير ايضا فلا مشكله لكن فى حالة جعله للمدير فلا تستخدم الكود الثالث - الكود:
-
<style type="text/css"> #spinningbox{ position:fixed !important; left:0px; top: 0px; padding-bottom:14px; padding-top:15px; text-align:left; height:1px; width:999px; overflow:show; </style> <div id="spinningbox"> <link rel="stylesheet" href="http://web-kreation.com/demos/login_form_mootools_1.2/fx.slide.css" type="text/css" media="screen" /> <style> #login { overflow: visible; height: auto; -webkit-transition: margin-top 0.5s ease-in-out 0s; -moz-transition: margin-top 0.5s ease-in-out 0s; -o-transition: margin-top 0.5s ease-in-out 0s; transition: margin-top 0.5s ease-in-out 0s; } /* Login Panel I */ #topp { height: 38px; position: relative; } #topp ul.login { display: blue; position: relative; float: right; clear: right; height: 38px; width: auto; font-weight: bold; line-height: 38px; margin: 0; right: 150px; color: white; font-size: 100%; text-align: center; padding-right: 45px; } #topp ul.login li.left { height: 38px; width: 45px; padding: 0; margin: 0; display: blue; float: left; } #topp ul.login li { text-align: left; padding: 0 6px; display: blue; float: left; height: 38px; } #topp ul.login li a {color: #9CCCFF;} #topp ul.login li a:hover {color: white;} /* Login Panel */ #topp { background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/login_top.jpg) repeat-x 0 0;} #topp ul.login { background: url(http://micsoft.xp3.biz/micbar/images/login_r.png) no-repeat right 0;} #topp ul.login li.left { background: url(http://micsoft.xp3.biz/micbar/images/login_l.png) no-repeat left 0;} #topp ul.login li { background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/login_m.jpg) repeat-x 0 0;} /*Login*/ /* toggle effect - show/hide login*/ #login { background: #1E1E1E;} #login .loginContent input:focus.field { background: #1E1E1E;} #login .loginContent{padding-top:0px;width:790px;height:120px;} #login .loginContent input.button_login { background: transparent url(http://web-kreation.com/demos/login_form_mootools_1.2/images/button_login.jpg) no-repeat 0 0;} #login .loginClose a {
background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/button_close.jpg) no-repeat right 0;} #login .loginClose a:hover { background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/button_close.jpg) no-repeat right -20px;} </style> <!-- Login --> <div _moz_abspos="white" id="loginn" style="display: block;position: absolute;left: 0px;top: 0px;width: 100%;"> <div id="login" style="margin-top: -125px;"> <div class="loginContent"> <table _moz_resizing="true" style="width:100%;" border="0"> <tbody> <tr> <td style="text-align:center;"> <table _moz_resizing="true" border="0"> <tbody> <tr> <td> <script> jQuery(document).ready(function(){ jQuery.get('/profile?mode=editprofile&page_profil=avatars', function(data) { link = jQuery('.panel dl:first img', data).attr('src'); if(link){ jQuery('#avatar').html('<img src="'+link+'" align="left" width="60" height="80">'); }else{ jQuery('#avatar').html(''); } }); }); </script> <div id="avatar"> <center> <img src="http://i53.tinypic.com/1e1fex.gif" /> </center> </div> </td> <td style="color: rgb(102, 0, 0);"> <span style="font-size: 1.2em;"> <span style="font-size: 13px;"><span style="font-size: 18px; color: rgb(0, 255, 255);"><span style="font-weight: bold;">اهلا وسهلا بك</span><br />{USERLINK}</span><br style="color: rgb(0, 255, 255);" /></span><span style="font-size: 13px;"><span style="font-weight: bold; color: rgb(0, 255, 255);">لديك</span><strong style="color: rgb(0, 255, 255);">:</strong><span style="color: rgb(0, 255, 255);">{USERCOUNTPOST}<span style="font-weight: bold;"></span></span></span><span style="font-weight: bold;"><span style="color: rgb(0, 255, 255);"><span style="font-size: 13px;">مشاركة<br />تاريخ اخر زيارة هو: {USERLASTVISIT}: شكرا لعودتك <br /><a href="http://micsoft.forumotion.com/login?logout">تسجيل الخروج</a></span><br /></span></span></span> </td> </tr> </tbody> </table> </td> <td style="text-align:center;"> <span style="font-size: 1.2em; color: rgb(0, 255, 255);"><strong>التحكم السريع:</strong></span><span style="font-size: 1.2em;"><strong style="color: rgb(0, 255, 255);"><br /></strong><span style="color: rgb(0, 255, 255);"> </span><a style="color: rgb(0, 255, 255);" href="../profile.forum?mode=editprofile&page_profil=informations">بياناتى الشخصية</a><span style="color: rgb(0, 255, 255);"> </span><br style="color: rgb(0, 255, 255);" /><a style="color: rgb(0, 255, 255);" href="../profile.forum?mode=editprofile&page_profil=preferences">التحكم بالمفضلات</a><br style="color: rgb(0, 255, 255);" /><span style="color: rgb(0, 255, 255);"> </span><a style="color: rgb(0, 255, 255);" href="../profile.forum?mode=editprofile&page_profil=signature">التوقيع</a><br style="color: rgb(0, 255, 255);" /><span style="color: rgb(0, 255, 255);"> </span><a style="color: rgb(102, 0, 0);" href="../profile.forum?mode=editprofile&page_profil=avatars"><span style="color: rgb(0, 255, 255);">الصورة الشخصية</span></a> </span> </td> <td style="text-align: center; color: rgb(0, 255, 255);"> <span style="font-size: 1.2em;"><strong>بيانات خاصة عن:<br /></strong> <a href="../profile.forum?mode=editprofile&page_profil=friendsfoes">اصدقائى واعدائى</a> <br /><a href="../search.forum?search_id=watchsearch">المواضيع المراقبة</a> <br /><a href="../search.forum?search_id=draftsearch">النصوص التجريبية</a> <br /><a href="../search.forum?search_id=favouritesearch">مفضلاتى</a> <br /><a href="../rpg_sheet_edit.forum">ورقتى الشخصية</a> </span> </td> <td style="text-align: center; color: rgb(0, 255, 255);"> <span style="font-size: 1.2em;"><strong>البحث الفورى عن:</strong></span><span style="font-size: 1.2em;"><br /> <a href="../msg.forum?folder=inbox">الرسائل الخاصة</a> <br /><a href="../search?search_id=activetopics"> أفضل المواضيع لهذا اليوم</a> <br /><a href="../search.forum?search_id=egosearch">اعرض جميع مواضيعى</a><br /> <a href="../search.forum?search_author=Victor&show_results=posts">استعراض المواضيع الجديده</a> <br /><a href="../search?search_id=unanswered">المواضيع التى ليس بها رد</a> </span> </td> </tr> </tbody> </table> </div> </div> <!-- /login --> <div id="container"> <div style="color: rgb(0, 255, 255);" id="topp"> <!-- login --> <ul class="login"> <li class="left"> </li> <li> <a id="toggleLogin" onclick="document.getElementById('login').style.marginTop=((document.getElementById('login').style.marginTop=='0px')? '-125px' : '0px');">لوحتى الخاصة مايكل سوفت</a> </li> </ul> <!-- / login --> </div> <!-- / topp --> <div class="clearfix"> </div> </div> <p> </p> </div> </div> <strong></strong> <strong></strong> [b]واخيرا وده حسب اختيارك اسم العنصر لوحة التحكم المطورة مدير لا تنشطة ابضا للاعضاء او المشرفين الكود به رابطة لوحة الادارة الخاصة بموقعك[/b] - الكود:
-
<style type="text/css"> #spinningbox{ position:fixed !important; left:0px; top: 0px; padding-bottom:14px; padding-top:15px; text-align:left; height:1px; width:999px; overflow:show; </style> <div id="spinningbox"> <link rel="stylesheet" href="http://web-kreation.com/demos/login_form_mootools_1.2/fx.slide.css" type="text/css" media="screen" /> <style> #login { overflow: visible; height: auto; -webkit-transition: margin-top 0.5s ease-in-out 0s; -moz-transition: margin-top 0.5s ease-in-out 0s; -o-transition: margin-top 0.5s ease-in-out 0s; transition: margin-top 0.5s ease-in-out 0s; } /* Login Panel I */ #topp { height: 38px; position: relative; } #topp ul.login { display: blue; position: relative; float: right; clear: right; height: 38px; width: auto; font-weight: bold; line-height: 38px; margin: 0; right: 150px; color: white; font-size: 100%; text-align: center; padding-right: 45px; } #topp ul.login li.left { height: 38px; width: 45px; padding: 0; margin: 0; display: blue; float: left; } #topp ul.login li { text-align: left; padding: 0 6px; display: blue; float: left; height: 38px; } #topp ul.login li a {color: #9CCCFF;} #topp ul.login li a:hover {color: white;} /* Login Panel */ #topp { background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/login_top.jpg) repeat-x 0 0;} #topp ul.login { background: url(http://micsoft.xp3.biz/micbar/images/login_r.png) no-repeat right 0;} #topp ul.login li.left { background: url(http://micsoft.xp3.biz/micbar/images/login_l.png) no-repeat left 0;} #topp ul.login li { background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/login_m.jpg) repeat-x 0 0;} /*Login*/ /* toggle effect - show/hide login*/ #login { background: #1E1E1E;} #login .loginContent input:focus.field { background: #1E1E1E;} #login .loginContent{padding-top:0px;width:790px;height:120px;} #login .loginContent input.button_login { background: transparent url(http://web-kreation.com/demos/login_form_mootools_1.2/images/button_login.jpg) no-repeat 0 0;} #login .loginClose a {
background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/button_close.jpg) no-repeat right 0;} #login .loginClose a:hover { background: url(http://web-kreation.com/demos/login_form_mootools_1.2/images/button_close.jpg) no-repeat right -20px;} </style> <!-- Login --> <div _moz_abspos="white" id="loginn" style="display: block;position: absolute;left: 0px;top: 0px;width: 100%;"> <div id="login" style="margin-top: -125px;"> <div class="loginContent"> <table _moz_resizing="true" style="width:100%;" border="0"> <tbody> <tr> <td style="text-align:center;"> <table _moz_resizing="true" border="0"> <tbody> <tr> <td> <script> jQuery(document).ready(function(){ jQuery.get('/profile?mode=editprofile&page_profil=avatars', function(data) { link = jQuery('.panel dl:first img', data).attr('src'); if(link){ jQuery('#avatar').html('<img src="'+link+'" align="left" width="60" height="80">'); }else{ jQuery('#avatar').html(''); } }); }); </script> <div id="avatar"> <center> <img src="http://i53.tinypic.com/1e1fex.gif" /> </center> </div> </td> <td style="color: rgb(102, 0, 0);"> <span style="font-size: 1.2em;"> <span style="font-size: 13px;"><span style="font-size: 18px; color: rgb(0, 255, 255);"><span style="font-weight: bold;">اهلا وسهلا بك</span><br />{USERLINK}</span><br style="color: rgb(0, 255, 255);" /></span><span style="font-size: 13px;"><span style="font-weight: bold; color: rgb(0, 255, 255);">لديك</span><strong style="color: rgb(0, 255, 255);">:</strong><span style="color: rgb(0, 255, 255);">{USERCOUNTPOST}<span style="font-weight: bold;"></span></span></span><span style="font-weight: bold;"><span style="color: rgb(0, 255, 255);"><span style="font-size: 13px;">مشاركة<br />تاريخ اخر زيارة هو: {USERLASTVISIT}: شكرا لعودتك <br /><a href="../login?logout">تسجيل الخروج</a></span><br /></span></span></span> </td> </tr> </tbody> </table> </td> <td style="text-align:center;"> <span style="font-size: 1.2em; color: rgb(0, 255, 255);"><strong>التحكم السريع:</strong></span><span style="font-size: 1.2em;"><strong style="color: rgb(0, 255, 255);"><br /></strong><span style="color: rgb(0, 255, 255);"> </span><a style="color: rgb(0, 255, 255); font-weight: bold;" href="../profile.forum?mode=editprofile&page_profil=informations">بياناتى الشخصية</a><span style="color: rgb(0, 255, 255); font-weight: bold;"> </span><br style="color: rgb(0, 255, 255); font-weight: bold;" /><a style="color: rgb(0, 255, 255); font-weight: bold;" href="../profile.forum?mode=editprofile&page_profil=preferences">التحكم بالمفضلات</a><br style="color: rgb(0, 255, 255); font-weight: bold;" /><span style="color: rgb(0, 255, 255); font-weight: bold;"> </span><a style="color: rgb(0, 255, 255); font-weight: bold;" href="../profile.forum?mode=editprofile&page_profil=signature">التوقيع</a><br style="color: rgb(0, 255, 255); font-weight: bold;" /><span style="color: rgb(0, 255, 255); font-weight: bold;"> </span><a style="color: rgb(102, 0, 0); font-weight: bold;" href="../profile.forum?mode=editprofile&page_profil=avatars"><span style="color: rgb(0, 255, 255);">الصورة الشخصية</span></a><br style="font-weight: bold;" /><a style="font-weight: bold;" href="../admin/index.forum">لوحة الادارة</a><br /> </span> </td> <td style="text-align: center; color: rgb(0, 255, 255);"> <span style="font-size: 1.2em;"><strong>بيانات خاصة عن:<br /></strong> <a style="font-weight: bold;" href="../profile.forum?mode=editprofile&page_profil=friendsfoes">اصدقائى واعدائى</a><span style="font-weight: bold;"> </span><br style="font-weight: bold;" /><a style="font-weight: bold;" href="../search.forum?search_id=watchsearch">المواضيع المراقبة</a><span style="font-weight: bold;"> </span><br style="font-weight: bold;" /><a style="font-weight: bold;" href="../search.forum?search_id=draftsearch">النصوص التجريبية</a><span style="font-weight: bold;"> </span><br style="font-weight: bold;" /><a style="font-weight: bold;" href="../search.forum?search_id=favouritesearch">مفضلاتى</a><span style="font-weight: bold;"> </span><br style="font-weight: bold;" /><a style="font-weight: bold;" href="../rpg_sheet_edit.forum">ورقتى الشخصية</a> </span> </td> <td style="text-align: center; color: rgb(0, 255, 255);"> <span style="font-size: 1.2em;"><strong>البحث الفورى عن:</strong></span><span style="font-size: 1.2em;"><br /> <a style="font-weight: bold;" href="../msg.forum?folder=inbox">الرسائل الخاصة</a><span style="font-weight: bold;"> </span><br style="font-weight: bold;" /><a style="font-weight: bold;" href="../search?search_id=activetopics"> أفضل المواضيع لهذا اليوم</a><span style="font-weight: bold;"> </span><br style="font-weight: bold;" /><a style="font-weight: bold;" href="../search.forum?search_id=egosearch">اعرض جميع مواضيعى</a><br style="font-weight: bold;" /> <a style="font-weight: bold;" href="../search.forum?search_author=Victor&show_results=posts">استعراض المواضيع الجديده</a><span style="font-weight: bold;"> </span><br style="font-weight: bold;" /><a style="font-weight: bold;" href="../search?search_id=unanswered">المواضيع التى ليس بها رد</a> </span> </td> </tr> </tbody> </table> </div> </div> <!-- /login --> <div id="container"> <div style="color: rgb(0, 255, 255);" id="topp"> <!-- login --> <ul class="login"> <li class="left"> </li> <li> <a id="toggleLogin" onclick="document.getElementById('login').style.marginTop=((document.getElementById('login').style.marginTop=='0px')? '-125px' : '0px');">لوحتى الخاصة مايكل سوفت</a> </li> </ul> <!-- / login --> </div> <!-- / topp --> <div class="clearfix"> </div> </div> <p> </p> </div> </div> <strong></strong> <strong></strong> [b][b] جميع هذه الاكواد لا تحتاج الى التعديل فقط افها كما هى حقوق الملكية هى اسم الموقع مسموح بنقل الاكواد ممنوع حذف الحقوق لن اسمحك اذا اخذت حقوق الملكيه
[/b][/b] |
|