作者 主題: ecshop 快速登入&會員登入詳解  (閱讀 283 次)

0 會員 與 1 訪客 正在閱讀本文。

離線 andy

  • 管理員
  • 正式會員
  • *****
  • 積分 +1/-0
  • 性別: 男
    • 原來如此
ecshop 快速登入&會員登入詳解
« 於: 七月 14, 2019, 05:08:17 下午 »
        原本的 ecshop 會員登入都是先進入登入頁面,因此有些模板會將它改成直皆可輸入帳號密碼的介面,訪客可以直接登入,而不需先進入登入頁面




ecshop 會員登入的頁面是在 library/page_header.lbi ,然後透過 insert 動態的貨得訪客的登入訊息,再經由 library/member_info.lbi 顯示出來,因為每個模板頁面都會加入 library/page_header.lbi ,因此凡是放在 library/page_header.lbi 內的元素,都可已顯示在每個頁面,打開 library/member_info.lbi ,原本的程式碼可能像這樣(依使用模板而定):
代碼: [選擇]
{if $user_info}
<font style="position:relative; top:10px;">
{$lang.hello},<font class="f4_b">{$user_info.username}</font>, {$lang.welcome_return}!
<a href="user.php">{$lang.user_center}</a>|
<a href="user.php?act=logout">{$lang.user_logout}</a>
</font>
{else}
{$lang.welcome}&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;
<a href="user.php"><img src="images/bnt_log.gif" /></a>
<a href="user.php?act=register"><img src="images/bnt_reg.gif" /></a>
{/if}
改成
代碼: [選擇]
{if $user_info}
<font><b>{$user_info.username}</b>&amp;nbsp;{$lang.hello}&amp;nbsp;{$lang.welcome_return}!</font>
<a href="user.php">{$lang.edit_user_info}</a>
<a href="user.php?act=logout">{$lang.user_logout}</a>
{else}
{insert_scripts files='transport.js'}
<form id="ECS_LOGINFORM" name="ECS_LOGINFORM" method="post" action="">
帳號: <input name="username" type="text" class="UserInput" size="10" tabindex="1" value="{$ecs_username|escape}" />
 密碼: <input name="password" type="password" size="10" tabindex="2" />
 <!-- 判斷是否啟用驗證碼{if $enabled_captcha} -->
<img src="captcha.php?is_login=1&amp;{$rand}" alt="captcha" style="vertical-align: middle;cursor: pointer;" onClick="this.src='captcha.php?is_login=1&amp;'+Math.random()" />&amp;nbsp;&amp;nbsp;<input type="text" size="4" name="captcha" value="{$lang.comment_captcha}" onfocus="if (this.value=='{$lang.comment_captcha}')this.value=''" onblur="if (this.value=='')this.value='{$lang.comment_captcha}'" class="UserInput" style="width:60px;" />
<!--{/if}-->
 <a href="javascript:void(0);" onclick="signIn()">登入</a>
 <a id="header_UserRegister" href="user.php?act=register">註冊</a>
</form>
{literal}
<script type="text/javascript">
/**
* 會員登錄
*/
function signIn()
{
 var frm = document.forms['ECS_LOGINFORM'];

 if (frm)
 {
 var username = frm.elements['username'].value;
 var password = frm.elements['password'].value;
 var captcha = '';
 if (frm.elements['captcha'])
 {
 captcha = frm.elements['captcha'].value;
 }

 if (username.length == 0 || password.length == 0)
 {
 alert("{$lang.empty_username_password}");
 return;
 }
 else
 {
 Ajax.call('user.php?act=signin', 'username=' + username + '&amp;password=' + encodeURIComponent(password) + '&amp;captcha=' + captcha, signinResponse, "POST", "TEXT");
 }
 }
 else
 {
 alert('Template error!');
 }
}

function signinResponse(result)
{
 var userName = document.forms['ECS_LOGINFORM'].elements['username'].value;
 var mzone = document.getElementById("ECS_MEMBERZONE");
 var res = result.parsejsON();

 if (res.error > 0)
 {
 // 登錄失敗
 alert(res.content);
 if(res.html)
{
 mzone.innerhtml = res.html;
 document.forms['ECS_LOGINFORM'].elements['username'].value = userName;
}
 }
 else
 {
 if (mzone)
 {
 mzone.innerhtml = res.content;
 evalscript(res.ucdata);
 }
 else
 {
 alert("Template Error!");
 }
 }
}
</script>
{/literal}
{/if}

{if $user_info}如果是登入會員
{$user_info.username} 會員帳號
{$lang.hello}  {$lang.welcome_return} 歡迎詞
{$lang.edit_user_info} 會員中心
{$lang.user_logout} 登出
{else}
{insert_scripts files='transport.js'} 導入javascript檔案
{$ecs_username|escape} 帳號
{if $enabled_captcha} 判斷是否啟用驗證碼
完成之後外觀因模板的關係,或多或少都需要修改一下[strong]html[/strong]...
LINE ID:ecshop_weshop
Email:andy@we-shop.net
聯絡我:https://we-shop.net/contactus.php

離線 yian

  • VIP會員
  • 正式會員
  • ******
  • 積分 +0/-0
Re:ecshop 快速登入&會員登入詳解
« 回覆 #1 於: 九月 16, 2019, 02:19:49 下午 »
Andy 您好,
那請教模板的部分需要從哪裡著手呢?
雖然我用的是Default的模板就是了..

離線 andy

  • 管理員
  • 正式會員
  • *****
  • 積分 +1/-0
  • 性別: 男
    • 原來如此
Re:ecshop 快速登入&會員登入詳解
« 回覆 #2 於: 九月 16, 2019, 02:32:32 下午 »
請參考之前寫的教學http://we-shop.net/bbs/index.php?board=35.0也是以default為例的希望對你有幫助...
LINE ID:ecshop_weshop
Email:andy@we-shop.net
聯絡我:https://we-shop.net/contactus.php