Bagaimana cara mudah mengubah Logo dan URL halaman Login WordPress?

Diterbitkan: 2021-09-09
Logo dan URL halaman Login baru yang diperbarui.

Berikut adalah logo WordPress default Halaman Login:

Logo dan URL halaman Login Default.
  • Bagaimana Cara Mengubah Logo dan URL Login WordPress?
  • Menyesuaikan Formulir Masuk
  • Bagaimana Cara Mudah Mengganti Logo Login di WordPress?

Secara default setiap halaman WordPress memiliki logo default dan URL WordPress.org. Jika Anda ingin mengubah URL dan Logo login default WordPress maka Anda berada di tempat yang tepat.

Mari kita mulai:

Langkah-1: Ubah URL Halaman Login

Kami akan menggunakan login_headerurl WordPress kait untuk mengubah tautan URL. Ini digunakan untuk memfilter URL logo pada halaman login WordPress. Secara default, logo ini tertaut ke situs WordPress.

Masukkan kode di bawah ini ke dalam file functions.php.

1
2
3
4
5
6
7
8
// The “login_headerurl” filter is used to filter the URL of the logo on the WordPress login page.
// By default, this logo links to the WordPress site.
add_filter ( 'login_headerurl' , 'crunchify_login_link' ) ;
function crunchify_login_link ( ) {
 
// Change Logo link if you want user to redirect to other link.
return home_url ( ) ;
}

Langkah 2. Ubah Logo Halaman Masuk

Kami akan menggunakan login_enqueue_scripts kait WordPress. Ini adalah kait yang tepat untuk digunakan saat mengantrekan item yang dimaksudkan untuk muncul di halaman login. Terlepas dari namanya, ini digunakan untuk mengantrekan skrip dan gaya.

Masukkan kode di bawah ini ke dalam file functions.php.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
// login_enqueue_scripts is the proper hook to use when enqueuing items that are meant to appear on the login page.
// Despite the name, it is used for enqueuing both scripts and styles.
add_action ( 'login_enqueue_scripts' , 'crunchify_change_login_logo' ) ;
function crunchify_change_login_logo ( ) { ? >
     <style type ="text/css">
        #login {
         width : 400px ;
         }
        
         #login h1 {
         background : transparent ;
         padding : 10px ;
         }
        
         #login h1 a {
         background : url ( 'https://cdn.crunchify.com/crunchify-logo.png' ) no-repeat center center ;
         background-size : 200px ;
         height : 200px ;
         margin : 0 auto ;
         width : 200px ;
         }
        
         .login form .input,
        .login input[type="text"] {
         font-size : 20px ;
         font-weight : 100 ;
         margin : 3px 7px 17px 0 ;
         padding : 6px 12px ;
         }
                
         input[type="checkbox"]:focus,
        input[type="color"]:focus,
        input[type="date"]:focus,
        input[type="datetime-local"]:focus,
        input[type="datetime"]:focus,
        input[type="email"]:focus,
        input[type="month"]:focus,
        input[type="number"]:focus,
        input[type="password"]:focus,
        input[type="radio"]:focus,
        input[type="search"]:focus,
        input[type="tel"]:focus,
        input[type="text"]:focus,
        input[type="time"]:focus,
        input[type="url"]:focus,
        input[type="week"]:focus,
        select:focus,
        textarea:focus {
         border : 2px solid #ddd ;
         box-shadow : 0 0 3px rgba ( 0, 0, 0, .3 ) ;
         }
        
         .wp-core-ui .button-group.button-large .button,
        .wp-core-ui .button.button-large {
         background : #b11f24 ;
         border : 0 ;
         border-radius : 0 ;
         box-shadow : none ;
         font-weight : 400 ;
         height : 20px ;
         line-height : 30px ;
         padding : 2px 14px 4px ;
         text-shadow : none ;
         text-transform : uppercase ;
         }
        
         .login #backtoblog a:hover,
        .login #nav a:hover,
        .login h1 a:hover {
         color : #b11f24 ;
         }
        
         .login .message {
         border-left-color : #ddd ;
         }
        
         input[type="checkbox"],
        input[type="color"],
        input[type="date"],
        input[type="datetime-local"],
        input[type="datetime"],
        input[type="email"],
        input[type="month"],
        input[type="number"],
        input[type="password"],
        input[type="radio"],
        input[type="search"],
        input[type="tel"],
        input[type="text"],
        input[type="time"],
        input[type="url"],
        input[type="week"],
        select,
        textarea {
         border : 2px solid #ccc ;
         }
        
     </style>
< ? php }

Simpan saja semua perubahan dan buka halaman login situs Anda. Seharusnya terlihat seperti ini: https://crunchify.com/wp-admin/

Itu dia. Selamat. Anda telah berhasil memperbarui Logo dan URL halaman Login. Beri tahu saya jika Anda menghadapi masalah saat menjalankan kode ini.