Cara Menyesuaikan Halaman Login WordPress
Diterbitkan: 2022-01-02Mengapa Anda Membutuhkan Halaman Login yang Disesuaikan untuk WordPress?
- Pengguna Anda akan mendaftar dan masuk menggunakan layar masuk WordPress default, Karena WordPress tidak menyediakan opsi bawaan untuk menambahkan logo Anda sendiri atau mengubah keseluruhan tampilan dan nuansa agar sesuai dengan tema atau merek khusus apa pun yang Anda miliki di situs Anda.
- Ini mungkin berfungsi dengan baik untuk situs web kecil. Namun, jika Anda menjalankan situs web bisnis atau komunitas online yang sibuk, Anda mungkin ingin menunjukkan merek Anda sendiri daripada WordPress.
Berikut dua cara yang bisa Anda lalui:
Anda dapat menghubungi pakar dari Perusahaan Pengembangan WordPress populer dari AS untuk pertanyaan apa pun.
Mari lanjutkan membaca solusi di bawah ini!
1. Gunakan Tata Letak WordPress yang Ada.
- Sebenarnya tenang mudah untuk menyesuaikan yang sudah ada.
- Jika itu hanya mengubah logo atau memberikan tata letak yang sama sekali berbeda, tempat untuk memulai adalah tindakan login_enqueue_scripts.
- Di sinilah Anda dapat membuat keputusan untuk menampilkan potongan CSS yang normal dan sederhana atau memberikan tautan ke file CSS lengkap. Anda juga dapat mengantri JavaScript pilihan Anda, yang ingin Anda gunakan.
- Di function.php
add_action('login_head', 'my_custom_login'); fungsi my_custom_login() { echo '<link rel="stylesheet" type="text/css" href="' . get_bloginfo('stylesheet_directory') . '/your_login_styles.css" />';}
- your_login_styles.css adalah nama file css yang dibuat untuk menyesuaikan Halaman Login.
- Perhatian harus diberikan di sini, pastikan bahwa Anda menggunakan pemilih yang sangat spesifik, untuk memastikan bahwa Anda mengganti gaya dasar.
- Untuk default, logo menautkan siapa pun ke alamat: wordpress.org. Ini dapat diubah ke url situs Anda menggunakan kode di bawah ini di file functions.php Anda:
add_filter( 'login_headerurl', 'my_login_logo_url'); fungsi my_login_logo_url() { kembali get_bloginfo('url'); } add_filter( 'login_headertitle', 'my_login_logo_url_title' ); fungsi my_login_logo_url_title() { return 'Nama dan Info Situs Anda';}
Cara paling mudah untuk mengubah pesan kesalahan adalah dengan kode di bawah ini di functions.php Anda:
add_filter('login_errors', 'login_error_override'); fungsi login_error_override() { return 'Detail login salah.'; }
Terkait : WordPress vs Adobe Business Catalyst : CMS Mana yang Terbaik untuk Dikembangkan?
2. Buat Tata Letak Baru.
- Sebagai permulaan, template halaman kustom untuk halaman login harus dibuat.
- Untuk melakukannya, Anda dapat memilih untuk membuat templat halaman baru dan memberinya nama. misalnya: halaman-login.php.
- Setelah itu, buat halaman baru dari WP Admin. Siapkan tautan permanen untuk masuk. Dengan demikian, WordPress secara default akan mengambil template page-login.php untuk halaman ini.
- Simpan tag wp_login_form di template halaman halaman-login.php untuk menampilkan formulir login
Elsner.com
Agensi solusi teknologi informasi global yang menyediakan layanan digital yang segar dan kreatif untuk bisnis yang ingin berkembang secara online. Berfokus pada hasil, kami menggunakan keterampilan teknis dan wawasan industri kami untuk membantu Anda memenuhi tujuan digital Anda. Baik itu menurunkan rasio pentalan Anda dengan desain web interaktif atau membawa lalu lintas baru dan aliran pendapatan ke situs web Anda. <a href=”www.elsner.com/contact-us”>Bicaralah dengan kami</a> tentang proyek Anda untuk memulai…
</p> </div> <div class="login-form"> <?php $args = array( 'redirect' => home_url(), 'id_namapengguna' => 'pengguna', 'id_password' => 'pass', ); ?> <?php wp_login_form( $args ); ?> </div>
- CSS sesuai kebutuhan pribadi Anda dapat dibuat. Halaman login sudah berfungsi.
- Kita dapat mencoba login, jika berhasil, kita akan diarahkan ke alamat yang ditentukan dalam parameter redirect di atas. Namun, ada yang harus dibenahi.
add_action('init','redirect_login_page'); fungsi redirect_login_page() { $login_page = home_url( '/login/' ); $page_viewed = nama dasar($_SERVER['REQUEST_URI']); if( $page_viewed == "wp-login.php" && $_SERVER['REQUEST_METHOD'] == 'GET') { wp_redirect($login_page); keluar; } }
– Halaman login dapat berfungsi sesuai harapan setelah kita login. Jika terjadi kesalahan, seperti saat mengirimkan kombinasi id dan kata sandi yang tidak valid, atau mengirimkan spasi kosong, kita akan diarahkan ke wp-login.php. Untuk mengatasi masalah ini, Anda dapat menambahkan fungsi berikut di functions.php Anda:

add_action('wp_login_failed', 'login_failed'); fungsi login_failed() { $login_page = home_url( '/login/' ); wp_redirect( $login_page . '?login=gagal' ); keluar; }
add_filter( 'otentikasi', 'verify_username_password', 1, 3); fungsi verifikasi_nama_pengguna_sandi( $pengguna, $namapengguna, $sandi ) { $login_page = home_url( '/login/' ); if( $username == "" || $password == "" ) { wp_redirect( $login_page . "?login=kosong" ); keluar; } }
– Masalah Terakhir adalah kita juga akan diarahkan ke wp-login.php ketika kita keluar dari situs. Oleh karena itu, kita perlu menentukan URL pengalihan saat logout juga.
add_action('wp_logout','logout_page'); fungsi logout_page() { $login_page = home_url( '/login/' ); wp_redirect( $login_page . "?login=false" ); keluar; }
- Ada beberapa hal yang bisa dilakukan untuk memperbaiki halaman login seperti penambahan link kata sandi yang hilang, link Daftar, dan bahkan pesan kesalahan yang dipersonalisasi. Namun, pada saat ini, sekarang berfungsi cukup baik bagi pengguna untuk masuk dan keluar. Ini bisa menjadi awal yang baik untuk membuat halaman login yang lebih maju.
Jadi ya! Hanya itu saja.
Dengan beberapa penyesuaian sederhana, Anda dapat dengan nyaman mempersonalisasi halaman login Anda agar sesuai dengan tampilan dan nuansa situs Anda.
Banyak perancang tema menahan diri untuk tidak menata halaman login karena mereka menganggapnya tidak perlu, terutama ketika itu di luar pengaturan tema WordPress.
Namun, ketika Anda membuat situs klien, mengabaikan gaya – dan secara signifikan, merek – halaman login dapat terbukti menjadi peluang yang hilang yang dapat merusak pengalaman pengguna ketika ada tema khusus yang diterapkan.
Peluang lain untuk merek situs Anda, yang juga meninggalkan kesan jangka panjang di benak pengguna Anda.
