Cara Mengubah Warna Tautan di WordPress (Panduan Pemula)

Cara Mengubah Warna Tautan di WordPress (Panduan Pemula)

Apakah Anda ingin mempelajari cara mengubah warna tautan di WordPress?

Mengubah warna tautan memberi Anda kontrol lebih besar atas desain situs internet Anda dan dapat memudahkan pengunjung Anda untuk bernavigasi.

Pada artikel ini, kami akan menunjukkan cara mengubah warna tautan di WordPress, langkah demi langkah.

Cara mengubah warna tautan di WordPress (panduan pemula)

Mengapa Mengubah Warna Tautan di WordPress?

Saat Anda menambahkan tautan di WordPress, tema Anda akan secara otomatis menentukan warna tautan.

Terkadang opsi warna default tema WordPress Anda akan persis seperti yang Anda inginkan, tetapi di lain waktu Anda ingin lebih mengontrol tampilan tautan.

Misalnya, Anda mungkin ingin mengubah warna tautan agar sesuai dengan merek atau brand bisnis Anda. Atau, Anda mungkin ingin meningkatkan kontras warna untuk meningkatkan aksesibilitas internet bagi pembaca dengan penglihatan terbatas.

Beberapa tema memungkinkan Anda untuk mengubah warna tautan langsung dari panel opsi tema atau penyesuai tema WordPress, jadi pastikan untuk memeriksa dokumentasi tema Anda sebelum mengubah warna tautan dengan CSS.

Karena itu, mari kita lihat beberapa cara Anda dapat mengubah warna tautan di situs internet WordPress Anda.

Metode 1. Ubah Warna Tautan di WordPress dengan Mengedit CSS

Salah satu cara untuk mengubah warna tautan di WordPress adalah dengan menambahkan kode CSS khusus.

Hal pertama yang perlu Anda lakukan adalah menavigasi ke dasbor admin WordPress Anda dan pergi ke Penampilan » Sesuaikan lalu klik opsi menu ‘CSS tambahan’.

Penyesuai WordPress ke CSS tambahan

Ini akan membawa Anda ke layar di mana Anda dapat menambahkan kode CSS khusus Anda di sisi kiri halaman.

Anda akan menambahkan cuplikan kode CSS dari contoh di bawah ini ke bagian editor Anda ini.

Tambahkan layar kode CSS tambahan

Pertama, kita akan menyesuaikan warna tautan secara keseluruhan. Ini adalah warna yang akan dilihat pengunjung Anda jika mereka belum pernah mengklik tautan sebelumnya.

Anda dapat menggunakan kode CSS di bawah ini sebagai contoh.

a 
     colour: #FFA500;

Ini akan mengubah warna tautan default menjadi oranye. Pastikan Anda mengubah #FFA500 warna dengan warna yang ingin Anda gunakan.

Ubah Warna Arahkan Tautan di WordPress

Hal berikutnya yang akan kita ubah adalah warna hover hyperlink. Dengan begitu, ketika pengguna mengarahkan kursor ke tautan, itu akan berubah warna untuk menarik perhatian mereka.

Anda dapat menggunakan kode CSS di bawah ini sebagai contoh.

a:hover 
     colour: #FF0000;
     text-decoration: underline;

Kode di atas akan mengubah warna tautan menjadi merah dan menggarisbawahi teks saat pengunjung mengarahkan kursor ke atasnya. Pastikan untuk mengubah #FF0000 warna yang Anda inginkan.

Kami menggunakan tautan menggarisbawahi efek hover di sini di WPBeginner pada tautan kami.

Ubah Warna Tautan Setelah Kunjungan di WordPress

Hal lain yang mungkin ingin Anda ubah adalah warna tautan setelah pengguna mengklik tautan. Ini dapat membantu pengunjung dengan mudah menavigasi weblog WordPress Anda dan melihat tautan mana yang telah mereka klik.

Anda dapat menggunakan kode CSS di bawah ini untuk mengubah warna tautan yang dikunjungi.

a:visited 
     colour: #0000FF;

Pastikan Anda mengubah warna biru #0000FF warna dengan warna yang Anda pilih.

Berikut adalah bagaimana semua kode CSS di atas akan terlihat di dalam penyesuai WordPress.

Kode penyesuai WordPress

Setelah Anda membuat perubahan, klik tombol ‘Terbitkan’ untuk menampilkan perubahan Anda.

Kode CSS di atas akan mengubah warna semua tautan di situs Anda.

Jika Anda hanya ingin menyesuaikan tautan yang ada di posting dan halaman Anda, Anda dapat menggunakan contoh kode di bawah ini.

.entry-content a 
     colour: #FFA500;


.entry-content a:hover 
     colour: #FF0000;
     text-decoration: underline;


.entry-content a:visited 
     colour: #0000FF;

