[Wordpress] เปลี่ยนโลโก้และ URL ในหน้า Login

เมื่อเข้าหน้า Login สำหรับเว็บที่ใช้ Wordpress นั้น เราจะเจอโลโก้ Wordpress และเมื่อคลิ๊กที่โลโก้ก็จะลิงก์ไปยังเว็บ Wordpress.org แต่ถ้าเราอยากจะเปลี่ยนโลโก้กับ URL ให้ลิงก์มาที่เว็บเราละ ทำแบบนี้ครับ

เปลี่ยนโลโก้หน้า Login

โลโก้ในหน้า Login นั้น เป็นการดึงรูปมาจาก /wp-admin/images/logo-login.png ซึ่งเราสามารถนำรูปโลโก้ที่เราต้องการไปวางแปะแทนที่ก็ได้ หรือใช้วิธีนี้ครับ เข้าไปที่ functions.php ใน theme ของเรา แล้วนำ code นี้ไปวางครับ

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

คือการให้ในส่วนของ login เรียกใช้งาน customlogin.css ด้วย (จาก code เราต้องสร้าง customligin.css ใน path เดียวกับ style.css นะครับ ^^)

หลังจากที่ให้หน้า login เรียกใช้งาน customlogin.css แล้ว ก็มาจัดการกับส่วนโลโก้เลยครับ

#login h1 {
	background:url(https://rabbitinblack.com/wp-content/uploads/concrete_wall.png);
	margin:0 0 10px 8px;
}
#login h1 a {
	background: url(images/logo.png) no-repeat center center;
	width: 153px;
	height: 78px;
	text-indent: -9999px;
	overflow: hidden;
	padding: 15px 0;
	display: block;
	margin:0 auto;
}

อันนี้เป็น CSS ที่ผมกำหนดเพื่อให้ผลลัพธ์ออกมาเป็นแบบนี้นะครับ

ซึ่งตัว CSS ก็แล้วแต่จะปรับแก้กันเลยนะครับ >_<



เปลี่ยน URL ของโลโก้ตามปรกติตัวโลโก้นั้น ก็จะลิงก์ไปยังเว็บของ Wordpress เอง แต่เราอยากเปลี่ยนให้ลิงก์ไปหน้าแรกของเว็บเรา ก็ทำแบบนี้ครับ แปะ code นี้ในส่วนของ functions.php นะครับ

function change_login_headerurl( $login_url ) {
    return get_bloginfo( 'siteurl' );
}
add_filter( 'login_headerurl', 'change_login_headerurl' );

เพียงเท่านี้ ลิงก์ของโลโก้เราก็จะลิงก์ไปยังหน้าแรกของเว็บเราแล้วครับ