Wordpress

Cara Membuat Ikon Situs untuk Situs WordPress Anda .

Pakar branding akan sering berbicara tentang visibilitas.  Dengan kata lain, elemen situs Anda yang menghadap pengguna harus selalu mencerminkan merek Anda.  Namun, satu proyek yang mungkin belum Anda pertimbangkan adalah membuat ikon situs untuk situs WordPress Anda.

Kabar baiknya adalah mendesain dan mengunggah ikon situs Anda ke WordPress menjadi lebih mudah dari sebelumnya.  Sebenarnya, ada sejumlah cara untuk menyelesaikan tugas terlepas dari keahlian, waktu, dan anggaran Anda.

Dalam posting ini, kita akan melihat cara membuat ikon situs untuk situs Anda.  Namun pertama-tama, kami akan menjelaskan mengapa Anda ingin mempertimbangkan untuk membuat ikon situs, bersama dengan beberapa pertimbangan yang perlu Anda buat.

Apa Itu Ikon Situs (Dan Mengapa Anda Membutuhkannya)

Anda mungkin pernah melihat ikon situs, meskipun Anda tidak yakin apa itu.  Bahkan, Anda sudah melihatnya – lihat sudut kiri atas jendela browser Anda:

Ikon situs WPKube.

Ini pada dasarnya adalah ikon kecil yang ditampilkan di sebelah tab halaman di browser Anda, atau di Halaman Hasil Mesin Pencari (SERP):

Ikon situs ditampilkan di SERP.

Anggap saja itu setara digital dengan bola kecil yang Anda pasang ke antena mobil Anda.  Namun, ada perbedaan antara ikon situs dan 5.000 bola berwarna lainnya di tempat parkir Walmart: Anda dapat membuat ikon situs khusus untuk merek Anda.

Dalam hal pencitraan merek situs Anda, kesan pertama itu penting.  Terlebih lagi, konsumen melihat ke seberapa konsisten sebuah merek sebagai penanda kepercayaan.  Ikon situs dapat membantu mencapai kedua hal ini.

Memang, ikon situs Anda tidak akan membawa seluruh bobot strategi branding Anda.  Namun, visibilitas ekstra yang dibawanya – terutama jika calon pelanggan menjelajahi situs Anda – dapat berdampak positif di masa mendatang.

Cara Membuat Ikon Situs untuk Situs WordPress Anda (Dalam 3 Langkah)

Ada dua fase yang terlibat dalam tugas ini.  Pertama, Anda ingin membuat ikon situs.  Kemudian, Anda harus mengunggahnya ke situs web WordPress Anda.  Berikut adalah tiga langkah yang dapat Anda ambil untuk membuat ikon situs untuk situs WordPress Anda:

Kami kemudian akan menunjukkan kepada Anda tiga cara untuk mengunggah ikon Anda:

Ada banyak hal yang harus dilalui, jadi mari kita mulai!

Langkah 1: Pilih Ukuran yang Tepat untuk Ikon Situs Anda

Pertama, adalah ukuran ikon situs Anda.  Anda benar jika berpikir bahwa file-file ini akan berukuran kecil.  Namun, meskipun ukurannya kecil, memahami berbagai dimensi bisa rumit.  Ini karena platform yang berbeda memiliki persyaratan yang berbeda untuk ukuran ikon situs (atau ‘favicon’).

Secara umum, sebagian besar browser akan mendukung 32 x 32 piksel .ico file, yang telah menjadi standar selama beberapa dekade.  Namun, dalam praktiknya, Anda akan ingin menggunakan resolusi 512 x 512 piksel .png mengajukan.  Alasannya adalah karena ini mencakup hampir semua pangkalan, dari ukuran ikon situs Chrome default, hingga persyaratan minimum.

Kebetulan, ini juga merupakan rekomendasi eksplisit di bagian belakang WordPress (lebih banyak lagi nanti).  Setelah ukuran Anda diatur, saatnya untuk memikirkan desain.

