Để tạo trang đăng nhập hoặc đăng ký thành viên chúng ta hay dùng Plugin , Hôm nay tôi gới thiệu cho bạn Tạo trang đăng nhập và đăng ký thành viên bằng short code Flatsome
Tạo trang đăng nhập và đăng ký thành viên bằng short code
Tạo Short Đăng nhập cho Flatsome
Đầu tiên các bạn cần mở file funcition.php trong thư mục theme mà bạn đang sử dụng lên. Sao chép toàn bộ code bên dưới rồi dán vào file và lưu lại.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 |
/*tao short đăng nhập */ add_shortcode( 'dangnhap', 'show_dangnhap' ); function show_dangnhap() { ?> <?php global $hrm_options; if(is_user_logged_in()) { if(is_super_admin()) { ?> <script> window.location.href = '<?php echo home_url('dashboard'); ?>'; </script><?php } else { ?> <script> window.location.href = '<?php echo home_url('/'); ?>'; </script><?php } } get_header(); ?> <div class="login"> <div class="login-title"> <h3> <?php $login = (isset($_GET['login']) ) ? $_GET['login'] : 0; if ( $login === "failed" ) { echo 'Sai tài khoản hoặc mật khẩu.'; } elseif ( $login === "empty" ) { echo 'Tài khoản và mật khẩu không thể bỏ trống'; } elseif ( $login === "false" ) { echo 'Bạn đã thoát ra.'; } else { echo 'Đăng nhập'; } ?> </h3> </div> <div> <div class="mod-login clearfix"> <div class="mod-login-col1 clearfix"> <?php $args = array( 'redirect' => site_url( $_SERVER['REQUEST_URI'] ), 'form_id' => 'dangnhap', //Để dành viết CSS 'label_username' => __( 'Tên tài khoản' ), 'label_password' => __( 'Mật khẩu' ), 'label_remember' => __( 'Ghi nhớ' ), 'label_log_in' => __( 'Đăng nhập' ), ); wp_login_form($args); ?> <div class="forgot"> <a href="<?php echo home_url('/reset-password') ?>">Quên mật khẩu ?</a> </div> </div> </div> </div> </div> <?php } |
Đoạn code trên ta được 1 short là [dangnhap]
Tương tự ta tạo Short Đăng ký cho Flatsome
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 |
/*tao short Đăng ký */ add_shortcode( 'dangky', 'show_dangky' ); function show_dangky() { ?> <?php global $hrm_options; if(is_user_logged_in()) { wp_redirect( home_url() ); } session_start(); $check_capt = ''; get_header(); ?> <div class="login register"> <div class="login-title"> <h3> <?php $err = ''; $success = ''; global $wpdb, $PasswordHash, $current_user, $user_ID; if(isset($_POST['task']) && $_POST['task'] == 'register' ) { if ($_SESSION['answer'] == $_POST['answer'] ) { $pwd1 = $wpdb->escape(trim($_POST['pwd1'])); $pwd2 = $wpdb->escape(trim($_POST['pwd2'])); $email = $wpdb->escape(trim($_POST['email'])); $username = $wpdb->escape(trim($_POST['username'])); if( $email == "" || $pwd1 == "" || $pwd2 == "" || $username == "") { $err = 'Vui lòng không bỏ trống những thông tin bắt buộc!'; } else if(!filter_var($email, FILTER_VALIDATE_EMAIL)) { $err = 'Địa chỉ Email không hợp lệ!.'; } else if(email_exists($email) ) { $err = 'Địa chỉ Email đã tồn tại!.'; } else if($pwd1 <> $pwd2 ){ $err = '2 Password không giống nhau!.'; } else { $user_id = wp_insert_user( array ( 'user_pass' => apply_filters('pre_user_user_pass', $pwd1), 'user_login' => apply_filters('pre_user_user_login', $username), 'user_email' => apply_filters('pre_user_user_email', $email), 'role' =>'contributor' ) ); if( is_wp_error($user_id) ) { $err = 'Lỗi khởi tạo người dùng'; } else { do_action('user_register', $user_id); $success = 'Bạn đã đăng ký thành công!'; $current_user = get_user_by( 'id', $user_id ); // set the WP login cookie $secure_cookie = is_ssl() ? true : false; wp_set_auth_cookie( $user_id, true, $secure_cookie ); ?> <script> alert('Đăng ký thành công'); window.location.href = '<?php echo home_url('/'); ?>'; </script><?php exit; } } } else { $check_capt = 'Sai captcha. Vui lòng nhập lại'; $digit1 = mt_rand(1,20); $digit2 = mt_rand(1,20); if( mt_rand(0,1) === 1 ) { $math = "$digit1 + $digit2"; $_SESSION['answer'] = $digit1 + $digit2; } else { $math = "$digit1 - $digit2"; $_SESSION['answer'] = $digit1 - $digit2; } } } else { $digit1 = mt_rand(1,20); $digit2 = mt_rand(1,20); if( mt_rand(0,1) === 1 ) { $math = "$digit1 + $digit2"; $_SESSION['answer'] = $digit1 + $digit2; } else { $math = "$digit1 - $digit2"; $_SESSION['answer'] = $digit1 - $digit2; } } if (!empty($err)) { echo $err; $digit1 = mt_rand(1,20); $digit2 = mt_rand(1,20); if( mt_rand(0,1) === 1 ) { $math = "$digit1 + $digit2"; $_SESSION['answer'] = $digit1 + $digit2; } else { $math = "$digit1 - $digit2"; $_SESSION['answer'] = $digit1 - $digit2; } } else { echo 'Đăng ký'; } if(! empty($success) ) : ?> <script> alert('Đăng ký thành công'); window.location.href = '<?php echo home_url('/dang-nhap'); ?>'; </script><?php endif; ?> </h3> <div class="login-other"> </div> </div> <div> <form class="form-horizontal" method="post" role="form"> <div class="mod-login clearfix"> <div class="mod-login-col1 clearfix"> <?php if ( $check_capt ) { ?> <div class="alert alert-danger" role="alert"><?php echo $check_capt ?></div> <?php } ?> <div class="mod-input mod-login-input-email mod-input-id"> <label>Tên đăng nhập</label> <input type="text" placeholder="Vui lòng nhập tên tài khoản" name="username" id="username" value="<?php echo ($_POST['username'])? trim($_POST['username']) : '' ?>" required /> <b></b> <span></span> </div> <div class="mod-input mod-input-password mod-login-input-password mod-input-password"> <label>Mật khẩu</label> <input type="password" name="pwd1" id="pwd1" placeholder="<?php _e('Mật khẩu','hrm'); ?>" value="<?php echo ($_POST['pwd1'])? trim($_POST['pwd1']) : '' ?>" required /> <b></b> <span></span> </div> <div class="mod-input mod-input-password mod-login-input-re-password mod-input-re-password"> <label>Nhập lại mật khẩu</label> <input type="password" name="pwd2" id="pwd2" placeholder="<?php _e('Nhập lại mật khẩu','hrm'); ?>" value="<?php echo ($_POST['pwd2'])? trim($_POST['pwd2']) : '' ?>" required /> <b></b> <span></span> <div class="mod-input-password-icon"></div> </div> <!---div class="mod-input mod-input-captcha"> <label--><!---?php echo $math; ?> = ?</label> <input id="captcha" name="answer" type="number" /> </div---> </div> <div class="mod-login-col2 clearfix"> <?php wp_nonce_field( 'post_nonce', 'post_nonce_field' ); ?> <div class="mod-input mod-login-input-email mod-input-email"> <label>Địa chỉ email</label> <input type="email" name="email" id="email" placeholder="Email" value="<?php echo ($_POST['email'])? trim($_POST['email']) : '' ?>" required /> <b></b> <span></span> </div> <div class="mod-login-btn"> <button type="submit" class="next-btn next-btn-primary next-btn-large">ĐĂNG KÍ</button> <input type="hidden" name="task" value="register" /> </div> </div> </form> </div> </div> </div> <script> var password = document.getElementById("pwd1"), confirm_password = document.getElementById("pwd2"); function validatePassword(){ if(password.value != confirm_password.value) { confirm_password.setCustomValidity("Mật khẩu không trùng khớp"); } else { confirm_password.setCustomValidity(''); } } password.onchange = validatePassword; confirm_password.onkeyup = validatePassword; </script> <?php } |
Sau khi thao tác xong ta vào trang tạo trang tên Thành Viên
bỏ 2 short vào nhé
Ok xong rồi nhé
ah còn chút css nữa là đẹp liền
|
1 2 3 4 5 6 7 8 |
/*trang đang nhặp*/ .entry-content { display: flex; } .login { width: 49%; padding: 10px; } |
Xem kết quả và thử luôn chức năng nhé 🙂
Chúc bạn thành công !
Mình mới test xong, vẫn dùng ok mà bạn nhi
Khi mình add short nó báo lỗi Json không hợp lệ.
A ơi sao e dùng cái code CSS cho nút nó đẹp mà chỉ có trang đăng nhập có thôi ạ
trang đăng nhập và dăng ký là 2 short khác nhau mà