Jak dostosować stronę logowania WordPress

Dlaczego potrzebujesz dostosowanej strony logowania do WordPressa?

• Twoi użytkownicy zarejestrują się i zalogują przy użyciu domyślnego ekranu logowania WordPress, ponieważ WordPress nie zapewnia żadnych wbudowanych opcji dodawania własnego logo lub zmiany ogólnego wyglądu i stylu, aby pasował do dowolnego niestandardowego motywu lub marki, którą masz w swojej witrynie.

• Może to działać dobrze w przypadku małych witryn internetowych. Jeśli jednak prowadzisz witrynę biznesową lub aktywną społeczność online, możesz zamiast WordPressa pokazać własną markę.

Oto dwa sposoby, przez które możesz przejść:

W przypadku jakichkolwiek pytań możesz skontaktować się z ekspertami z popularnej firmy WordPress Development Company z USA .

Kontynuujmy czytanie poniższych rozwiązań!

1. Użyj istniejącego układu WordPress.

• Właściwie łatwo jest dostosować istniejący.
• Jeśli jest to tylko zmiana logo lub nadanie mu zupełnie innego układu, miejscem do rozpoczęcia jest akcja login_enqueue_scripts.
• W tym miejscu możesz podjąć decyzję o wyprowadzeniu zwykłego, prostego fragmentu CSS lub podać link do pełnego pliku CSS. Możesz także ustawić w kolejce dowolny JavaScript, którego chcesz użyć.
• W function.php

 add_action('login_head', 'my_custom_login');
funkcja my_custom_login() {
echo '<link rel="stylesheet" type="text/css" href="' .get_bloginfo('stylesheet_directory') . '/your_login_styles.css" />';}

• your_login_styles.css to nazwa pliku css, który jest tworzony w celu dostosowania strony logowania.
• Należy tutaj zachować ostrożność, upewnić się, że używasz bardzo specyficznych selektorów, aby upewnić się, że nadpisujesz styl podstawowy.
• Logo domyślnie odsyła każdego do adresu: wordpress.org. Można to zmienić na adres URL witryny za pomocą poniższego kodu w pliku functions.php:

 add_filter( 'login_headerurl', 'my_login_logo_url' );
funkcja my_login_logo_url() {
return get_bloginfo( 'url' );
}
add_filter( 'login_headertitle', 'my_login_logo_url_title' );
funkcja my_login_logo_url_title() {
return 'Nazwa i informacje o Twojej witrynie';}

Najwygodniejszym sposobem zmiany komunikatu o błędzie jest użycie poniższego kodu w pliku functions.php :

 add_filter('login_errors', 'login_error_override');
funkcja login_error_override()
{
return 'Nieprawidłowe dane logowania.';
}

Powiązane : WordPress a Adobe Business Catalyst : Który system CMS jest najlepszy do tworzenia?

2. Utwórz nowy układ.

• Na początek należy utworzyć niestandardowy szablon strony dla strony logowania.
• W tym celu możesz utworzyć nowy szablon strony i nadać mu nazwę. np.: strona-logowanie.php.
• Następnie utwórz nową stronę od administratora WP. Skonfiguruj permalink, aby się zalogować. W ten sposób WordPress domyślnie przyjmie szablon page-login.php dla tej strony.
• Zachowaj tag wp_login_form w szablonie strony page-login.php, aby wyświetlić formularz logowania

Globalna agencja rozwiązań informatycznych oferująca świeże, kreatywne usługi cyfrowe dla firm, które chcą rozwijać się w Internecie. Koncentrując się na wynikach, wykorzystujemy nasze umiejętności techniczne i wiedzę branżową, aby pomóc Ci osiągnąć Twoje cyfrowe cele. Niezależnie od tego, czy chodzi o obniżenie współczynnika odrzuceń za pomocą interaktywnego projektowania stron internetowych, czy wprowadzenie zupełnie nowego ruchu i strumieni dochodów do Twojej witryny. <a href=”www.elsner.com/contact-us”>Porozmawiaj z nami</a> o swoim projekcie, aby rozpocząć…

  </p>
</div>
<div class="formularz-logowania">
<?php
$argumenty = tablica(
'przekieruj' => home_url(),
'id_username' => 'użytkownik',
'id_password' => 'pass',
);
?>
<?php wp_login_form( $args ); ?>
</div>

• Można wykonać CSS zgodnie z Twoimi osobistymi wymaganiami. Strona logowania już działa.
• Możemy spróbować się zalogować, jeśli się powiedzie, zostaniemy przekierowani na adres podany w powyższym parametrze przekierowania. Jest jednak coś, czym należy się zająć.

 add_action('init','redirect_login_page'); 

funkcja redirect_login_page() {
$login_page = home_url( '/login/' );
$page_viewed = nazwa podstawowa($_SERVER['REQUEST_URI']);
if ( $page_viewed == "wp-login.php" && $_SERVER['REQUEST_METHOD'] == 'GET')
{
    wp_redirect ($login_page);
    Wyjście;
}
}

– Strona logowania może działać zgodnie z oczekiwaniami po zalogowaniu. W przypadku wystąpienia błędu, np. przy podaniu nieprawidłowej kombinacji identyfikatora i hasła lub wpisaniu pustych spacji, zostaniemy przekierowani do wp-login.php. Aby rozwiązać ten problem, możesz dodać następującą funkcję do pliku functions.php:

 add_action( 'wp_login_failed', 'login_failed' );

funkcja login_failed() {
$login_page = home_url( '/login/' );
wp_redirect ( $login_page . '?login=failed' );
Wyjście;
}

 add_filter( 'uwierzytelnij', 'weryfikuj_hasło_użytkownika', 1, 3);

function Verify_username_password( $user, $username, $password ) {
$login_page = home_url( '/login/' );
if( $username == "" || $password == "" ) {
wp_redirect( $login_page . "?login=pusty" );
Wyjście;
}
}

– Ostateczny problem polega na tym, że zostaniemy przekierowani do wp-login.php, gdy wylogujemy się z serwisu. Dlatego też musimy określić adres przekierowujący również po wylogowaniu.

 add_action('wp_logout','logout_page');
funkcja logout_page() {
$login_page = home_url( '/login/' );
wp_redirect( $login_page . "?login=false" );
Wyjście;
}

• Istnieje wiele rzeczy, które można zrobić, aby ulepszyć stronę logowania, takich jak dodanie linku do utraconego hasła, linku do rejestracji, a nawet spersonalizowanego komunikatu o błędzie. Jednak w tym momencie działa wystarczająco dobrze, aby użytkownicy mogli się logować i wylogowywać. To może być świetny początek stworzenia bardziej zaawansowanej strony logowania.

Więc tak! To jest to.
Dzięki kilku prostym poprawkom możesz wygodnie spersonalizować swoją stronę logowania, aby pasowała do wyglądu i stylu Twojej witryny.

Wielu projektantów motywów powstrzymuje się od stylizowania strony logowania, ponieważ uważają ją za niepotrzebną, zwłaszcza gdy nie ma jej w konfiguracji motywu WordPress.

Jednak, gdy tworzysz witrynę klienta, zaniedbując styl – a znacznie markę – strona logowania może okazać się straconą szansą, która może zepsuć wrażenia użytkownika, gdy istnieje niestandardowy motyw.

Kolejna okazja do brandowania Twojej witryny, która również pozostawia niezatarte wrażenie w umyśle użytkownika.