Langkah 2: Pastikan Anda Menggunakan Praktik Optimal untuk Desain Ikon Situs Anda

Godaan untuk desain ikon situs hanyalah menggunakan versi logo situs Anda yang diperkecil dan menyebutnya sehari.  Namun, dengan saran kami tentang pencitraan merek yang optimal, Anda harus meluangkan waktu untuk mengerjakan ikon situs khusus daripada memilih opsi yang mudah.

Terlebih lagi, ‘ruang’ virtual yang Anda miliki berarti Anda mungkin tidak dapat mengartikulasikan branding Anda menggunakan logo biasa Anda.  Karena itu, Anda sebaiknya mempertimbangkan hal berikut saat menyusun ikon situs Anda:

  • Saring branding Anda hingga satu atau dua warna sederhana yang menawarkan konsistensi dan visibilitas.
  • Pare logo Anda ke elemen yang paling penting, dan jadikan ini subjek ikon situs Anda.
  • Gunakan kontras untuk memberikan fokus pada aspek utama ikon situs Anda.

Untuk menawarkan contoh dunia nyata ini, lihat lagi ikon situs bangArif.  Ini menggunakan warna biru dan putih, yang menawarkan kontras tinggi, dan hanya berisi logo situs.

Ini semua yang dibutuhkan.  Ini menawarkan visibilitas, konsistensi dengan elemen branding lainnya, dan memastikan Anda dapat melihat tab di SERP dan layar browser.

Langkah 3: Pilih Alat yang Tepat untuk Membuat Ikon Situs Anda

Langkah terakhir setelah Anda mengurutkan ukuran dan desain ikon situs Anda adalah membuatnya.  Seperti yang Anda harapkan, ada banyak cara untuk membuat ikon Anda, dan jika Anda memiliki alat seperti Canva, ini akan menjadi ideal.  Alternatif seperti DesignBold juga cocok untuk tugas tersebut, terutama jika akun Anda sudah menyimpan logo situs Anda:

Aplikasi DesignBold.

Favicon.io juga fantastis untuk membuat ikon situs hanya teks dengan cepat, dan mengunduh semua berbagai ukuran yang Anda butuhkan:

Situs web Favicon.io.

Ingatlah bahwa Anda harus menyimpan ikon situs Anda sebagai 8- atau 24-bit nontransparan .PNG file, karena ini adalah format yang paling optimal.  Favicon.io melakukan ini untuk Anda, meskipun Anda harus mengubah pengaturan di editor umum lainnya.

3 Cara Mengunggah Ikon Situs Anda ke WordPress

Seperti standar WordPress, ada banyak cara untuk mengunggah ikon situs Anda.  Kami akan menyentuh kasus penggunaan dan kesesuaian di bawah ini, meskipun Anda bebas untuk menyelidiki apa pun yang mungkin cocok untuk Anda.

1. Gunakan Fungsi bawaan WordPress

Berita bagus untuk sebagian besar pengguna WordPress adalah platform ini menawarkan fungsionalitas cepat dan mudah untuk mengunggah ikon situs.

Jika Anda mencari pendekatan tanpa basa-basi untuk tugas tersebut, ini adalah metode untuk Anda.

Langkah 1. Akses Layar Identitas Situs di WordPress

Pertama, masuk ke WordPress.  Dari dasbor, Anda ingin menuju ke panel opsi tema Anda.  Tema premium Anda mungkin memiliki opsi khusus, meskipun untuk tema default WordPress ini akan berada di dalam Penampilan > Sesuaikan > Identitas Situs layar Penyesuai:

Layar Identitas Situs.

Setelah Anda di sini, Anda dapat melanjutkan ke langkah berikutnya.

Langkah 2. Pilih Ikon Situs Anda

Selanjutnya, lihat Identitas Situs bagian untuk Pilih ikon situs kotak dialog:

Bagian Ikon Situs.

Di sini, klik dan unggah seperti biasa dengan unggahan media WordPress.  Ingatlah untuk mengatur ‘teks alternatif’ yang sesuai untuk ikon situs Anda, untuk meningkatkan aksesibilitas Anda.

