wordpress前臺(tái)登錄框制作
2018-11-02 來(lái)源：學(xué)做網(wǎng)站論壇
在之前的建站教程中，我們講解過(guò)如何制作WP網(wǎng)站的登錄功能，注冊(cè)功能，這種功能是使用二個(gè)超鏈接，引導(dǎo)用戶進(jìn)入注冊(cè)和登錄頁(yè)面。
但在使用wordpress建網(wǎng)站時(shí)，有時(shí)需要在網(wǎng)站前臺(tái)制作登錄框，方便用戶登錄。如下圖：
如何在自己做網(wǎng)站時(shí)能夠制作這樣的前臺(tái)登錄框呢？下面學(xué)做網(wǎng)站論壇就來(lái)介紹一下wordpress前臺(tái)登錄框制作步驟。
一、制作登錄框表單
在網(wǎng)站需要顯示登錄框的位置，放上以下的代碼，用于顯示登錄框。
<div class="a31">會(huì)員登陸</div>
<div class="a32">
<?php
/*if(!empty($error)) {
?'<p class="ludou-error">'.$error.'</p>';
}*/
if (!is_user_logged_in()) { ?>
? <form name="loginform" method="post" action="<?php echo $_SERVER["REQUEST_URI"]; ?>" class="ludou-login">
? <table width="100%" cellspacing="0" cellpadding="0" border="0">
? <tbody><tr>
? <td style="color:#03C; font-weight:bold;" width="30%" height="30" align="center">用戶名</td>
? <td width="70%" align="center"><input name="log" id="log" class="input" value="<?php if(!empty($user_name)) echo $user_name; ?>" style="width:140px;" type="text"></td>
? </tr>
? <tr>
? <td style="color:#03C; font-weight:bold;" width="30%" height="30" align="center">密 碼</td>
? <td width="70%" align="center"><input name="pwd" id="pwd" class="input" style="width:140px;" type="password"></td>
? </tr>
? <tr>
? <td style="color:#03C; font-weight:bold;" width="30%" height="30" align="center">驗(yàn)證碼</td>
? <td width="70%" align="center"><input name="validate" id="validate" class="login_input" maxlength="4" style="width:40px" type="text"> <span><img id="ckstr" src="<?php bloginfo('template_directory'); ?>/images/ckstr.jpg" style="cursor:pointer;" onclick="this.src=this.src+'?'" align="absmiddle"> <a href="javascript:;" onclick="var v=document.getElementById('ckstr');v.src=v.src+'?';return false;" style="font-size:12px; color:#FFF">看不清?</a></span></td>
? </tr>
? <tr><td colspan="2" height="30" align="center"><input type="hidden" name="redirect_to" value="<?php if(isset($_GET['r'])) echo $_GET['r']; ?>" />
? <input type="hidden" name="ludou_token" value="<?php echo $token; ?>" /><input value="登錄" style="width:50px;" type="submit"><input value="重置" style="width:50px;" type="reset"><input value="注冊(cè)" style="width:50px;" onclick="javascript:window.location.href='<?php echo get_option('home'); ?>/?page_id=1215'" type="button"></td></tr>
? </tbody></table></form>
<?php } else { ?>
<p>尊敬的會(huì)員 <a style="font-weight:600;color:red" href="<?php bloginfo('siteurl');?>/wp-admin/profile.php" target="_blank" rel="nofollow"><strong><?php echo $user_identity ?></strong></a> 您好！</p>
<p><a class="log" href="<?php bloginfo('siteurl');?>/wp-admin/profile.php" target="_blank" rel="nofollow">[會(huì)員中心]</a></p>
<p class="ludou-error"><a href="<?php echo wp_logout_url( home_url() ); ?>">退出登錄</a></p>
<?php } ?> </div>
二、添加表單數(shù)據(jù)處理代碼
將頁(yè)面的<?php get_header()?>替換為下面的代碼。用于驗(yàn)證表單提交的數(shù)據(jù)。
<?php
/**
?* Template Name: 前臺(tái)登錄
?* 代碼來(lái)源：學(xué)做網(wǎng)站論壇 https://www.xuewangzhan.com/
?*/
?
if(!isset($_SESSION))
? session_start();
?
if( isset($_POST['ludou_token']) && ($_POST['ludou_token'] == $_SESSION['ludou_token'])) {
? $error = '';
? $secure_cookie = false;
? $user_name = sanitize_user( $_POST['log'] );
? $user_password = $_POST['pwd'];
? if ( empty($user_name) || ! validate_username( $user_name ) ) {
? $error .= '<strong>錯(cuò)誤</strong>：請(qǐng)輸入有效的用戶名。<br />';
? $user_name = '';
? }
?
? if( empty($user_password) ) {
? $error .= '<strong>錯(cuò)誤</strong>：請(qǐng)輸入密碼。<br />';
? }
?
? if($error == '') {
? // If the user wants ssl but the session is not ssl, force a secure cookie.
? if ( !empty($user_name) && !force_ssl_admin() ) {
? if ( $user = get_user_by('login', $user_name) ) {
? if ( get_user_option('use_ssl', $user->ID) ) {
? $secure_cookie = true;
? force_ssl_admin(true);
? }
? }
? }
? if ( isset( $_GET['r'] ) ) {
? $redirect_to = $_GET['r'];
? // Redirect to https if user wants ssl
? if ( $secure_cookie && false !== strpos($redirect_to, 'wp-admin') )
? $redirect_to = preg_replace('|^http://|', 'https://', $redirect_to);
? }
? else {
? $redirect_to = admin_url();
? }
? if ( !$secure_cookie && is_ssl() && force_ssl_login() && !force_ssl_admin() && ( 0 !== strpos($redirect_to, 'https') ) && ( 0 === strpos($redirect_to, 'http') ) )
? $secure_cookie = false;
? $creds = array();
? $creds['user_login'] = $user_name;
? $creds['user_password'] = $user_password;
? $creds['remember'] = !empty( $_POST['rememberme'] );
? $user = wp_signon( $creds, $secure_cookie );
? if ( is_wp_error($user) ) {
? $error .= $user->get_error_message();
? }
? else {
? unset($_SESSION['ludou_token']);
? wp_safe_redirect($redirect_to);
? }
? }
? unset($_SESSION['ludou_token']);
}
$rememberme = !empty( $_POST['rememberme'] );
?
$token = md5(uniqid(rand(), true));
$_SESSION['ludou_token'] = $token;
get_header();>
三、表單樣式的美化
通過(guò)上面的代碼，我們的網(wǎng)站就已經(jīng)擁有前臺(tái)登錄框了，如果想美化登錄框，可以使用CSS樣式作一些樣式控制。
除了制作wordpress前臺(tái)登錄框，我們還可以制作wordpress網(wǎng)站添加前臺(tái)注冊(cè)功能。
標(biāo)簽： ssl 代碼 建網(wǎng)站 建站 建站教程
版權(quán)申明：本站文章部分自網(wǎng)絡(luò)，如有侵權(quán)，請(qǐng)聯(lián)系：west999com@outlook.com
特別注意：本站所有轉(zhuǎn)載文章言論不代表本站觀點(diǎn)！
本站所提供的圖片等素材，版權(quán)歸原作者所有，如需使用，請(qǐng)與原作者聯(lián)系。
最新資訊
熱門推薦