المساعد الشخصي الرقمي

مشاهدة النسخة كاملة : تسجيل الدخول كما في تويتر .... طور نفسك الان مع الشرح طريقة الكامل



salima
10-31-2013, بتوقيت غرينيتش 02:24 AM
http://www.dzbatna.com/images/icons/icon30.gif طھط³ط¬ظٹظ„ ط§ظ„ط¯ط®ظˆظ„ ظƒظ…ط§ ظپظٹ طھظˆظٹطھط± .... ط·ظˆط± ظ†ظپط³ظƒ ط§ظ„ط§ظ† ظ…ط¹ ط§ظ„ط´ط±ط* ط§ظ„ظƒط§ظ…ظ„ (http://www.dzbatna.com/t1542145/)



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


وانا ابحث في منتديات ديزاد باتنة العربي رايت كود code التسجيل كما في موقع تويتر

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

وهو امر التعديل على قالب template
navbar

يعني هو كاتب انو نحط الكود code في الهيدر header او النافبار حسب الرغبه بس هيك رح يكون عنا مكانين لتسجيل الدخول

اولا رح نبقى مع مثال مباشر
www.as300.com/vb (http://www.as300.com/vb)

ثانيا
رح نبقى مع الشرح طريقة الكامل من جديد من اجل التعديل لديكم احبتي

اولا نضع الاكواد التاليه
ضع في اخر تعاريف CSS الإضافية/Additional CSS
Definitions
رمز PHP:

<code style="white-space:nowrap"> <code> /* ***** login ***** */
#container {
float:right;
margin:0 auto;
position: relative;
}
a img {
border-width:0;
}
#topnav {
padding:10px 0px 12px;
font-size:11px;
line-height:23px;
text-align:right;
}
#topnav a.signin {
background:#ED8522;
padding:4px 6px 6px;
text-decoration:none;
font-weight:bold;
color:#fff;
-webkit-border-radius:4px;
-moz-border-radius:4px;
border-radius:4px;
*background:transparent url("./login/images/signin-nav-bg-ie.png") no-repeat 0 0;
*padding:4px 12px 6px;
}

#topnav a.signin:hover {
background:#F59A41;
*background:transparent url("./login/images/signin-nav-bg-hover-ie.png") no-repeat 0 0;
*padding:4px 12px 6px;
}
#topnav a.signin, #topnav a.signin:hover {
*background-position:0 3px!important;
}
a.signin span {
background-image:url("./login/images/toggle_down_light.png");
background-repeat:no-repeat;
padding:4px 16px 6px 0;
}

#topnav a.register {
background:#ED8522;
padding:4px 6px 6px;
text-decoration:none;
font-weight:bold;
color:#fff;
-webkit-border-radius:4px;
-moz-border-radius:4px;
border-radius:4px;
*background:transparent url("./login/images/signin-nav-bg-ie.png") no-repeat 0 0;
*padding:4px 12px 6px;
}

