منتدى الدعم و المساعدة لأحلى المنتديات
هل تريد التفاعل مع هذه المساهمة؟ كل ما عليك هو إنشاء حساب جديد ببضع خطوات أو تسجيل الدخول للمتابعة.

[تومبلايت] تولبار خفيف للمنتديات

اذهب الى الأسفل

[تومبلايت] تولبار خفيف للمنتديات  Empty [تومبلايت] تولبار خفيف للمنتديات

مُساهمة من طرف cool amir الإثنين 27 مايو 2013 - 20:33


السلام عليكم ورحمة الله تعالى وبركاته

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


تولبار جميل وخفيف للمنتديات بالتومبلايت

الدخول للزوار

مثال



[تومبلايت] تولبار خفيف للمنتديات  110



معلومات للاعضاء

مثال



[تومبلايت] تولبار خفيف للمنتديات  210



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

لوحة الادارة >> مظهر المنتدى >> القوالب والتومبلايت >> ادارة عامة

overall_header

ونحط في اول القالب هذا الكود



الكود:
   <!-- BEGIN switch_user_logged_out -->



<div id="content_header">
            <div class="smallpanel">
      
                  <ul id="nav">
                     <li class=""><a>مرحبا بكم في {SITENAME}</a>
                     </li>
                  </ul>
                  <div id="adminbar">
         

          <form action="login" method="post" class="head-login" id="customForm">             
             <img src="http://outlaws-forum.com/vb/themes/default/icons/gray/group.png" alt="gray/group"> <input name="username" id="login_field name" class="textc" value="الإسم/البريد الإلكتروني" onblur="if (this.value == '') { this.value = 'الإسم/البريد الإلكتروني'; }" onfocus="if (this.value == 'الإسم/البريد الإلكتروني') { this.value = ''; }" type="text">
             <img src="http://outlaws-forum.com/vb/themes/default/icons/gray/lock.png" alt="gray/lock"> <input name="password" class="textc" id="password" value="كلمة الرور" onblur="if (this.value == '') { this.value = 'كلمة الرور'; }" onfocus="if (this.value == 'كلمة الرور') { this.value = ''; }" type="password">
                  
               <button type="submit" class="minibutton" name="login" value="" tabindex="104" >
                     دخول                  </button>
               
            </form>         
          
                  </div>
            </div>
            <div class="clearingfix"></div>
            
</div>
      
                      
        <br><br>              
                  <!-- END switch_user_logged_out -->
          
          
          
   <!-- BEGIN switch_user_logged_in -->
          
          <div id="content_header">
            <div class="smallpanel">
      
                  <ul id="nav">
                     <li class=""><a>مرحبا بكم في {SITENAME}</a>
                     </li>
                  </ul>
                  <div id="adminbar">
                  <table width="100%">
            <tbody><tr>
            

            <!--<td class="td" align="left"></td>-->
               <td class="td" align="left">
                     <div class="header_dropdown" id="header_dropdown">
                                       
               </td>
               <td class="td" align="left">
               
               
                     
                  
               </td>
               
               <td class="td" align="left"><font color="red">{CURRENT_TIME}</font></td>
               <td class="td" align="left"><font color="red">{LAST_VISIT_DATE}</font></td>
               <td class="tr" align="left"> <font color="">{LOGGED_AS}</font></td>
         

            </tr>
         </tbody></table>
            
                  </div>
            </div>
            <div class="clearingfix"></div>
            
</div>
             <br><br>                  
                                               <!-- END switch_user_logged_in -->  




ونسجل ثم ننشر

ثم نروح ل

لوحة الادارة >> مظهر المنتدى >> الوان >> ورقة css

ونحط هذا الكود