Kode ini melakukan hal yang sama seperti contoh kode di atas, tetapi .entry-content hanya menargetkan tautan dalam konten Anda.

Ubah Warna Tautan Navigasi Anda di WordPress

Satu gaya tautan terakhir yang juga dapat Anda sesuaikan adalah tautan menu navigasi Anda.

Sesuaikan tautan menu navigasi

Untuk element lebih lanjut, lihat panduan kami tentang cara menata menu navigasi WordPress.

Jika Anda tidak ingin menambahkan kode langsung ke tema WordPress Anda, Anda dapat menggunakan plugin CSS untuk menambahkan kode ke situs internet Anda.

Dengan begitu, perubahan CSS Anda akan diterapkan bahkan jika Anda memutuskan untuk mengubah tema WordPress Anda.

Hal pertama yang perlu Anda lakukan adalah menginstal dan mengaktifkan plugin Easy Customized CSS dan JS. Untuk element lebih lanjut, lihat panduan langkah demi langkah kami tentang cara menginstal plugin WordPress.

Setelah aktivasi, cukup buka CSS & JS Kustom » Tambahkan CSS Kustom di panel admin WordPress Anda.

Di sini Anda dapat menambahkan kode CSS yang sama seperti di atas.

Tambahkan kode CSS khusus dengan plugin

Setelah Anda selesai menambahkan kode, pastikan untuk mengklik tombol ‘Terbitkan’ atau ‘Perbarui’.

Metode 2. Ubah Warna Tautan Tanpa Mengedit CSS

Jika Anda tidak nyaman mengedit document CSS, maka metode ini cocok untuk Anda.

Alih-alih menambahkan kode CSS langsung ke situs internet Anda, Anda dapat menggunakan plugin gaya CSS untuk mengedit situs Anda secara visible tanpa menulis kode apa pun.

Sebaiknya gunakan plugin Pahlawan CSS. Ini sangat ramah pemula dan memungkinkan Anda menyesuaikan situs internet secara visible mirip dengan pembuat halaman seret dan lepas.

Setelah plugin diinstal, Anda perlu mengklik tombol ‘Lanjutkan ke Aktivasi Produk’ di atas daftar plugin untuk mengaktifkannya dan menghubungkan akun Anda.

Aktifkan Pahlawan CSS

Ini akan membawa Anda ke layar di mana Anda dapat memasukkan nama pengguna dan kata sandi Anda.

Yang harus Anda lakukan adalah mengikuti petunjuk di layar, dan Anda akan dibawa kembali ke situs internet Anda setelah akun Anda diverifikasi.

Selanjutnya, klik tombol ‘Sesuaikan dengan Pahlawan CSS’ di bagian atas bilah alat admin WordPress Anda.

Sesuaikan dengan Pahlawan CSS

Ini akan membuka situs internet Anda dengan CSS Hero yang berjalan di atasnya. CSS Hero menggunakan apa yang disebut editor Apa yang Anda Lihat adalah Apa yang Anda Dapatkan (WYSIWYG).

Cukup klik pada elemen halaman mana pun, dan itu akan memunculkan bilah alat yang memungkinkan Anda membuat penyesuaian.

Kemudian, klik salah satu tautan di situs internet Anda. Kita akan mulai dengan salah satu hyperlink posting weblog.

Klik tautan situs web

Setelah itu, pilih merchandise menu ‘Tipografi’ dan Anda dapat memilih warna baru untuk tautan Anda.

Anda dapat memilih warna baru dari daftar atau menambahkan kode warna Anda sendiri.

Pilih opsi tipografi

Ubah Warna Menu Navigasi WordPress Anda

Selanjutnya, Anda dapat mengubah warna tautan menu navigasi WordPress Anda.

Cukup arahkan kursor ke menu navigasi Anda dan klik salah satu merchandise menu.

Klik tautan menu navigasi

Kemudian, pilih opsi ‘Tipografi’ dan Anda dapat menyesuaikan warna langsung di bawah ini.

Anda akan melihat saat Anda mengubah warna tautan menu, perubahan tersebut langsung muncul di pratinjau.

Sesuaikan warna menu Pahlawan CSS

Setelah selesai mengubah warna tautan, Anda perlu mengeklik tombol ‘Simpan dan Terbitkan’ untuk membuat perubahan Anda aktif.

Kami harap artikel ini membantu Anda mempelajari cara mengubah warna tautan di WordPress. Anda mungkin juga ingin melihat panduan kami tentang cara memilih perangkat lunak desain internet terbaik, atau daftar plugin WordPress yang harus dimiliki.

Jika Anda menyukai artikel ini, silakan berlangganan Saluran YouTube kami untuk instructional video WordPress. Anda juga dapat menemukan kami di Indonesia dan Fb.

Posting Cara Mengubah Warna Tautan di WordPress (Panduan Pemula) muncul pertama kali di WPBeginner.

Baca Juga : Jasa Seo Profesional