#topnav a.register:hover {
background:#F59A41;
*background:transparent url("./login/images/signin-nav-bg-hover-ie.png") no-repeat 0 0;
*padding:4px 12px 6px;
}
#topnav a.register, #topnav a.register:hover {
*background-position:0 3px!important;
}
a.register span {
background-repeat:no-repeat;
background-position:100% 50%;
padding:4px 16px 6px 0;
}
#topnav a.menu-open {
background:#ED8522!important;
color:#fff!important;
outline:none;
}
#small_signup {
display:inline;
float:none;
line-height:23px;
margin:25px 0 0;
width:170px;
}
a.signin.menu-open span {
background-image:url("./login/images/toggle_up_light.png");
color:#fff;
}
#signin_menu {
-moz-border-radius-topleft:5px;
-moz-border-radius-bottomleft:5px;
-moz-border-radius-bottomright:5px;
-webkit-border-top-left-radius:5px;
-webkit-border-bottom-left-radius:5px;
-webkit-border-bottom-right-radius:5px;
display:none;
/* background-color:#ED8522; */
background:url(login/images/login_back.png) #ED8522 repeat-x;
position:absolute;
width:210px;
z-index:100;
border:1px transparent;
text-align:left;
padding:12px;
top: 24.5px;
right: 0px;
margin-top:5px;
margin-right: 0px;
*margin-right: -1px;
color:#fff;
font-size:11px;
}
#signin_menu input&#91;type=text&#93;, #signin_menu input&#91;type=password&#93; {
display:block;
-moz-border-radius:4px;
-webkit-border-radius:4px;
border:1px solid #ED8522;
background:url(login/images/field_back.png) repeat-x;
font-size:13px;
margin:0 0 5px;
padding:5px;
width:203px;
}
#signin_menu p {
margin:0;
}
#signin_menu a {
color:#fff;
}
#signin_menu label {
font-weight:normal;
}
#signin_menu p.remember {
padding:10px 0;



}
#signin_menu p.forgot, #signin_menu p.complete {
clear:both;
margin:5px 0;
}
#signin_menu p a {
color:#fff!important;
}
#signin_menu p a:hover {
text-decoration:underline;
}
#signin_submit {
-moz-border-radius:4px;
-webkit-border-radius:4px;
background-color:#ED8522;
border:1px solid #fff;
color:#fff;
text-shadow:0 -1px 0 #39d;
padding:4px 10px 5px;
font-size:11px;
margin:0 5px 0 0;
font-weight:bold;
}
#signin_submit::-moz-focus-inner {
padding:0;
border:0;
}
#signin_submit:hover, #signin_submit:focus {
background-position:0 -5px;
cursor:pointer;
}
/* ***** login ***** */
</code> </code>

الان نجي للامر الثاني وهو التعديل على قالب template النافبار وهذا هو الامر المهم لانه اخينا صاحب الموضوع في ديزاد باتنة لم يقم بشرح طريقة هذه النقطه
وانا اشرح طريقةها لكم في منتديات ديزاد باتنة
ندخل قالب template navbar للستايل style المراد التعديل عليه
ثم نبحث عن
رمز PHP:

<code style="white-space:nowrap"> <code> <!-- login form -->
<form action="login.php?do=login" method="post" onsubmit="md5hash(vb_login_password, vb_login_md5password, vb_login_md5password_utf, $show&#91;nopasswordempty&#93;)">
<script type="text/javascript" src="clientscript/vbulletin_md5.js?v=$vboptions&#91;simpleversion&#93;"></script>
<table cellpadding="0" cellspacing="$stylevar&#91;formspacer&#93;" border="0">
<tr>
<td class="smallfont" style="white-space: nowrap;"><label for="navbar_username">$vbphrase&#91;username&#93;</label></td>
<td><input type="text" class="bginput" style="font-size: 11px" name="vb_login_username" id="navbar_username" size="10" accesskey="u" tabindex="101" value="$vbphrase&#91;username&#93;" onfocus="if (this.value == '$vbphrase&#91;username&#93;') this.value = '';" /></td>
<td class="smallfont" nowrap="nowrap"><label for="cb_cookieuser_navbar">
<input type="checkbox" name="cookieuser" value="1" tabindex="103" id="cb_cookieuser_navbar" accesskey="c" checked />$vbphrase&#91;remember_me&#93;</label></td>
</tr>
<tr>
<td class="smallfont"><label for="navbar_password">$vbphrase&#91;password&#93;</label></td>
<td><input type="password" class="bginput" style="font-size: 11px" name="vb_login_password" id="navbar_password" size="10" tabindex="102" /></td>
<td><input type="submit" class="button" value="$vbphrase&#91;log_in&#93;" tabindex="104" title="$vbphrase&#91;enter_username_to_login_or_register&#93;" accesskey="s" /></td>
</tr>
</table>
<input type="hidden" name="s" value="$session&#91;sessionhash&#93;" />
<input type="hidden" name="securitytoken" value="$bbuserinfo&#91;securitytoken&#93;" />
<input type="hidden" name="do" value="login" />
<input type="hidden" name="vb_login_md5password" />
<input type="hidden" name="vb_login_md5password_utf" />
</form>
<!-- / login form -->
</code> </code>

نحذف ما بين
رمز PHP:

<code style="white-space:nowrap"> <code> <!-- / login form -->
</code> </code>

