:: TRAIDNT FORUM :: - Powered by vBulletin



منتديات همس القلوب


 
الرئيسيةالرئيسية  التسجيلالتسجيل  دخولدخول  

منتديات همس القلوب :: منتدى تطوير المواقع :: اكواد تومبيلات

شاطر
الخميس مارس 21, 2013 1:46 am
المشاركة رقم:
المعلومات
الكاتب:
اللقب:
المدير
الرتبه:
المدير
الصورة الرمزية


البيانات
عدد المساهمات : 997
السٌّمعَة : 1
تاريخ التسجيل : 14/02/2013
الإتصالات
الحالة:
وسائل الإتصال:
معاينة صفحة البيانات الشخصي للعضو http://hms-alqlop.ahlamontada.com


مُساهمةموضوع: كود التسجيل وتسجيل الدخول فوق الواجهة حصريا على منتديات همس القلوب 2013



كود التسجيل وتسجيل الدخول فوق الواجهة حصريا على منتديات همس القلوب 2013


بسم الله الرحمن الرحيم
| ₪|سلامٌ عليكم و رحمةٌ من اللهِ و بركاته | ₪| ..

مرحباً بكم أيها الكرام من أعضاء و زوار شركة فور ايجى من كل مكان

كود
تومبيلات مميز جدا يقوم الكود بوضع نافذة لتسجيل الدخول فوق الواجهة ولاكن
المرة مو مثل كل مرة المرة الكود مدعوم بتقنية الجافا سكربت

مميزاته :

الكود
لا يأثر على منظر المنتدى ولاكن يوجد نافذة صغيرة الحجم وقت الضغط عليها
تنزل نافذة التسجيل بطريقة مميزة و مدعومة بجافا سكربت مع العلم الكود و
الفكرة من اخوكم سام حميد

الخطوى الأولى :-

شرح تركيب الكود :

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

و نقوم بالبحث عن الكود التالي :