Langkah 3. Periksa Ikon Situs Anda di Front End

Terakhir, lihat bagian depan situs Anda, khususnya untuk melihat apakah ikon situs Anda telah diunggah dengan benar.  Anda akan melihat bahwa WordPress menawarkan pratinjau besar dari ikon situs Anda saat ini, dalam mockup browser:

Ikon situs ditampilkan dalam WordPress.

Namun, Anda tetap harus melihat bagaimana ikon ditampilkan di browser, terutama karena itu akan menunjukkan bagaimana ikon terlihat bagi pengguna lain – faktor yang lebih penting.

2.  Instal Plugin WordPress yang Cocok

Bagi banyak pengguna, menginstal plugin WordPress adalah solusi ‘go-to’.  Namun, mengingat bahwa hampir semua situs WordPress memiliki opsi Customizer bawaan untuk melakukan ini, sebuah plugin mungkin berlebihan.

Kami menyarankan pendekatan ini jika Anda memiliki persyaratan khusus untuk ikon situs Anda, atau tidak memiliki opsi untuk mengunggahnya menggunakan opsi tema Anda.

Langkah 1. Pilih Plugin yang Cocok

Judul langkah ini sedikit keliru, karena kami hanya merekomendasikan satu plugin: Favicon oleh RealFaviconGenerator:

Plugin Favicon oleh RealFaviconGenerator.

Ini pada dasarnya adalah versi plugin dari situs web populer, dan meningkatkan fungsionalitas bawaan WordPress.  Ini menghasilkan semua ikon situs yang diperlukan dari satu gambar, dan menyimpannya di Perpustakaan Media.

Setelah Anda diinstal dan diaktifkan plugin, Anda hampir selesai.

Langkah 2. Unggah Ikon Situs Berukuran Penuh Anda

Setelah plugin diaktifkan, Anda akan melihat yang baru Penampilan > Favicon panel di dalam dasbor WordPress Anda.  Judul di sini menampilkan serangkaian opsi yang tidak rumit:

Layar opsi plugin Favicon.

Meskipun kata-katanya sedikit membingungkan, Anda pada dasarnya mengunggah ke (atau memilih gambar dari) Perpustakaan Media.  Ingatlah untuk menambahkan teks alternatif di sini jika Anda belum melakukannya.

Untuk memulai proses pengunggahan, cukup klik tombol biru Buat favicon tombol, dan pindah ke langkah terakhir.

Langkah 3. Unduh Ikon Situs Anda

Setelah plugin mulai menghasilkan ikon situs Anda, Anda akan melihatnya beralih ke versi aplikasi web dari situs pengembang.  Di sinilah Anda akan menemukan semua ikon situs yang berbeda untuk berbagai platform dan dimensi:

Layar unduh plugin Favicon.

Perhatikan bahwa Anda dapat memilih beberapa opsi khusus platform tambahan di sini, terkait dengan desain dan presentasi ikon situs Anda:

Opsi penyesuaian tambahan dalam plugin Favicon.

Namun, setelah Anda siap, klik Hasilkan Favicons dan kode HTML Anda, di titik mana plugin akan bekerja dengan ajaibnya.

Terakhir, Anda akan dibawa kembali ke dasbor WordPress, tempat Anda akan melihat pratinjau ikon situs Anda dalam berbagai maket:

Layar pratinjau plugin Favicon.

Ikon situs Anda sekarang harus siap diluncurkan – sekali lagi, Anda harus memeriksa bagian depan untuk memastikannya.

3.  Bekerja Dengan Kode untuk Menampilkan Ikon Situs Anda

Pendekatan terakhir yang akan kami sertakan bisa dibilang sudah ketinggalan zaman untuk pengguna rata-rata, mengingat alternatifnya.  Namun, menggunakan kode untuk menampilkan ikon situs Anda sangat ideal untuk persyaratan yang sangat tepat, atau bahkan jika Anda membuat tema khusus.