الكود:
/* administrator welcome */
html[dir="ltr"] #adminbar
{
   float: right;

}
html[dir="rtl"] #adminbar
{
   float: left;
}
#adminbar {margin-top:4px;font-family:tahoma,Arial,helvetica,sans-serif;border: 0 none;padding:0;height: 40px;color: #DDD;text-shadow:  0 -1px 0 #151515;-moz-text-shadow: 0 -1px 0 #151515;}
#adminbar .textc {
  padding: 7px 0 7px 6px;
  width: 150px;
  color: #59626e;
  font-weight: normal;
 font-family:tahoma, Arial, Helvetica, sans-serif;
  font-size: 11px;
  line-height: 11px;
  background: #202328;
  border: none;
  border-radius: 3px;
  -moz-border-radius: 3px;
   border: 1px solid #2e3138; border-radius: 3px; -o-border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px;
}
#adminbar .td,#adminbar .tr {
  font-weight: bold;
  font-family: arial, "Lucida Grande", "Verdana", sans-serif;
  font-size: 16px;
  color:#ccc;
  padding:6px 9px;
  border-right: 1px solid #333
}
#adminbar .tr  a{
color:#ccc;
}
/*
HEADER LOGIN FORM
*/
.head-login
{
   padding: 1px 10px 3px 10px;
   color: #ddd;
   font: normal 11px/100% tahoma, Helvetica, sans-serif;
   float:right
}
.head-login input
{
   background:#EEE;
   color: #000;
   padding: 4px;
   border:none;
   text-align:center;
   font-family:Droid Arabic Kufi, tahoma, Helvetica, sans-serif;
   font-weight: bold;
   border-radius:4px;
   box-shadow: inset 0 1px 2px rgba(0,0,0,.2);
}
.float-left
{
    float: left;
}
html[dir="rtl"] .float-left
{
    float: right;
}
.float-left a
{
   color:#0770a0;
   text-decoration:none;
}
#adminbar button {
  padding: 6px 10px;
  color: #999;
  font-weight: normal;
  font-family: tahoma, "Lucida Grande", "Verdana", sans-serif;
  font-size: 11px;
  line-height: 11px;
   background: #424242 none;
   background: -webkit-gradient(linear, left top, left bottom, from(#505050), to(#343434));
   background: -moz-linear-gradient(top, #505050, #343434);
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#FF505050, endColorstr=#FF343434);
   -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#FF505050, endColorstr=#FF343434)";
   background: -ms-linear-gradient(top, #505050, #343434);
   background: -o-linear-gradient(top, #505050, #343434);
   box-shadow:0 1px 4px rgba(0,0,0,0.7);  border: none;
  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.5), 0 1px 1px #444;
  -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.5), 0 1px 1px #444;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.5), 0 1px 1px #444;
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-background-clip: padding-box;
}
#adminbar button:hover{
   background: #424242 none;
}

#content_header {
    margin:0;
   background: #DDD url(http://outlaws-forum.com/vb//themes/default/images/style/header-bg.jpg) repeat-x top center;
   box-shadow:0 1px 1px rgba(0,0,0,0.1);
   height:35px;
   padding:0 0 5px 0;
   width:100%;   
   z-index: 99;
   -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.;
   -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.;
   box-shadow:0 1px 3px rgba(0,0,0,0.;
}
#content_header .smallpanel {width:100%;height:32px;margin:0 0 5px 0;}
#content_header #nav, #nav * { z-index: 20;margin:0 2px; border-radius: 0 0 4px 4px; }
html[dir="ltr"] #nav
{
   float: left;

}
html[dir="rtl"] #nav
{
   float: right;
}
#nav {margin: 0;border: 0 none;padding: 0;width: auto;list-style: none;height: 24px;}
#nav li {margin: 0;border: 0 none;padding: 0;float: right;display: inline;list-style: none;position: relative;height: 24px;padding: 0;line-height: 23px;}
#nav ul {white-space: nowrap;margin: 0 !important;border: 0 none;padding: 0;width: 110px;list-style: none;display: none;position: absolute;top: 24px;left: 0;padding-top:1px;}
#nav ul:after {clear: both;display: block;font: 1px/0px serif;content: ".";height: 0;visibility: hidden;}
#nav ul li {width: 110px;float: right;display: block !important;   display:inline;position: relative;top: 0;height: 24px;line-height: 24px;padding: 0;background: none;}





.float-left
{
    float: left;
}
html[dir="rtl"] .float-left
{
    float: right;
}
.float-left a
{
   color:#0770a0;
   text-decoration:none;
}
#adminbar button {
  padding: 6px 10px;
  color: #999;
  font-weight: normal;
  font-family: tahoma, "Lucida Grande", "Verdana", sans-serif;
  font-size: 11px;
  line-height: 11px;
   background: #424242 none;
   background: -webkit-gradient(linear, left top, left bottom, from(#505050), to(#343434));
   background: -moz-linear-gradient(top, #505050, #343434);
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#FF505050, endColorstr=#FF343434);
   -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#FF505050, endColorstr=#FF343434)";
   background: -ms-linear-gradient(top, #505050, #343434);
   background: -o-linear-gradient(top, #505050, #343434);
   box-shadow:0 1px 4px rgba(0,0,0,0.7);  border: none;
  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.5), 0 1px 1px #444;
  -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.5), 0 1px 1px #444;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.5), 0 1px 1px #444;
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-background-clip: padding-box;
}
#adminbar button:hover{
   background: #424242 none;
}





#adminbar {margin-top:4px;font-family:tahoma,Arial,helvetica,sans-serif;border: 0 none;padding:0;height: 40px;color: #DDD;text-shadow:  0 -1px 0 #151515;-moz-text-shadow: 0 -1px 0 #151515;}
#adminbar .textc {
  padding: 7px 0 7px 6px;
  width: 150px;
  color: #59626e;
  font-weight: normal;
 font-family:tahoma, Arial, Helvetica, sans-serif;
  font-size: 11px;
  line-height: 11px;
  background: #202328;
  border: none;
  border-radius: 3px;
  -moz-border-radius: 3px;
   border: 1px solid #2e3138; border-radius: 3px; -o-border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px;
}
#adminbar .td,#adminbar .tr {
  font-weight: bold;
  font-family: arial, "Lucida Grande", "Verdana", sans-serif;
  font-size: 16px;
  color:#ccc;
  padding:6px 9px;
  border-right: 1px solid #333
}
#adminbar .tr  a{
color:#ccc;
}
/*
HEADER LOGIN FORM
*/
.head-login
{
   padding: 1px 10px 3px 10px;
   color: #ddd;
   font: normal 11px/100% tahoma, Helvetica, sans-serif;
   float:right
}
.head-login input
{
   background:#EEE;
   color: #000;
   padding: 4px;
   border:none;
   text-align:center;
   font-family:Droid Arabic Kufi, tahoma, Helvetica, sans-serif;
   font-weight: bold;
   border-radius:4px;
   box-shadow: inset 0 1px 2px rgba(0,0,0,.2);
}



