Um dieses Problem zu lösen, haben einige Entwickler verschiedene Arten von Login- und Registrierungsseiten veröffentlicht, aber die Guten haben einen Preis und sie sind nicht billig.
Wenn Sie jedoch auf dem Zaun oder insgesamt enttäuscht waren, was kostenlos im WordPress -Plugin -Repository verfügbar ist, können Sie Ihren Geist anheben lassen, da Sie lernen können, wie Sie ein Registerkarten -WordPress -Login und Registrierungs -Widget kostenlos erstellen! Sie müssen nur eine kurze Zeit Ihrer Zeit opfern, um den gesamten Prozess zu verstehen. Sobald Sie das Wissen erwerben, was ziemlich einfach ist; Sie sollten eine feature -Rich -Registrierungsseite auf Ihren WordPress -Antriebseiten haben.
In diesem Artikel erstellen wir ein einfaches Registerkarte und Registrierungsformular Widget mit einem Flipperffekt, der durch die Quickflip JQuery -Bibliothek ermöglicht wird.
Wenn Sie vor dem Tutorial springen möchten, können Sie eine Demo des
-Login- und Registrierungs -Widgetsanzeigen und das Widget -Plugin herunterladen. Um die Dinge einfach zu halten, besteht das Registrierungsformular aus einem Benutzernamen, einem Passwort und einem E -Mail -Feld. Das Anmeldeformular enthält keine Captcha.
ohne weitere Aufregung beginnen wir mit der Widget -Entwicklung.
Fügen Sie zuerst den Plugin -Header hinzu.
<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>
Bevor wir in die Widget -Entwicklung ordnungsgemäß eintreten, müssen wir die Ausgangspufferung einschalten, um eine Warnung zu verhindern: Headerinformationen kann nicht geändert werden - Headers bereits gesendete Fehler.
<span>// Turn on output buffering </span><span>ob_start();</span>
Um ein WordPress -Widget zu erstellen, die Standard -WP_WIDGE -Klasse zu erweitern, die erforderlichen Methoden einzuschließen und schließlich das Widget zu registrieren.
Erstellen Sie eine untergeordnete Klasse, die die WP_WIDget-Klasse erweitert.
<span>class Tab_Login_Registration extends WP_Widget {</span>Die statische Eigenschaft $ login_registration_Status speichert die Registrierung und das Anmeldeformular generierte Fehlermeldungen.
<span>static private $login_registration_status;</span>
Geben Sie dem Widget einen Namen und eine Beschreibung mit der __construct () magischen Methode an.
<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>Zwei Methoden - login_form () und Registration_form () -, die den HTML -Code für das Anmelde- und Registrierungsformular zurückgeben, wird später für die Wiederverwendung erstellt.
<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>Die unten stehende Register_User () übernimmt die Registrierung eines neuen Benutzers.
<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>So registriert die Methode einen neuen Benutzer.
Erstens stellen wir sicher, dass der Benutzer tatsächlich ein Konto registriert. Dies geschieht durch Erkennen, dass die Schaltfläche "Anmeldung" geklickt wurde, d. H. $ _post ['reg_submit'] festgelegt wurde.
Die Formulardaten werden dann für HTML -Attribute mit der Funktion ESC_ATTTR entkommen.
Der vom Benutzer eingegebene Benutzername, Kennwort und E -Mail werden dann an WP_CREATE_USER () -Funktion übergeben, um den neuen Benutzer in die WordPress -Datenbank einzufügen.
Wenn alles gut geht, wird die Eigenschaft $ login_registration_Status auf die Textregistrierung festgelegt, anstatt dass der von WP_Create_USER () zurückgegebene Fehler der Wert ist.
Wenn das Anmeldeformular eingereicht wird, melden sich die Funktion login_user () unten im Benutzer an.
<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>Erlauben Sie mir zu erklären, wie login_user () sich in den Benutzern bei WordPress anmelden.
Ähnlich wie beim oben genannten Register_User () stellen wir zunächst sicher, dass der Benutzer versucht, sich anzumelden, indem $ _post ['login_submit'] festgelegt wurde.
Ein zugeordnetes Array $ Creds der vom Benutzer eingegebenen Anmeldeinformationen wird erstellt.
Das assoziative Array wird dann zur Authentifizierung an wp_signon übergeben.
Wenn der Anmeldeinformator als gültig erachtet wird und von WP_Signon von WP_REDIRECT ansonsten ansonsten in das WordPress -Dashboard umgeleitet wird, wird $ login_registration_status auf den angemeldeten Fehler festgelegt.
.Das Back-End-Widget-Einstellungsformular wird von der Form () () erstellt, die aus einem Feld besteht, das den Titel des Widgets enthält.
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>
Wenn der Widget -Titel in das Feld Formular eingegeben wird, sankt die Methode update () die Daten zur Wiederverwendung in der Datenbank.
<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>Die Widget () -Methode zeigt das Registerkartenanmelde- und Registrierungsformular im Front-End von WordPress an.
<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>
Code Erläuterung: Der JavaScript -Code fügen Sie dem Widget den Tabbing und den Flipping -Effekt hinzu.
Die Login_user () und Register_User () sind enthalten, um jeweils in einem registrierten Benutzer zu unterscheiden oder einen neuen Benutzer zu registrieren.
Die statischen Methoden login_form () und Registrierung_form () werden aufgerufen, um das Anmelde- und Registrierungsformular anzuzeigen.
Schließlich schließen wir die Widget -Klasse.
<span>// Turn on output buffering </span><span>ob_start();</span>
Die Widget -Klasse tab_login_registration muss mit dem Widgets_init -Hook registriert werden, damit sie von WordPress -Interna erkannt wird.
<span>class Tab_Login_Registration extends WP_Widget {</span>Wir müssen immer noch JQuery, das Widget CSS und die Quickflip -Bibliothek einbeziehen, um den Registerkarte und den Umdrehungseffekt im Widget zu erhalten.
Die JQuery und Quickflip JavaScript sowie das CSS sind von wp_enqueue_style und wp_enqueue_script in den Header von WordPress enthalten.
<span>static private $login_registration_status;</span>
Wir sind fertig damit, das Login- und Registrierungs -Widget zu codieren.
unten finden Sie einen Screenshot des Widgets.
eine Demo des Widgets anzeigen
Um weiter zu verstehen, wie das Widget erstellt wurde und wie Sie es auf Ihrer WordPress -Site implementieren, laden Sie das Widget -Plugin herunter, das die JQuery-, Quickflip- und die Widget -Stylesheet -Dateien enthält.
Wenn Sie Fragen oder Vorschläge zur Verbesserung der Code haben, lassen Sie es mich in den Kommentaren wissen.
Kann ich meiner WordPress -Seitenleiste ein Registrierungsformular hinzufügen? Ihre WordPress -Seitenleiste mit einem Widget. Es stehen mehrere Plugins zur Verfügung, mit denen Sie dies tun können, z. B. Benutzerregistrierung und Benutzerprofil. Diese Plugins bieten benutzerfreundliche Schnittstellen und Anpassungsoptionen. Versuchen Sie, das Plugin zu deaktivieren und zu reaktivieren. Wenn dies das Problem nicht löst, kann dies ein Konflikt mit einem anderen Plugin oder Ihrem Thema sein. Versuchen Sie, andere Plugins einzeln zu deaktivieren, um festzustellen, ob das Problem behoben ist. Wenn nicht, müssen Sie sich möglicherweise an die Unterstützung des Plugins wenden oder Hilfe von einem WordPress -Experten suchen. Soziale Login -Optionen für Ihr WordPress -Login- und Registrierungs -Widget. Es stehen mehrere Plugins zur Verfügung, mit denen Sie dies tun können, z. B. Nextend Social Login und WP Social Login. Mit diesen Plugins können Benutzer sich registrieren und sich mit ihren Social -Media -Konten anmelden, wodurch der Prozess schneller und einfacher wird.
Das obige ist der detaillierte Inhalt vonErstellen Sie ein Registerkarten -WordPress -Login und ein Registrierungs -Widget. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
So entsperren Sie die Passwortsperre auf Ihrem Apple-Telefon, wenn Sie sie vergessen
So beheben Sie einen Webstorm-Absturz
Was sind Endgeräte?
Einführung in die Klassifizierung von Linux-Systemen
Was bedeutet PS-Maske?
So verwenden Sie die Groupby-Funktion
So verwenden Sie aspose
Die Verwendung von „declare' in Oracle
![[Web-Frontend] Node.js-Schnellstart](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
