publikacja: 5 października 2009, 10:40; autor: Szymon Skulimowski http://wpninja.pl/formularz-logowania-z-wlasnym-logo/

Formularz logowania z własnym logo

Tworząc komercyjną stronę opartą o WordPress często zachodzi potrzeba podmiany logo, które znajduje się na stronie logowania / rejestracji. Chciałbym się z Wami podzielić sposobem na uzyskanie takiego efektu, który jest prosty, „bez-wtyczkowy” i odporny na aktualizacje.

Standardowy formularz logowania / rejestracji

Dla przypomnienia – standardowy formularz logowania wygląda następująco:

WordPress - standardowy formularz logowania

Naszym zadaniem jest podmiana WP-owego logo na nasze w taki sposób aby:

nie obciążać WordPressa niepotrzebnymi wtyczkami,
nie trzeba było aktualizować odpowiednich plików po każdej aktualizacji skryptu,
zbytnio się nie namęczyć :-).

Krok 1: Przygotowanie pliku graficznego:

Nowe logo powinno mieć wymiary pokrywające się ze starym czyli maksymalnie 310×70 pikseli. Nic nie stoi na przeszkodzie jednak abyśmy dali obrazek o mniejszych rozmiarach ponieważ zostanie od automatycznie wycentrowany.

Przygotowany plik wgrywamy na serwer do katalogu z używanym szablonem graficznym. Załóżmy, że nazwiemy go „login-logo.gif”.

Krok 2: Tworzymy plik CSS:

Tworzymy plik login.css i umieszczamy go w katalogu szablonu graficznego. W treści natomiast wpisujemy:

h1 a {
background: url(login-logo.gif) no-repeat top center;
}

Plik posłuży nam do podmiany standardowego logo na nowe.

Krok 3: Dodajemy trochę magii:

Otwieramy plik functions.php (katalog z używanym szablonem graficznym) i uzupełniamy go o poniższy kawałek kodu:

function new_login() {
echo '<link rel="stylesheet" type="text/css" href="' . get_option('siteurl') .'/wp-content/themes/'. get_option('template') .'/login.css" />'."\n";
}
 
add_action('login_head', 'new_login');

Dzięki niemu na stronach logowania i rejestracji wczytany zostanie dodatkowy plik CSS, który utworzyliśmy w poprzednim kroku.

Krok bonusowy: Podmieniamy adres odnośnika:

W komentarzach daliście znać, że interesowałaby Was również opcja podmiana adresu odnośnika. Aby to zrobić trzeba dopisać dodatkowo do pliku functions.php poniższy kod:

function new_login_headerurl($url) {
return get_bloginfo('siteurl');
}
 
add_filter("login_headerurl","new_login_headerurl");
 
function new_login_headertitle($message) {
return get_bloginfo('name');
}
 
add_filter("login_headertitle","new_login_headertitle");

Prawda, że nie było trudne? Odważne osoby, które nie boją się zaprezentować efektów swojej pracy zapraszam do komentarzy :-).

Podobał się artykuł? Dołącz do grona stałych czytelników bloga.

Komentarze (23)

Kapsel (5 października 2009, 13:15) #:
Ja wiem, czego tu się bać ;) witryna i tak raczej dla zamkniętej grupy stworzona więc mi nie żal pokazać: http://55ddw.org
Kapsel (5 października 2009, 13:18) #:
łech, łech, z rozpędu zapodałem główną a nie panel logowania: http://55ddw.org/wp-login.php (jakby się adminowi chciało, można adres podmienić ;)
Madzia (5 października 2009, 13:33) #:
Szkoda tylko Kaspel, że został jeszcze alt i link do wordpressa.
Lemony. (5 października 2009, 19:33) #:
A propos. Jak to można zmienić?
Nomex (5 października 2009, 23:34) #:
Ja taką możliwość wykorzystuje już od dawna chodź wystarczyło podmienić oryginalne logo WordPressa na nasze: http://historialomzy.pl/wp-login.php
Jeżeli chcesz zmienić link i alt zedytuj plik wp-login.php
```
<h1><a href="<?php echo apply_filters('login_headerurl', 'http://wordpress.org/'); ?>" title="<?php echo apply_filters('login_headertitle', __('Powered by WordPress')); ?>"><?php bloginfo('name'); ?></a></h1>
```
wpisując oczywiście swój adres i nazwę serwisu
Nomex (5 października 2009, 23:35) #:
Widzę, że coś tu opcja kodu nie działa, prosiłbym o edycję i poprawienie…
palmiak (6 października 2009, 2:16) #:
@nomex
Twoja metoda ma jedną drobną wadą – w momencie update’a trzeba się pilnować, żeby obrazka od logo nie podmieniać – co na dłuższą metę jest upierdliwe.
Szymon Skulimowski (6 października 2009, 7:37) #:
Szkoda tylko Kaspel, że został jeszcze alt i link do wordpressa.