ونضع الكود code التالي مكانهم
رمز PHP:

<code style="white-space:nowrap"> <code> <if condition="$show&#91;'guest'&#93;">
<script src="login/javascripts/jquery.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$(".signin").click(function(e) {
e.preventDefault();
$("fieldset#signin_menu").toggle();
$(".signin").toggleClass("menu-open");
});
$("fieldset#signin_menu").mouseup(function() {
return false
});
$(document).mouseup(function(e) {
if($(e.target).parent("a.signin").length==0) {
$(".signin").removeClass("menu-open");
$("fieldset#signin_menu").hide();
}
});
});
</script>
<script type="text/javascript" src="clientscript/vbulletin_md5.js?v=$vboptions&#91;simpleversion&#93;"></script>


<div id="container">
<div id="topnav" class="topnav"> هل لديك حساب <a href="login.php" class="signin"><span>دخول</span></a> <a href="./register.php" class="register"><span>التسجيل</span></a> </div>
<fieldset id="signin_menu">
<form method="post" id="signin" action="login.php?$session&#91;sessionurl&#93;do=login" onsubmit="md5hash(vb_login_password, vb_login_md5password, vb_login_md5password_utf, {vb:raw show.nopasswordempty})">
<label for="username">الاسم</label>
<input id="navbar_username" type="text" value="" tabindex="101" accesskey="u" name="vb_login_username" />
</p>
<p>
<label for="password">الرقم السري</label>
<input id="navbar_password" type="password" value="" tabindex="102" accesskey="u" name="vb_login_password" />
</p>
<p class="remember">
<input type="submit" id="signin_submit" value="دخول" tabindex="104" title="Login" accesskey="s" />
<input id="cb_cookieuser_navbar" type="checkbox" accesskey="c" tabindex="103" value="1" name="cookieuser" checked="checked"/>
<label for="cb_cookieuser_navbar">تذكرني ؟</label>
</p>
<p class="forgot"> <a href="./login.php?do=lostpw">نسيت الرقم السري ؟</a> </p>
<p class="forgot-username"> <A title="لا تنسى ان تضع بريدك في الرسالة."
href="./sendmessage.php">نسيت اسم العضوية ؟</A> </p>
<input type="hidden" name="s" value="$session&#91;sessionhash&#93;" />

<input type="hidden" name="securitytoken" value="$bbuserinfo&#91;securitytoken&#93;" />
<input type="hidden" name="do" value="login" />
<input type="hidden" name="vb_login_md5password" />
<input type="hidden" name="vb_login_md5password_utf" />
</form>
</fieldset>
</div>
</if>
</code> </code>

بعد ذلك نقوم برفع الملف المرفق الى مجلد منتداك الرئيسي
ليكون بهذا الشكل
vb/login


والان الشكل النهائي يصبح لدنيا كالاتي
http://www.as300.com/upload//uploads/images/www.as300.com5cb88f4e16.jpg

http://www.as300.com/upload//uploads/images/www.as300.com90daecd09c.jpg


ومبروك عليكم التغيير الجديد


اكيد رح يجي منكم ويقووول مكرر لكن اتحداكم اذا يكون صاحب موضوع تغيير شكل الدخول شارح طريقه التعديل في قالب template النافبار وهي الاهم لانو البعض ما رح يعرف كيف رح يعدل او شو يعدل في القالب template

وان شاء الله نكون قدنا المفيد لكم


رابط الموضوع الاصلي
http://www.as300.com/vb/showthread.php?p=1037#post1037










ألعاب الأندرويد مجانا و حصريا (http://www.apotox.info/forum)

الملفات المرفقة
http://www.traidnt.net/vb/images/attach/zip.gif login.zip (http://www.traidnt.net/vb/attachments/478368d1272097416-login.zip) (26.4 كيلوبايت, عدد مرات المشاهدة 115 مرة)


https://fbcdn-sphotos-d-a.akamaihd.net/hphotos-ak-ash4/482113_236967293114455_1193518507_n.png (http://www.dzbatna.com)
©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى (http://www.dzbatna.com)©

استعمل مربع البحث في الاسفل لمزيد من المواضيع


سريع للبحث عن مواضيع في المنتدى