background="{T_BODY_BACKGROUND}" bgcolor="{T_BODY_BGCOLOR}"
text="{T_BODY_TEXT}" link="{T_BODY_LINK}" vlink="{T_BODY_VLINK}">[/



و أسفله تماما نضع هاد الكود التالي :



<!-- code by sam hameed -->
<!-- BEGIN switch_user_logged_out -->
<script type="text/javascript" src="http://fg-coding.bravehost.com/login_panel/mootools-1.2-core-yc.js"></script>
<script type="text/javascript" src="http://fg-coding.bravehost.com/login_panel/mootools-1.2-more.js"></script>
<script type="text/javascript" src="http://fg-coding.bravehost.com/login_panel/fx.slide.js"></script>
<div id="login_panel">
<div id="login">
<div class="loginContent">
<form action="login.forum?connexion" method="post" >
<label for="log"><b>أسم العضو : </b></label>
<input class="field" type="text" name="username" id="log" value="" size="23" />
<label for="pwd"><b>الرقم السري :</b></label>
<input class="field" type="password" name="password" id="pwd" size="23" />
<input type="submit" name="login" value="تسجيل الدخول" class="button_login" />
<input type="hidden" name="redirect_to" value=""/>
</form>
<div class="left">

<label for="rememberme"><input name="rememberme"
id="rememberme" class="rememberme" type="checkbox" checked="checked"
value="forever" />تذكر بيناتي</label></div>

<div class="right">ليس لديك حساب بعد؟ <a
href="/profile.forum?mode=register">يرجى تسجيل</a> | <a
href="/profile.forum?mode=sendpassword">هل فقدت كلمة
السر؟</a></div>
</div>
</div>
<div id="container">
<div id="top">
<!-- login -->
<ul class="login">
<li class="left"> </li>
<li>أهلا و سهلا </li>
<li>|</li>
<li><a id="toggleLogin" href="#Autentifica-te">أضغط هنا</a></li>
</ul> <!-- / login -->
</div> <!-- / top -->
</div>
</div>
<!-- END switch_user_logged_out -->
<!-- code by sam hameed -->













و من ثم نضغط سجل

ملاحظة ما تنسو تعملو نشر للقالب



الخطوة الثانية :

ليشتغل ستايل الكود علينا تركيب الكود التالي في صفحة الأنماط الأنسيابية

لوحة أدارة - مظهر المنتدى - ألوان - ورقة الانماط الانسيابية css

انضع الكود




/* code by asm hameed */

html, body {
border: 0; margin: 0; padding: 0;
}
#login_panel {
top: 0px;
position: absolute ;
width: 100% ;
z-index: 999;
}
#container {
width: 100%;
height: 100%;
text-align: center;
}
/* code by asm hameed */
/* Login Panel */
#top {
background: url(https://i.servimg.com/u/f25/14/45/99/41/login_10.png) repeat-x 0 0;
height: 38px;
position: relative;
}
#top ul.login {
display: block;
position: relative;
float: right;
clear: right;
height: 38px;
width: auto;
font-weight: bold;
line-height: 38px;
margin: 0;
right: 150px;
color: white;
font-size: 80%;
text-align: center;
background: url(https://i.servimg.com/u/f25/14/45/99/41/login_11.png) no-repeat right 0;
padding-right: 45px;
}
#top ul.login li.left {
background: url(https://i.servimg.com/u/f25/14/45/99/41/login_12.png) no-repeat left 0;
height: 38px;
width: 45px;
padding: 0;
margin: 0;
display: block;
float: left;
}
#top ul.login li {
text-align: left;
padding: 0 6px;
display: block;
float: left;
height: 38px;
background: url(https://i.servimg.com/u/f25/14/45/99/41/login_13.png) repeat-x 0 0;
}
#top ul.login li a {
color: #33CCCC;
}
#top ul.login li a:hover {
color: white;
}
/*Login*/
/* code by asm hameed */
#login {
width: 100%;
color: white;
background: #333333;
overflow: hidden;
position: relative;
z-index: 3;
height: 0;
}
#login a {
text-decoration: none;
color: #33CCCC;
}
#login a:hover {
color: white;
}
#login .loginContent {
width: 700px;
margin:5px auto;
text-align: left;
font-size: 0.85em;
}
#login .loginContent .left {
width: 100px;
float: left;
padding-left: 120px;
font-size: 0.95em;
}
#login .loginContent .right {
width: 350px;
float: right;
text-align: right;
padding-right: 90px;
font-size: 0.95em;
}
#login .loginContent form {
margin: 0 0 10px 0;
height: 26px;
}
#login .loginContent input.field {
border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border: 1px #5e5e5e solid;
background: #464646;
margin-right: 5px;
margin-top: 4px;
color: white;
height: 16px;
}
#login .loginContent input:focus.field {
background: #777777;
}
#login .loginContent input.rememberme {
border: none;
background: transparent;
margin: 0;
padding: 0;
}
#login .loginContent input.button_login {
border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
background-color: #4d4d4d;
color: #a8a8a8;
cursor: pointer;
border: 1px solid #5e5e5e;
}
#login .loginContent input.button_login:hover {
color: #d2d2d2;
border: 1px solid #7f7f7f;
}
#toggleLogin {
text-decoration: none;
}
/* code by asm hameed */




اتمنى ان يعجبكم




توقيع : محمد نور العسلي





الثلاثاء يوليو 16, 2013 1:36 am
المشاركة رقم:
المعلومات
الكاتب:
اللقب:
الرتبه:
الصورة الرمزية


البيانات
عدد المساهمات : 312
السٌّمعَة : 0
تاريخ التسجيل : 23/02/2013
الإتصالات
الحالة:
وسائل الإتصال:
معاينة صفحة البيانات الشخصي للعضو


مُساهمةموضوع: _da3m_13



كود التسجيل وتسجيل الدخول فوق الواجهة حصريا على منتديات همس القلوب 2013


بسم الله الرحمن الرحيم .
بارك الله فيك وجزاك الله خيرا
على الجهود المبذولة والمعلومات المفيدة
تقبل الله منا ومنكم صالح الاعمال
مع كل التحية والتقدير





توقيع : فهد







الإشارات المرجعية
التعليق على الموضوع بواسطة الفيس بوك
الــرد الســـريـع
..


الذين يشاهدون محتوى الموضوع الآن : 20 ( الأعضاء 3 والزوار 17)



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

BB code is متاحة
كود [IMG] متاحة
كود HTML معطلة


يحتوي على مشاركات جديدة  منتدى يحتوي على مشاركات جديدة
لا يحتوي على مشاركات جديدة  منتدى لا يحتوي على مشاركات جديدة
منتدى مغلق  منتدى مغلق عن المشاركات