WordPress admin login oldal szerkesztése

Korábban mutattam a My Brand Login bővítményt, amivel egyedire szabható a bejelentkezés.

Most nézzünk még néhány verziót a bővítmények közül, illetve a használt sablonhoz illeszkedő megjelenésre.

Legelőször azonban kezdjük a WordPress logó saját logónkra cserélésével. Ez zavarja a legtöbb webmestert.

A WordPress admin bejelentkezési oldal logójának cseréje

Amennyiben a képen látható admin login oldalt akarod módosítani, egy lehetséges módja, ha

A functions.php fájlba másold be az alábbi kódot:

// Custom WordPress Login Logo
function login_css() {
wp_enqueue_style( 'login_css', get_template_directory_uri() . '/css/login.css' );
}
add_action('login_head', 'login_css');


A logó módosításához elég a style.css fájlodba beillesztened az alábbi kódot.

#login h1 a {
background-image: url("http://honlapod.com/wp-content/themes/sablonod/images/custom_logo.png") !important;
}


Természetesen a kódban a honlapod.com – a saját honlapod címére, a sablonod a sablonod nevére, a custom_logo.png pedig a sablonod images könyvtárába feltöltött képre cserélendő.

Megoldható a logó lecserélése bővítménnyel is: https://wordpress.org/extend/plugins/add-logo-to-admin/

A teljes bejelentkezési oldal szerkesztése

Legegyszerűbb módja, ha a wp-admin/css/login.css fájlt szerkeszted ízlésed szerint.

Mivel ez a fájl a WordPress frissítésénél felül fog íródni, ezért kell egy apró módosítás 🙂

Az alábbi kódot  másold a functions.php fájlba (Ha nem /css/ a sablonon belüli elérési útvonal, akkor módosítsd megfelelően a kódot.)

// custom login page CSS
add_action('login_head', 'my_theme_custom_login');
function my_theme_custom_login() {
echo '<link rel="stylesheet" type="text/css" href="' . get_bloginfo('stylesheet_directory') . '/css/login.css" />';
}
// link login page logo to the site's URL instead of wordpress.org
add_filter( 'login_headerurl', 'my_theme_the_url' );
function my_theme_the_url( $url ) {
return get_bloginfo( 'url' );
}


Ezt követően az általad módosított login.css fájlt töltsd fel a sablonod css könyvtárába (vagy ahol a css fájlok vannak). Ha nincs külön css könyvtár, akkor a sablonod “gyökérkönyvtárába”. Ha képeket is cserélsz, ne felejtsd el az általad meghatározott elérési útvonalnak megfelelően feltölteni azokat sem.