Cara Menambahkan Ikon Media Sosial ke Menu WordPress
Diterbitkan: 2020-10-24Terlepas dari apakah Anda menjalankan bisnis atau situs pribadi, Anda perlu memastikan bahwa pengguna dapat membagikan konten Anda di media sosial. Itu sebabnya dalam posting ini, kami akan menunjukkan cara menambahkan ikon media sosial ke menu WordPress Anda .
Mengapa Menambahkan Ikon Media Sosial ke Menu WordPress?
Menurut penelitian terbaru, hampir 50% dari populasi global menggunakan setidaknya satu jejaring sosial. Menghubungkan situs Anda dengan Facebook atau menambahkan umpan Instagram ke situs web Anda adalah pilihan yang baik, tetapi ada hal lain yang dapat Anda lakukan untuk menumbuhkan kehadiran media sosial Anda. Menu adalah salah satu elemen paling menonjol di situs Anda. Selain itu, ini adalah salah satu hal pertama yang dilihat pengguna saat mereka mengunjungi situs Anda. Misalnya, lihat menu utama situs web kami.
Jadi untuk menyesuaikan situs Anda dan memaksimalkan saluran media sosial Anda, Anda dapat menambahkan ikon media sosial ke menu WordPress Anda. Selain itu, Anda dapat menampilkan ikon di area lain situs Anda yang mendukung widget seperti footer, sidebar, dan sebagainya.
Meskipun beberapa tema seperti Divi menyertakan beberapa opsi untuk menambahkan ikon media sosial ke menu, sebagian besar tema tidak dilengkapi dengan fitur ini. Dan WordPress juga tidak menyertakan fitur asli untuk menyertakan ikon di menu.
Jadi dalam posting ini, kami akan menunjukkan kepada Anda tiga metode untuk menambahkan ikon media sosial dengan mudah ke menu WordPress Anda .
Cara Menambahkan Ikon Media Sosial ke Menu WordPress Anda
Ada tiga cara utama untuk menambahkan ikon media sosial ke menu WordPress Anda:
- Dengan plugin
- QuadMenu
- Ikon Sosial WP
- Dari penyesuai tema
- Secara manual menggunakan ikon FontAwesome
Dalam panduan ini, kami akan menjelaskan setiap metode langkah demi langkah sehingga Anda dapat memilih yang paling Anda sukai.
1) Plugin
Menggunakan plugin adalah cara termudah untuk memasukkan ikon media sosial di menu Anda. Ada beberapa opsi di luar sana, jadi, untuk membuat hidup Anda lebih mudah, kami telah mencantumkan dua plugin terbaik yang dapat Anda gunakan.
1.1) QuadMenu
QuadMenu adalah alat terbaik untuk dengan mudah menyesuaikan dan membawa menu WordPress Anda ke tingkat berikutnya. Ini adalah plugin freemium. Ada versi gratis dengan fitur dasar dan tiga paket premium yang hadir dengan fitur yang lebih canggih dan dukungan prioritas.
Untuk menambahkan ikon media sosial ke menu Anda, Anda memerlukan versi premium. Jadi, mari kita lihat cara menginstalnya dan mengaktifkan plugin di situs Anda.
Instalasi dan Aktivasi
Pertama, Anda perlu membeli plugin dan mengunduh file ke desktop Anda. Kemudian, sebelum menginstalnya, Anda perlu menginstal versi gratis di situs Anda. Untuk melakukannya, buka dasbor WP Anda > Plugin > Add New . Kemudian, gunakan bilah pencarian dan cari QuadMenu. Setelah itu, tekan Instal dan kemudian Aktifkan .
Setelah aktivasi, gunakan file versi premium yang Anda unduh sebelumnya dan instal di situs Anda.
Setelah Anda mengaktifkan plugin, Anda perlu memverifikasi kunci lisensi Anda. Dari dasbor akun QuadMenu Anda, Anda akan melihat opsi lisensi.
Salin kunci dari sana dan tempel di bidang lisensi dengan alamat email terdaftar Anda untuk memverifikasi kunci Anda.
Plugin ini tersedia di toko kami, Envato, dan pasar Elegan, jadi gunakan menu tarik-turun untuk memilih opsi yang sesuai untuk pembelian Anda. Setelah memverifikasinya, Anda siap melakukannya.
Tambahkan ikon media sosial ke menu WordPress Anda dengan QuadMenu
QuadMenu berfungsi dengan tema gratis atau premium apa pun. Untuk demo ini, kita akan menggunakan GeneratePress tetapi prosesnya mirip dengan tema lainnya. Pertama, mari masuk ke pengaturan plugin dengan masuk ke QuadMenu > Options .
Di sana, Anda akan melihat beberapa opsi penyesuaian seperti:
- Menu Utama
- Responsif
- Tema bawaan
- Sesuaikan
- Sosial
- Ekspor Impor
Konfigurasikan opsi sosial
Dalam kasus kami, kami perlu menambahkan ikon media sosial ke menu utama kami. Jadi, kami akan memilih opsi Sosial .
Anda akan melihat beberapa opsi default yang dapat Anda edit atau hapus tergantung pada saluran yang Anda miliki. Mereka telah menetapkan ikon dengan profil media sosial.
Namun, Anda juga dapat menyesuaikannya dengan mengklik tombol + Tambahkan Ikon . Selain itu, Anda dapat menambahkan saluran media sosial baru dengan menekan tombol + .
Katakanlah Anda ingin mengubah ikon Facebook. Tekan + Tambahkan ikon dan Anda akan melihat pop-up dengan banyak ikon yang dapat Anda pilih.
Ada banyak ikon jadi kami sarankan Anda menggunakan fitur pencarian untuk memfilter hasil.
Seperti yang Anda lihat, kami telah mencari ikon Facebook. Ini akan menunjukkan kepada Anda semua ikon yang tersedia terkait dengan permintaan pencarian Anda, jadi pilih yang Anda suka dan simpan. Anda juga dapat mengubah judul dan URL. Setelah Anda membuat semua perubahan yang Anda inginkan di QuadMenu, simpan pengaturannya.
Setelah itu, masuk ke menu WordPress. Anda akan melihat semua menu yang tersedia di sana. Untuk menggunakan opsi QuadMenu pada menu Anda, Anda harus menandainya sebagai QuadMenu Dev di bawah Pengaturan Menu . Setelah itu simpan menu tersebut.
Pada pemuatan halaman berikutnya, Anda akan melihat opsi QuadMenu.
Di bawah item QuadMenu, Anda akan melihat daftar ikon Sosial . Pilih mereka dan tekan Tambahkan ke Menu .
Setelah itu, Anda akan melihat bagian Sosial di bawah opsi Menu Utama. Arahkan mouse Anda ke atas dan Anda akan melihat opsi penyesuaian QuadMenu.
Jika Anda memerlukan penyesuaian tambahan, pilih opsi itu. Jika tidak, tekan tombol Simpan Menu dan Anda siap melakukannya.
Ikon pada menu (Frontend)
Sekarang, saatnya untuk memeriksa hasilnya. Jadi, buka beranda situs web Anda dan Anda akan melihat ikon sosial. Dan saat Anda mengarahkan kursor ke atasnya, ikon akan ditampilkan.
Itu dia! Anda telah berhasil menambahkan ikon media sosial ke menu WordPress Anda dengan QuadMenu .
1.2) Ikon Menu WP
Jika Anda tidak mampu membeli plugin premium, jangan khawatir. Kami punya solusi gratis untuk Anda. Di bagian ini, kami akan menunjukkan cara menambahkan ikon media sosial ke WordPress Anda dengan plugin gratis bernama WP Menu Icons.
Instalasi dan Aktivasi
Pertama, instal dan aktifkan Ikon Menu WP di situs Anda.
Alat ini sangat mudah digunakan dan tidak memerlukan penyesuaian tambahan.
Menyesuaikan Ikon Menu
Jika Anda tidak memiliki menu di situs Anda, Anda dapat membuatnya dari bagian konfigurasi.
Tetapkan lokasi ke menu Anda dan kemudian Anda siap untuk menambahkan item ke dalamnya. Untuk menambahkan profil media sosial Anda ke menu, pilih item Tautan Khusus . Anda harus memasukkan URL ke halaman yang ingin Anda tautkan dan labelnya. Kemudian, tekan Tambahkan ke Menu .
Setelah Anda menambahkan ikon ke menu, halaman konfigurasi akan terlihat seperti ini.
Demikian pula, Anda dapat menambahkan ikon media sosial lainnya. Dalam hal ini, kami telah menambahkan ikon Twitter, Pinterest, dan Instagram ke menu kami.
Pada item menu, ada tombol + . Itulah pengaturan yang perlu Anda gunakan untuk menambahkan ikon ke item menu, jadi klik itu.
Kemudian, Anda akan melihat banyak pilihan item untuk dipilih.
Ada puluhan ikon jadi gunakan fitur pencarian untuk memfilter hasil yang Anda inginkan. Dalam hal ini, kami telah memilih item menu Facebook, jadi kami akan mencari ikon Facebook. Setelah memilih yang Anda suka, Anda akan melihat pengaturan ikon di kolom kanan. Di sini Anda dapat menampilkan atau menyembunyikan label, menyesuaikan posisi, ukuran, dan perataan. Dalam hal ini, kita akan menyembunyikan labelnya. Setelah Anda selesai dengan penyesuaian, klik Simpan .
Anda dapat menyesuaikan ikon Pinterest, Twitter, dan Instagram dengan cara yang sama. Setelah menambahkan ikon yang diperlukan, simpan menu.
Sekarang saatnya untuk memeriksa hasilnya. Buka frontend situs web Anda dan Anda akan melihat ikon baru.
Begitulah cara Anda dapat menambahkan ikon media sosial ke menu header Anda di WordPress dengan WP Menu Icons . Terakhir, Anda juga dapat menata ikon Anda dari halaman pengaturan Ikon Menu WP.
2) Tambahkan Ikon Media Sosial dengan Penyesuai Tema
Jika Anda tidak ingin memasang plugin apa pun, Anda dapat menyertakan ikon media sosial di menu Anda menggunakan penyesuai tema Anda. Beberapa tema premium seperti Divi, Newspaper, atau Avada hadir dengan panel tema terintegrasi yang memungkinkan Anda menyesuaikan tema dan menambahkan ikon media sosial.
Jika Anda tidak yakin apakah tema Anda dilengkapi dengan opsi untuk menambahkan ikon media sosial, di dasbor WordPress Anda, buka Appearance > Customize > Menus > View Locations dan periksa apakah ada menu sosial atau opsi ikon sosial.
Untuk demonstrasi kami, kami akan menggunakan tema Divi dengan Tema Elegan. Pertama, buka dasbor WP Anda > Penampilan > Sesuaikan .
Lalu, pergi ke kustomisasi header dan elemen header. Di sana, Anda akan melihat opsi untuk mengaktifkan ikon sosial tajuk.
Aktifkan opsi itu dan Anda akan melihatnya di header situs web Anda.
Selain itu, Anda dapat menyesuaikannya dengan membuka Divi > Opsi Tema .
Di sana, Anda dapat mengaktifkan ikon yang Anda inginkan dan memasukkan URL profil media sosial Anda. Ikon media sosial akan muncul di header dan footer situs Anda secara default.
Namun, Anda dapat memilih untuk menyembunyikannya melalui pengaturan penyesuai.
Tema lain seperti Newspaper dan Newsmag memiliki opsi penyesuaian sendiri, sehingga Anda dapat mengaktifkan/menonaktifkan ikon dan menampilkannya langsung melalui panel tema khusus. Jika Anda tidak dapat menemukan bagian ikon media sosial di penyesuai tema atau panel, silakan tinggalkan komentar di bawah dan kami akan mencoba membantu Anda.
3) Menggunakan FontAwesome
Terakhir, Anda dapat menambahkan ikon media sosial ke menu Anda di WordPress secara manual. Bahkan jika Anda bukan seorang pengembang atau tidak memiliki keterampilan pengkodean, Anda dapat menampilkan ikon media sosial dengan sedikit pengkodean HTML. Untuk melakukannya, kita akan menggunakan ikon FontAwesome.
Jadi, hal pertama yang perlu Anda lakukan adalah pergi ke situs web FontAwesome.
Gunakan fitur pencarian untuk menemukan ikon yang Anda butuhkan. Untuk demo ini, kita akan mencari ikon Twitter .
Pada halaman berikutnya, situs web akan menampilkan hasil pencarian. Pilih salah satu yang paling Anda sukai.
Pada halaman berikutnya, Anda akan melihat detail ikon yang Anda pilih, jadi cukup salin kode HTML ikon tersebut.
Menambahkan Ikon Font Keren Ke WordPress
Kemudian, buka bagian menu di situs WordPress Anda. Di sisi kiri, Anda akan melihat bagian tautan khusus. Anda harus memasukkan URL ke profil Twitter Anda dan menempelkan kode HTML yang baru saja Anda salin di bidang Teks Tautan . Setelah Anda melakukannya, tekan Tambahkan ke Menu .
Setelah itu, simpan perubahannya. Kemudian, buka frontend situs Anda dan Anda akan melihat ikonnya.
Dengan cara ini, Anda dapat menambahkan ikon media sosial apa pun ke menu Anda .
Kode HTML tidak berfungsi
Jika Anda telah mengikuti setiap langkah dari tutorial ini tetapi HTML tidak berfungsi, coba ini. Jika kode fab tidak berfungsi, coba ubah kode HTML dengan menghapus b dari fab .
Jadi, misalnya, dalam kasus kami, kode HTML akhir akan terlihat seperti ini <i class=”fa fa-twitter”></i> alih-alih <i class=”fab fa-twitter”></i> . Contoh:
Tambahkan ikon media sosial ke header WordPress
Header adalah salah satu tempat paling populer di mana Anda mungkin ingin menambahkan ikon media sosial, jadi mari kita lihat bagaimana melakukannya menggunakan Penyesuai Tema.
Perhatikan bahwa Anda memerlukan tema yang memberi Anda opsi untuk menambahkan ikon media sosial ke menu. Juga, perlu diingat bahwa langkah-langkahnya mungkin sedikit berbeda tergantung pada tema Anda, tetapi Anda harus dapat mengikuti langkah-langkahnya tanpa masalah di sebagian besar tema.
Mari kita lihat dua opsi: membuat menu baru dan mengedit yang sudah ada.
Menambahkan ikon media sosial ke header di menu baru
- Di dasbor WordPress Anda, buka Penampilan> Menu
- Tekan tautan buat menu baru di sebelah tombol Pilih dan beri nama
- Sekarang Anda dapat menambahkan ikon ke dalamnya. Pilih menu baru dan masukkan media sosial dan URL yang ingin Anda sertakan (Instagram, Facebook, YouTube, dan sebagainya) dan tekan Tambahkan ke Menu
- Simpan perubahannya
- Setelah itu, letakkan menu yang baru saja Anda buat di bagian header
- Simpan perubahan dan hanya itu! Begitulah cara Anda menambahkan ikon media sosial ke header WordPress!
Menambahkan ikon media sosial ke header di menu yang ada
- Di dasbor WordPress Anda, buka Penampilan > Sesuaikan > Menu
- Pergi ke bagian Header dan tekan tombol Add item
- Kemudian pilih ikon platform media sosial yang ingin Anda tambahkan, masukkan URL, dan tekan Tambahkan ke Menu . Anda perlu melakukan hal yang sama untuk setiap media sosial yang ingin Anda tambahkan
- Pilih lokasi menu di mana Anda ingin menampilkan ikon. Pilihan yang Anda miliki akan tergantung pada tema Anda.
- Simpan perubahan. Itu dia!
Atau, jika Anda ingin menambahkan ikon ke footer, misalnya, ikuti proses yang sama tetapi pilih Footer sebagai lokasi ikon.
Bonus: Buka ikon media sosial di tab baru
Menambahkan ikon media sosial ke menu WordPress Anda akan membantu Anda mengembangkan kehadiran media sosial Anda. Namun, masalahnya adalah ketika pengguna mengklik ikon di menu Anda, halaman media sosial akan dimuat di jendela yang sama dan pengguna akan meninggalkan situs Anda. Solusinya adalah membuat ikon media sosial memuat halaman di tab baru. Mari kita lihat bagaimana melakukannya.
Di dasbor WordPress Anda, buka Appearance > Menus , buka Screen Options di kanan atas, dan aktifkan opsi Link Target . Kemudian, buka setiap elemen menu dan centang kotak Buka tautan di tab baru . Atau, Anda dapat mengatur setiap target ke _blank.
Terakhir, simpan perubahan dan selesai!
Bagaimana cara menambahkan umpan sosial ke situs Anda
Selain menambahkan ikon media sosial ke menu Anda, Anda juga dapat menambahkan umpan sosial ke situs Anda untuk meningkatkan keterlibatan dengan pengguna Anda. Di bagian ini, kami akan menunjukkan cara menghubungkan Instagram dan TikTok ke situs web Anda.
Tambahkan umpan Instagram ke WordPress
Cara termudah untuk menghubungkan Instagram dengan situs Anda adalah dengan menggunakan plugin Galeri Umpan Sosial. Ini adalah alat freemium yang memungkinkan Anda untuk menampilkan umpan Instagram Anda dalam beberapa klik.
Pertama, instal dan aktifkan plugin dari tautan ini. Kemudian, buka Galeri Umpan Sosial dan masuk ke akun Instagram Anda.
Setelah itu, buka Galeri Umpan Sosial > Akun , dan Anda akan memiliki opsi untuk masuk ke akun pribadi atau bisnis Anda (perlu diingat bahwa akun bisnis memiliki lebih banyak opsi). Kemudian, tambahkan akun, masuk, dan berikan aplikasi izin yang diperlukan untuk menghubungkan akun Anda ke WordPress.
Setelah selesai, buka tab Umpan , tekan +Umpan , dan tambahkan umpan yang ingin Anda tampilkan. Terakhir, sesuaikan umpan Anda dan setelah selesai, Anda akan melihat bahwa plugin memberi Anda kode pendek yang dapat Anda tempel di halaman atau pos mana pun untuk menampilkan umpan Anda.
Untuk informasi lebih lanjut, lihat panduan kami tentang cara mengintegrasikan Instagram dengan WordPress.
Tambahkan umpan TikTok ke WordPress
Demikian pula, Anda juga dapat menghubungkan situs Anda dengan TikTok. Untuk menampilkan umpan TikTok, kami akan menggunakan plugin khusus yang disebut WP TikTok Feed. Ini adalah plugin TikTok paling populer untuk WordPress dan memiliki versi gratis dan beberapa paket premium.
Setelah menginstal dan mengaktifkan plugin, di dasbor WordPress Anda, Anda perlu menautkan akun TikTok Anda dan kemudian pergi ke Tiktok Feed > Feeds . Di sana, tekan +Feed dan tambahkan feed yang ingin Anda tampilkan. Selain itu, Anda akan melihat beberapa opsi untuk menyesuaikan cara Anda menampilkan umpan di situs Anda.
Untuk informasi lebih lanjut tentang ini, lihat tutorial kami tentang cara menyematkan video TikTok di WordPress.
Kesimpulan
Secara keseluruhan, menambahkan ikon media sosial ke menu WordPress Anda adalah cara terbaik untuk meningkatkan kehadiran media sosial Anda. Dalam panduan ini, kita telah melihat 3 cara berbeda untuk melakukannya:
- Dengan plugin
- Dari penyesuai tema
- Secara manual
Jika tema Anda memungkinkan Anda untuk menambahkan ikon secara default, Anda tidak perlu menggunakan plugin atau kode HTML tambahan. Jika Anda lebih suka plugin, kami sarankan Anda menggunakan QuadMenu. Ini akan memungkinkan Anda untuk mendapatkan kontrol penuh dari seluruh kustomisasi menu WordPress Anda dan juga dilengkapi dengan banyak fitur canggih.
Namun, jika Anda lebih suka solusi gratis, lihat WP Menu Icons. Ini adalah alat sederhana yang akan membantu Anda memasukkan ikon sosial dalam waktu singkat.
Di sisi lain, jika Anda tidak ingin menginstal plugin apa pun, Anda dapat menambahkan ikon media sosial menggunakan sedikit ikon HTML dan FontAwesome. Opsi ini juga memungkinkan Anda untuk menyesuaikan ikon dengan sedikit CSS atau Anda dapat menghindari bagian penataan dan menggunakan ikon default.
Apakah Anda merasa artikel ini bermanfaat? Jika Anda melakukannya, tinggalkan kami komentar di bawah dan bagikan posting ini di media sosial. Untuk tutorial terkait lainnya, lihat panduan berikut:
- Plugin terbaik untuk menambahkan umpan media sosial ke WordPress
- Bagaimana cara menambahkan umpan grup Facebook ke WordPress