Langkah 1. Akses Server Situs Anda Menggunakan File Transfer Protocol (FTP)

Untuk pendekatan ini, Anda perlu akses server melalui FTP.  Terlebih lagi Anda akan membutuhkan klien yang sesuai seperti Cyberduck atau Filezilla, dan keterampilan yang cukup tajam.  Karena kami akan bekerja dengan file inti WordPress, penggunaan tema anak juga disarankan.

Setelah Anda memilikinya, masuk ke server Anda menggunakan kredensial yang ditemukan di dalam panel kontrol hosting Anda.  Jika Anda tidak yakin di mana menemukannya, Anda harus menghubungi saluran dukungan host Anda.  Mereka juga dapat ditemukan di email yang Anda terima saat pertama kali membeli hosting.

Langkah 2. Unggah File Ikon Situs Anda ke WordPress

Setelah Anda mengakses server, klien FTP Anda akan menampilkan daftar direktori situs Anda:

Direktori WordPress di Cyberduck.

Di sini, ambil file ikon situs Anda, dan unggah ke folder kedua tema utama Anda (ditemukan di dalam wp-konten > tema) dan direktori root situs Anda.

Pada titik ini, Anda hampir selesai.  Langkah terakhir adalah meng-hard-code ikon situs Anda ke WordPress.

Langkah 3. Tambahkan Kode ke Header Website Anda

Untuk langkah terakhir, Anda akan ingin kembali ke WordPress, khususnya ke Penampilan > Editor Tema halaman:

Mengedit file header.php di WordPress.

Saat Anda pertama kali mengakses halaman, dialog peringatan akan muncul.  Pemula di layar ini ingin membaca pemberitahuan, sebelum mengklik saya mengerti.

Layar yang tepat akan menampilkan kode yang membentuk seluruh situs WordPress Anda di sini, dan semuanya dapat diedit, jadi lanjutkan dengan hati-hati.

Pertama-tama Anda harus memeriksa apakah Anda bekerja dengan tema yang tepat di Pilih tema untuk diedit menu drop down:

Memilih tema yang tepat untuk diedit.

Selanjutnya, gulir ke bawah File Tema daftar sampai Anda menemukan Judul Tema (header.php) pilihan.  Anda ingin memilih ini di sini, yang akan menampilkan header.php berkas di editor.

Anda akan ingin mencari baris kode yang dimulai, <link rel="shortcut icon" dan diakhiri dengan /favicon.ico" />.  Jika Anda menemukannya, ganti dengan baris kode berikut:

    <link rel="shortcut icon" href="<?php echo  get_stylesheet_directory_uri(); ?>/favicon.ico" />    

Jika baris tidak ada sama sekali, Anda dapat menambahkan baris di antara Anda tag:

Menambahkan kode ke editor WordPress.

Terakhir, klik biru Perbarui Berkas tombol, lalu periksa ikon situs Anda di ujung depan.

Singkatnya

Singkatnya, ikon situs Anda dapat membantu pengguna mengenali merek Anda, dan meningkatkan visibilitas Anda.  Setiap peluang untuk menjerat pelanggan potensial harus dipertimbangkan;  mengingat waktu dan sumber daya yang Anda perlukan untuk membuat ikon situs, keputusan untuk melakukannya sangatlah mudah.

Dalam posting ini, kita telah melihat cara membuat ikon situs untuk situs WordPress Anda menggunakan tiga metode.  Mari kita cepat rekap:

  1. Gunakan fungsionalitas bawaan WordPress untuk mengunggah ikon Anda.
  2. Instal plugin seperti Favicon oleh RealFaviconGenerator.
  3. Tampilkan ikon situs Anda menggunakan kode.

Apakah ikon situs akan menjadi bagian dari strategi branding situs Anda secara keseluruhan?  Sampaikan pendapatmu pada bagian komentar di bawah ini!

Demikanlah tulisan tentang Cara Membuat Ikon Situs untuk Situs WordPress Anda . Semoga dapat menjadi manfaat bagi kita semua.

Related Articles

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan.

Back to top button