Trick # 614 | Dieser Beitrag beinhaltet 0 Wörter. – Geschätzte Lesezeit: ca. 0 Minuten.
Arbeiten Sie auf Ihrer WordPress-Seite mit einem Bereich, der nur für eingeloggte User sichtbar ist? Dann wäre es nett, diesen Usern auch eine Abmelde-Möglichkeit zur Verfügung zu stellen. Geht ganz einfach – mit einem Butto, der erst noch nur dann erscheint, wenn ein User wirklich auch eingeloggt ist.
Der Code ist zweiteilig. Zunächst hier der PHP-Code, den Sie in die Datein functions.php Ihrer WordPress-Installation integrieren können. Unter Design/Theme-Datei-Editor:
// Shortcode für den Abmelde-Button
function custom_logout_button_shortcode() {
// Nur anzeigen, wenn der Benutzer eingeloggt ist
if (is_user_logged_in()) {
// Generiere die Logout-URL
$logout_url = wp_nonce_url(home_url('wp-login.php?action=logout'), 'log-out');
// HTML für den Button
return '<a href="' . esc_url($logout_url) . '" class="logout-button">Abmelden</a>';
}
return ''; // Nichts anzeigen, wenn der Benutzer nicht eingeloggt ist
}
add_shortcode('logout_button', 'custom_logout_button_shortcode');// Redirect nach dem Logout
function custom_logout_redirect() {
wp_redirect(home_url()); // Weiterleitung zur Startseite
exit;
}
add_action('wp_logout', 'custom_logout_redirect');
Damit wäre der eigentliche Button schon mal programmiert.
Es folgt nun noch ein Block CSS-Code, diesen kopieren Sie in das CSS-Stylesheet (unter Design/Customizer/Zusätzliches CSS):
.logout-button {
display: inline-block;
padding: 10px 20px;
background-color: #ff4b5c;
color: #fff;
text-decoration: none;
font-size: 16px;
border-radius: 5px;
transition: background-color 0.3s ease;
text-align: center;
}.logout-button:hover {
background-color: #e43e4d;
color: #fff;
}
Das war's.
Zur Verwendung:
- Fügen Sie den Shortcode
[logout_button]an beliebiger Stelle auf Ihrer Website ein; z. B. in einem Widget, einer Seite oder in einem Beitrag. - Der Button erscheint an ebendieser Stelle, solange ein User tatsächlich auch eingeloggt ist. Ohne Login wird der Button ausgeblendet.
- Die Abmeldung erfolgt sofort – also ohne weitere Rückfrage. Der/die BesucherIn wird auf die Startseite der Website weitergeleitet.
Den CSS-Code können Sie natürlich beliebig anpassen. Nach obigem Muster sieht der Button so aus:
Werbung
Werbung