#quicklinks
{
    background-color: #3399CC;

}
#flip-navigation li.selected a{
   background:#3399CC;
   color:#f0f0f0;
}
#flip-container div ul{

   background:#3399CC;
}
#content_header {
   position:fixed;
}

    



#content_header {
    margin:0;
   background: #DDD url(http://outlaws-forum.com/vb/themes/default/images/style/header-bg.jpg) repeat-x top center;
   box-shadow:0 1px 1px rgba(0,0,0,0.1);
   height:35px;
   padding:0 0 5px 0;
   width:100%;   
   z-index: 99;
   -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.;
   -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.;
   box-shadow:0 1px 3px rgba(0,0,0,0.;
}
#content_header .smallpanel {width:100%;height:32px;margin:0 0 5px 0;}
#content_header #nav, #nav * { z-index: 20;margin:0 2px; border-radius: 0 0 4px 4px; }
html[dir="ltr"] #nav
{
   float: left;

}
html[dir="rtl"] #nav
{
   float: right;
}
#nav {margin: 0;border: 0 none;padding: 0;width: auto;list-style: none;height: 24px;}
#nav li {margin: 0;border: 0 none;padding: 0;float: right;display: inline;list-style: none;position: relative;height: 24px;padding: 0;line-height: 23px;}
#nav ul {white-space: nowrap;margin: 0 !important;border: 0 none;padding: 0;width: 110px;list-style: none;display: none;position: absolute;top: 24px;left: 0;padding-top:1px;}
#nav ul:after {clear: both;display: block;font: 1px/0px serif;content: ".";height: 0;visibility: hidden;}
#nav ul li {width: 110px;float: right;display: block !important;   display:inline;position: relative;top: 0;height: 24px;line-height: 24px;padding: 0;background: none;}

/* Root Menu */
#nav a {background: #DDD url(http://outlaws-forum.com/vb/themes/default/images/style/user_navigation.png) repeat-x top left;border-right: 1px solid #333;border-left: 1px solid #222;float: none !important;float: right;display: block;height: auto !important;height: 1%;color: #999;cursor:pointer;font-family:tahoma,tahoma,helvetica,sans-serif;font-size:11px;font-weight: normal;padding:6px 15px;text-decoration:none;}

/* Root Menu Hover Persistence */
#nav a:hover, #nav li:hover a, #nav li.iehover a {height:29px;margin:0 2px;padding:6px 15px;
    background: #111;
}
#nav a:active, #nav li:active a, #nav li.iehover a {height:29px;margin-bottom:0px;padding:6px 15px;
   background: #000;
}


ونسجل

ومبرووك النافبار

تحياتي 

cool amir

فريق
المساعدة


[تومبلايت] تولبار خفيف للمنتديات  Help_r10
cool amir
cool amir
 
 

ذكر
عدد المساهمات : 5631
معدل النشاط : 13164
السُمعة : 140

http://www.stibda3.com

الرجوع الى أعلى الصفحة اذهب الى الأسفل

الرجوع الى أعلى الصفحة

- مواضيع مماثلة

 
صلاحيات هذا المنتدى:
لاتستطيع الرد على المواضيع في هذا المنتدى