Walau bagaimanapun, jika anda berada di pagar atau secara keseluruhan kecewa dengan apa yang tersedia secara percuma di repositori plugin WordPress, anda boleh mengangkat semangat anda kerana anda boleh belajar bagaimana untuk membuat log masuk WordPress dan widget pendaftaran secara percuma! Anda hanya perlu mengorbankan tempoh masa anda untuk memahami keseluruhan proses. Sebaik sahaja anda memperoleh pengetahuan yang cukup mudah; Anda harus mempunyai halaman pendaftaran yang kaya di laman web wordpress anda.
Dalam artikel ini, kami akan membina widget borang log masuk dan pendaftaran yang mudah dengan kesan membalikkan yang dimungkinkan oleh Perpustakaan QuickFlip JQuery.
Jika anda ingin melompat di hadapan tutorial, anda boleh melihat demo
login dan widget pendaftarandan muat turun plugin widget.
Untuk memastikan perkara mudah, borang pendaftaran akan terdiri daripada nama pengguna, kata laluan dan medan e -mel. Borang log masuk tidak akan mengandungi captcha. Tanpa kekalahan lagi, mari kita mulakan dengan pembangunan widget.
Pertama, sertakan tajuk plugin.
<span><span><?php </span></span><span><span>/* </span></span><span><span>Plugin Name: Tabbed Login Registration Widget </span></span><span><span>Plugin URI: https://www.sitepoint.com </span></span><span><span>Description: A tabbed login and registration widget for WordPress </span></span><span><span>Version: 1.0 </span></span><span><span>Author: Agbonghama Collins </span></span><span><span>Author URI: http://w3guy.com </span></span><span><span>License: GPL2 </span></span><span><span>*/</span></span>
Sebelum kita memasuki perkembangan widget dengan betul, kita perlu menghidupkan buffer output untuk mengelakkan sebarang amaran: Tidak dapat mengubah suai maklumat header - Headers sudah dihantar ralat.
<span>// Turn on output buffering </span><span>ob_start();</span>
Untuk membuat widget WordPress, lanjutkan kelas WP_WIDGET standard, termasuk kaedah yang diperlukan dan akhirnya, daftar widget.
Buat kelas kanak-kanak memanjangkan kelas WP_WIDGET.
<span>class Tab_Login_Registration extends WP_Widget {</span>harta statik $ login_registration_status akan menyimpan mesej pendaftaran dan log masuk yang dihasilkan mesej ralat.
<span>static private $login_registration_status;</span>
Beri widget nama dan keterangan menggunakan kaedah sihir __construct ().
<span>/**
</span><span> * Register widget with WordPress.
</span><span> */
</span> <span>function __construct() {
</span> <span><span>parent::</span>__construct(
</span> <span>'tab_login_registration', // Base ID
</span> <span>__( 'Tabbed Login Registration Widget', 'text_domain' ), // Name
</span> <span>array( 'description' => __( 'A tabbed login and registration widget for WordPress', 'text_domain' ), ) // Args
</span> <span>);
</span> <span>}</span>Dua kaedah - login_form () dan pendaftaran_form () - yang mengembalikan kod HTML untuk borang log masuk dan pendaftaran akan dibuat untuk digunakan semula kemudian.
<span>/**
</span><span> * Returns the HTML for the login form
</span><span> * <span>@return <span>string</span>
</span></span><span> */
</span> <span>static function login_form() {
</span> <span>$html = '<form method="post" action="' . esc_url( $_SERVER['REQUEST_URI'] ) . '">';
</span> <span>$html .= '<input type="text" name="login_username" placeholder="Username" /><br/>';
</span> <span>$html .= '<input type="password" name="login_password" placeholder="Password" /><br/>';
</span> <span>$html .= '<input type="checkbox" name="remember_login" value="true" checked="checked"/> Remember Me<br/>';
</span> <span>$html .= '<input type="submit" name="login_submit" value="Login" /><br/>';
</span> <span>$html .= '</form>';
</span>
<span>return $html;
</span>
<span>}</span><span>/**
</span><span> * Returns the HTML code for the registration form
</span><span> * <span>@return <span>string</span>
</span></span><span> */
</span> <span>static function registration_form() {
</span> <span>$html = '<form method="post" action="' . esc_url( $_SERVER['REQUEST_URI'] ) . '">';
</span> <span>$html .= '<input type="text" name="registration_username" placeholder="Username" /><br/>';
</span> <span>$html .= '<input type="password" name="registration_password" placeholder="Password" /><br/>';
</span> <span>$html .= '<input type="email" name="registration_email" placeholder="Email" /><br/>';
</span> <span>$html .= '<input type="submit" name="reg_submit" value="Sign Up" /><br/>';
</span> <span>$html .= '</form>';
</span>
<span>return $html;
</span> <span>}</span>register_user () di bawah mengendalikan pendaftaran pengguna baru.
<span>/**
</span><span> * Register new users
</span><span> */
</span> <span>function register_user() {
</span>
<span>if ( isset( $_POST['reg_submit'] ) ) {
</span>
<span>$username = esc_attr( $_POST['registration_username'] );
</span> <span>$password = esc_attr( $_POST['registration_password'] );
</span> <span>$email = esc_attr( $_POST['registration_email'] );
</span>
<span>$register_user = wp_create_user( $username, $password, $email );
</span>
<span>if ( $register_user && ! is_wp_error( $register_user ) ) {
</span>
<span><span>self::</span>$login_registration_status = 'Registration completed.';
</span> <span>} elseif ( is_wp_error( $register_user ) ) {
</span> <span><span>self::</span>$login_registration_status = $register_user->get_error_message();
</span> <span>}
</span>
<span>}
</span> <span>}</span>Inilah cara kaedah mendaftarkan pengguna baru.
Pertama, kami pastikan pengguna sebenarnya mendaftarkan akaun. Ini dilakukan dengan mengesan bahawa butang 'Daftar' telah diklik i.e. $ _POST ['REG_SUBMIT'] telah ditetapkan.
Data borang kemudiannya melarikan diri untuk atribut HTML menggunakan fungsi ESC_ATTR.
Nama pengguna, kata laluan dan e -mel yang dimasukkan oleh pengguna kemudiannya diserahkan kepada fungsi WP_Create_user () untuk memasukkan pengguna baru ke dalam pangkalan data WordPress.
Jika semuanya berjalan lancar, harta $ login_registration_status akan ditetapkan ke pendaftaran teks yang diselesaikan jika tidak, ralat yang dikembalikan oleh wp_create_user () akan menjadi nilai.
Apabila borang log masuk diserahkan, fungsi login_user () di bawah menandatangani pengguna.
<span>/**
</span><span> * Login registered users
</span><span> */
</span> <span>function login_user() {
</span> <span>if ( isset( $_POST['login_submit'] ) ) {
</span>
<span>$creds = array();
</span> <span>$creds['user_login'] = esc_attr( $_POST['login_username'] );
</span> <span>$creds['user_password'] = esc_attr( $_POST['login_password'] );
</span> <span>$creds['remember'] = esc_attr( $_POST['remember_login'] );
</span>
<span>$login_user = wp_signon( $creds, false );
</span>
<span>if ( ! is_wp_error( $login_user ) ) {
</span> <span>wp_redirect( home_url( 'wp-admin' ) );
</span> <span>} elseif ( is_wp_error( $login_user ) ) {
</span> <span><span>self::</span>$login_registration_status = $login_user->get_error_message();
</span> <span>}
</span> <span>}
</span> <span>}</span>Sama seperti daftar_user yang disebutkan di atas (), pertama -tama kami memastikan pengguna cuba log masuk dengan memeriksa jika $ _post ['login_submit'] telah ditetapkan.
array yang berkaitan $ kredit kelayakan log masuk yang dimasukkan oleh pengguna dibuat.
array bersekutu kemudian diserahkan kepada wp_signon untuk pengesahan.
Jika kelayakan dianggap sah dan oleh wp_signon, pengguna akan diarahkan ke papan pemuka WordPress oleh wp_redirect sebaliknya harta $ login_registration_status ditetapkan ke kesilapan yang dihasilkan.
Borang tetapan widget back-end dicipta oleh kaedah () yang akan terdiri daripada medan yang akan mengandungi tajuk widget.
public function form( $instance ) {
if ( isset( $instance['title'] ) ) {
$title = $instance['title'];
} else {
$title = __( 'Login / Registration', 'text_domain' );
}
?>
<span><span><span><p</span>></span>
</span> <span><span><span><label</span> for<span>="<span><?php echo $this->get_field_id( 'title' ); ?></span>"</span>></span><span><?php _e( 'Title:' ); ?></span><span><span></label</span>></span>
</span> <span><span><span><input</span> class<span>="widefat"</span> id<span>="<span><?php echo $this->get_field_id( 'title' ); ?></span>"</span>
</span></span><span> <span>name<span>="<span><?php echo $this->get_field_name( 'title' ); ?></span>"</span> type<span>="text"</span>
</span></span><span> <span>value<span>="<span><?php echo esc_attr( $title ); ?></span>"</span>></span>
</span> <span><span><span></p</span>></span>
</span> <span><span><?php
</span></span><span> <span>}</span></span>
kaedah widget () memaparkan borang log masuk dan pendaftaran tab di bahagian depan WordPress.
<span>public function update( $new_instance, $old_instance ) {
</span> <span>$instance = array();
</span> <span>$instance['title'] = ( ! empty( $new_instance['title'] ) ) ? strip_tags( $new_instance['title'] ) : '';
</span>
<span>return $instance;
</span> <span>}</span><span><span><?php </span></span><span><span>/* </span></span><span><span>Plugin Name: Tabbed Login Registration Widget </span></span><span><span>Plugin URI: https://www.sitepoint.com </span></span><span><span>Description: A tabbed login and registration widget for WordPress </span></span><span><span>Version: 1.0 </span></span><span><span>Author: Agbonghama Collins </span></span><span><span>Author URI: http://w3guy.com </span></span><span><span>License: GPL2 </span></span><span><span>*/</span></span>
Kod Penjelasan: Kod JavaScript menambah tabbing dan membalikkan kesan ke widget.
login_user () dan register_user () dimasukkan untuk menandatangani pengguna berdaftar atau mendaftarkan pengguna baru.
login_form () dan pendaftaran_form () kaedah statik dipanggil untuk memaparkan borang log masuk dan pendaftaran.
Akhirnya, kami menutup kelas widget.
<span>// Turn on output buffering </span><span>ob_start();</span>
kelas widget tab_login_registration perlu didaftarkan menggunakan cangkuk widgets_init jadi ia diiktiraf oleh internal WordPress.
<span>class Tab_Login_Registration extends WP_Widget {</span>kita masih perlu memasukkan jQuery, widget CSS dan perpustakaan QuickFlip untuk mendapatkan tab dan membalikkan kesan dalam widget yang berfungsi.
jQuery, dan QuickFlip JavaScript serta CSS disertakan/enqueue ke tajuk WordPress oleh WP_ENQUEUE_STYLE dan WP_ENQUEUE_SCRIPT.
<span>static private $login_registration_status;</span>
kami selesai mengodkan log masuk dan widget pendaftaran.
di bawah adalah tangkapan skrin widget.
Lihat demo widget.
Untuk lebih memahami bagaimana widget dibina dan bagaimana melaksanakannya di laman WordPress anda, muat turun plugin widget, yang termasuk jQuery, QuickFlip, dan fail widget Stylesheet.
Jika anda mempunyai sebarang pertanyaan atau cadangan untuk penambahbaikan kod, beritahu saya dalam komen.
Apa yang perlu saya lakukan jika saya tidak dapat mengakses admin WordPress saya selepas menambah widget log masuk dan pendaftaran? T Akses Admin WordPress anda Setelah menambah widget log masuk dan pendaftaran, anda mungkin perlu melumpuhkan plugin yang menyebabkan masalah. Anda boleh melakukan ini dengan mengakses fail laman web anda melalui FTP dan menamakan semula folder plugin. Sebaik sahaja anda telah melakukan ini, cuba masuk semula. Jika anda masih menghadapi masalah, anda mungkin perlu menghubungi penyedia hosting anda atau mendapatkan bantuan daripada pakar WordPress.
Bagaimana saya dapat memastikan keselamatan widget log masuk dan pendaftaran WordPress saya? Pasti menggunakan kata laluan yang kuat dan unik dan simpan laman WordPress dan plugin anda terkini. Anda juga boleh menggunakan plugin keselamatan seperti Wordfence atau Sucuri untuk menambah lapisan perlindungan tambahan. Sidebar WordPress anda menggunakan widget. Terdapat beberapa plugin yang membolehkan anda melakukan ini, seperti pendaftaran pengguna & profil pengguna. Plugin ini menawarkan antara muka dan pilihan penyesuaian yang mudah digunakan.
Atas ialah kandungan terperinci Bina widget log masuk dan pendaftaran WordPress tab. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
Bagaimana untuk membuka kunci kata laluan pada telefon Apple anda jika anda terlupa
Bagaimana untuk menyelesaikan ranap ribut web
Apakah peralatan terminal?
Pengenalan kepada klasifikasi sistem linux
Apakah maksud topeng ps?
Cara menggunakan fungsi groupby
Cara menggunakan aspose
Penggunaan mengisytiharkan dalam Oracle
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