A propos. Jak to można zmienić?

Na życzenie uzupełniłem artykuł o taki bajer (krok bonusowy) :-).
SpeX (6 października 2009, 12:10) #:
W sprawie uzupełnienie.
Czy znasz jakiś sposób by sytuacjach takich jak ta, gdy gość znacznie modyfikujesz wpis, wymusić ponowne opublikowane go na RSSie?
Kapsel (7 października 2009, 10:29) #:
Zauważyłem tą niekonsekwencję alta i linka… ale nie miałem czasu się bliżej przyjrzeć (pewnie bym sam i tak nie naprawił), a tu wracam na bloga i już jest rozwiązanie :) fajnie, fajnie!
zonk (7 października 2009, 18:07) #:
a tu tak … lubie tą stronę http://www.polandbowling.eu/wp-login.php
Lemony. (9 października 2009, 14:25) #:
Czy da się zrobić 3 kolumny z dwóch? Magicznym sposobem?
Marian (13 października 2009, 8:53) #:
Witam,

poza tematem, ale co tam: spotkał się ktoś z takim problemem, że WP w RSS-a wrzuca wypis (excerpt) zamiast treści posta mimo, że zaznaczona jest opcja „W kanałach nowości wyświetlaj: całą treść”? Na innym blogu (też 2.8.4) nie mam tego problemu i staram się zlokalizować przyczynę.

Pozdrawiam.
Marian (16 października 2009, 9:26) #:
No tak… To wina Firefoxa. Jak feed miał postać domyślną, to Fx czytał tylko excerpty, jak zostało puszczone przez Feedburbera – nie ma problemu…

Pozdrawiam.
Marches (16 października 2009, 10:39) #:
Ciekawy art, skorzystałem choć pod operą jakoś dziwnie mi się wyświetla.
marsjaninzmarsa (22 października 2009, 23:09) #:
Fajny sposób, nie wiedziałem, że system szablonów wp jest aż tak elastyczny… :)
I przy okazji podczepiam się pod pytanie @SpeX‚a – też chciałem kiedyś uzyskać ten efekt… ;)
gawa (27 października 2009, 16:07) #:
A skoro jesteśmy przy temacie logowania…
To małe pytanko… lekko obok… ;-)
Jest taki typ stron w moim przypadku chodzi o stronę statyczną – prywatne- czy nie wiecie Drodzy WordPress-owicze czy da się i ewentualnie jak zrobić taką „ukrytą” czyli prywatną stronę niewidoczną dla wszystkich – by w momencie logowania konkretnego Usera dodawała się do innych widocznych dla wszystkich stron na stronie? Czyli innymi słowy żeby po zalogowaniu były widoczne strony dla wszystkich + strona(y) dla konkretnego Usera .
Robb (28 października 2009, 19:39) #:
@gawa: czytałem kiedyś o takim pluginie … ale gdzie i kiedy … ? hmmmm
Marsel (31 października 2009, 14:41) #:
A ja zrobiłem tak:
http://marsel.webbo.pl/wp-login.php
marsjaninzmarsa (3 listopada 2009, 23:12) #:
@Marsel: Nie ma co, naprawdę ładna… Jestem pod wrażeniem… :D
gawa (7 listopada 2009, 19:08) #:
@Robb: a może sobie przypomnisz ? szukałem, googlowałem i jakoś nie mogę trafić… kurde… bez problemu robię to w prostym CMSimple … a w moim ulubinym WP – nie mogę… a może jeszcze Ktoś ma jakieś propozycje … ?
grochu (10 listopada 2009, 20:02) #:
Ja zrobiłem tak: http://grochu.eu/wp-login.php No i wybrałem plik .png a nie .gif
:)
BeautyIcon (14 listopada 2009, 19:28) #:
Ciekawy bajer :-)