WordPressin kirjautumissivu on oletuksena aina samanlainen. Sivulla on WordPressin logo ja lomake, johon käyttäjä syöttää tunnuksen ja salasanan. Kirjautumissivun tyylejä on kuitenkin mahdollista muuttaa.  Tällä kertaa käymme läpi, miten kirjautumissivusta saa tehtyä persoonallisemman omille sivuille.

Kirjautumissivu

WordPressin kirjautumissivu näyttää seuraavalta.

wordpress-kirjautuminen-oletus

Käytämme sivun tyylien muokkaamiseen Custom Login -lisäosaa. Sivun tyylejä voi tällä tavoin muuttaa suoraan ylläpidosta ilman koodaustaitoja. Lisäosan asennuksen ja aktivoinnin jälkeen Asetukset-osion alle ilmestyy uusi Custom Login -osio.

WP-opas suosittelee:

Hidasteleeko sivusto? Zoner auttaa: Nopeat dedikoidut palvelimet juurikin WordPressille. Oli tarve sinulla sitten WooCommercelle tai kotisivuille. Zoner on yksi suomen parhaimpia ja nopeimpia. Asiakaspalvelu on saatavilla suomeksi ja asiakapalvelua myös viikonloppuna! (Harvinaista)

custom-login-valikko

Tässä osiossa pystyy määrittelemään useita eri asioita, jotka vaikuttavat kirjautumissivun ulkoasuun.

Ihan ensimmäisenä on asetus, joka määrittää sen, käytetäänkö lisäosan ulkoasumäärityksiä. Tämä vaihtoehto siis pitää olla ruksitettu, jotta asetukset ovat käytössä.

custom-login-lisaosa-paalle

Tausta

Toisena on sivun taustan määritykset. Tässä kohtaa voi määrittää sivun taustavärin tai -kuvan. Kuvaa käytettäessä voi määrittää toistetaanko kuvaa ja miten se asemoituu sivulle.

custom-login-lisaosa-html-asetukset

Logo

Seuraavaksi voi määrittää lomakkeen yläpuolella näkyvän logon. Logolle voi määrittää jälleen sen toistetaanko sitä ja miten se asemoituu sivulle.

custom-login-lisaosa-logo-asetukset

Lomake

Kirjautumislomaketta voi myös muokata monella tapaa. Lomakkeelle voi määrittää taustavärin tai -kuvan. Tämän lisäksi lomakkeelle voi määrittää reunojen värin ja kulmien pyöreyden. Myös lomakkeen tekstin värin voi vaihtaa. Lomakkeen alla olevien linkkien värit voi myös määrittää.

custom-login-lisaosa-lomake-asetukset

Edistynyt

Viimeisenä on mahdollista vielä määrittää CSS/ HTML / jQuery määrityksiä. Näitä voi kokeilla jos tietää mitä on tekemässä.

custom-login-lisaosa-edistyneet-asetukset

Kun muutokset on tehty, ne pitää tallentaa. Jos lisäosa oli määritetty käytettäväksi ensimmäisessä kohdassa, tämän jälkeen kirjautumissivu näyttää erilaiselta. Ohessa alla kirjautumissivu, jonka tein tätä artikkelia varten.

wordpress-kirjautuminen-wpopas

Kirjoittaja Timo Leiniö

Olen WP-oppaan perustaja ja päätoimittaja. Työskentelen päivittäin erilaisten verkkosovelluksiin liittyvien haasteiden parissa Sofokuksella. Vapaa-ajalla minut löytää todennäköisesti kalastamasta tai pelaamasta biljardia.

Keskustele ja kysy

Lisää uusi kommentti

Sähköpostiosoitettasi ei julkaista. Pakolliset kentät on merkitty *