Prezentări de pluginuri / Tutoriale Wordpress

Modificarea interfeței de logare a WordPress-ului: BM Custom Login

BM Custom Login este un plugin ușor de folosit ce permite personalizarea interfeței formularului de autentificare în adminul WordPress-ului.

De multe ori, după ce ai muncit la o temă frumoasă cu un design personalizat, constați că la autentificare te întâmpină acceași interfață implicită ruptă de designul site-ului. Acest plugin permite personalizarea autentificării ca o tușă finală spre încântarea clientului care va aprecia acest mic bonus.

Să vedem cum arată inerfața implicită:

custom-login-1

I. instalarea pluginului BM Custom Login

Pentru instalare sunt două variante:

1. instalare manuală

  • se downloadeză arhiva zip de pe wordpress.org
  • se dezarhivează și conținutul se urcă prin FTP în directorul “/wp-content/plugins/”
  • sau se încarcă direct arhiva prin Upload în Install Plugin
  • se activează

2. varianta automată

  • din meniul Plugins -> add new
  • în câmpul de search se introduce “BM Custom Login”
  • se instaleză și se activează

II. personalizarea interfeței de autentificare

După instalare și activare pluginul trebuie setat. Setările se accesează din meniul Settings -> Custom Login, ca în figura de mai jos:

custom-login-2

Interfața de administrare arată ca mai jos:

custom-login-3

Se pot folosi două imagini:

– Background Image URL: este imaginea de fundal a casetei de autentificare, este bine sa fie de 340px lățime și maxim 600px înălțime
– Page Background Image: este imaginea din fundalul paginii

Imaginile se pot urca pe server fie prin FTP fie prin Media. În ambele cazuri trebuie știut url-ul imaginii și introdus în câmpurle potrivite.

Celelalte câmpuri:

– WordPress footer text: este textul care apare în Footer în interfața de adminsitrare, se poate modifica însă atenție: nu introduceți ghilimele duble, folosiți ghilimele simple, ex:

Thank you for creating with <a target='_blank' href='http://wordpress.org/'>WordPress</a> &amp; <a target='_blank' href='http://3waves.ro/'>3WavesNet</a>

– Custom Login Powered by: dacă lipsește imaginea de fundal a formularului de autentificare se va pune un <h1></h1> av’nd con’inutul trecut ]n acest c\mp, implicit este WordPress

-Page Background Color: culoarea de fundal a paginii

– Page Background Vertical Position: alinierea pe verticală a imaginii de fundal a paginii

– Page Background Horizontal Position: alinierea pe orizontală imaginii de fundal a paginii

– Page Background Repeat: dacă și pe ce axă se repetă fundalul

– Text Color: culoare textului din formularul de autentificare

– Text Shadow Color:culoare umbrei de la linkuri

– Text Link Color: culoare linkurilor

Și gata 🙂 aveți o interfață de autentificare personalizată, în ton cu designul general al site-ului, un client mulțumit și un proiect lucrat frumos.

Modele poteți găsi aici: Custom Login WordPress.

Să vedem cum arată câteva interfețe de autentificare personalizate:

Tags: , ,