Cara menambahkan icon pada menu wordpress paling simple

0
36

cara menambahkan icon pada menu wordpress paling simple

Menambahkan icon pada menu wordpress merupakan salah satu cara agar tampilan blog kita terlihat lebih cantik dan terkesan professional.

Cara yang umum dipakai adalah dengan menginstall plugin khusus agar tampilan menu pada wordpress atau blog kita bisa di customisasi dengan beberapa klik saja.

Namun tahukah anda bahwa semakin banyak jumlah plugin yang terinstall dalam sebuah blog akan sangat mempengaruhi kecepatan loading halaman blog tersebut?

Jika sudah demikian, tampilan yang ciamik dengan deretan icon menarik menjadi tidak berguna ketika pengunjung sudah malas menunggu proses loading blog anda dan mengurungkan untuk berselancar di dalamnya.

Note: Ini bukan berarti setelah menginstall plugin penambah icon blog anda langsung jadi lemot, namun poinnya adalah semakin banyak plugin yang terinstall, bisa mempengaruhi kecepatan loading halaman blog anda. Dan saya yakin saat ini pun anda sudah menginstall beberapa plugin di wordpress, kalau ditambah satu lagi kan jadi lebih banyak, hehehehee.

Nah, kali ini saya akan share bagaimana cara menambahkan icon pada menu wordpress tanpa perlu menginstall plugin. Dengan demikian dijamin tidak akan mengganggu kecepatan loading halaman blog kamu. (mungkin sedikit kali ya, soalnya saat saya tes di blog ini gak terasa bedanya).

Cara menambahkan icon pada menu wordpress tanpa plugin

Pada tutorial kali ini kita akan menggunakan icon dari font awesome secara gratis. Ya, kita bisa memilih icon-icon yang sesuai dengan tema atau judul menu dari blog yang ingin kita customisasi.

Pertama silahkan buka situs fontawesome.com/icon untuk memulai pencarian icon yang anda inginkan. Sebagai contoh saya akan cari icon ‘Home’ untuk saya tambahkan pada menu Home di blog ini.

fontawesome wordpress icon

Maka akan ditampilkan beberapa icon yang sesuai dengan kata kunci atau keyword yang anda masukkan tadi. Pilih salah satu yang anda inginkan dengan mengklik pada icon tersebut.

Dan ini tampilan setelah kita klik salah satu icon tersebut.

wordpress icon code

Copy code yang ditampilkan, selanjutnya bisa kita gunakan pada pengaturan menu di dashboard wordpress kita.

Pengaturan menu di dashboard wordpress

Setelah kita copy code yang diperoleh dari situs fontawesome, selanjutnya kita masuk ke pengaturan menu melalui halaman dashboard wordpress.

Silahkan login ke halaman dashboard wordpress (wp-login), kemudian masuk ke menu Appearance – Menu seperti yang ditampilkan pada gambar berikut.                                                                                                                                                                     pengaturan menu wordpress

Pada menu structure, klik pada judul menu blog anda yang ingin ditambahkan icon. Selanjutnya paste kan code yang anda dapatkan tadi tepat di depan judul menu (pada kolom ‘navigation label’).

Pada contoh kali ini, saya tambahkan code icon yang saya dapatkan tadi di depan ‘Home’.

cara menambahkan icon di menu wordpress

Note: code asli (fas fa-home) saya rubah menjadi (fa fa-home) karena background dari table menu di blog saya berwarna gelap. Jika tidak dirubah, maka tidak akan kelihatan (sama-sama hitam). Namun jika warna background dari table menu di blog anda putih/terang, maka biarkan codenya tetap pakai ‘s’ yang berarti ‘Solid’.

Lakukan pada semua judul menu yang ingin anda tambahkan icon. Tinggal cari icon yang sesuai, copy codenya, dan paste-kan tepat di depan judul menu (pada kolom ‘navigation label’).

Jangan lupa tekan tombol ‘Save Menu’ setelah melakukan perubahan. Coba buka halaman blog anda, maka tampilan menunya kini sudah berubah. Selamat.

PENTING:

  • Jika ada salah satu gambar icon yg tidak muncul setelah ditambahkan code pada pengaturan menu, coba ganti dengan icon yang lain (pilih aja icon lainnya). Ada kalanya code tersebut tidak bisa dipakai lagi atau error.

Demikian ulasan mengenai bagaimana cara menambahkan icon pada menu wordpress paling simple tanpa harus menginstall plugin. Semoga bermanfaat dan jangan lupa dishare yah…

Note: bagi anda yang membutuhkan customisasi icon pada menu wordpress secara professional, bisa mempertimbangkan untuk membeli plugin premium seharga $15 dari Codecanyon. Tersedia pengaturan yang lebih fleksible dan icon-icon premium lainnya. Silahkan lihat demonya melalui link berikut:

Demo WP Menu Icon dari Codecanyon

LEAVE A REPLY

Please enter your comment!
Please enter your name here