Sorotan Plugin Divi: Divi Icons Pro

Divi Icons Pro adalah plugin pihak ketiga yang menambahkan lebih dari 2500 ikon dan beberapa fitur terkait ke Divi Builder. Muncul dengan beberapa opsi pembelian dan bahkan menyertakan opsi gratis dengan lebih dari tiga ratus ikon khusus. Dalam sorotan plugin Divi ini, saya akan melihat edisi pro dari plugin dan melihat apa yang dapat dilakukannya.

Tentang Divi Icons Pro

Divi Icons Pro menambahkan banyak fitur ikon baru ke Divi termasuk:

• Lebih dari 2500 ikon baru
• 360 ikon gaya garis kustom
• 1295 Font Ikon mengagumkan dalam 74 kategori dan 4 gaya masing-masing
• 900 ikon Desain Material dalam 16 kategori dan 5 gaya masing-masing
• Integrasi Divi Builder
• Fitur pencarian ikon di modul Divi
• Filter ikon di modul Divi untuk dipilih berdasarkan keluarga atau ketik nama ikon

Ikon terintegrasi ke dalam pembuat Divi dan berfungsi sama seperti ikon asli Divi sehingga Anda dapat menatanya dengan modul Divi apa pun yang menggunakan ikon. Sama seperti ikon apa pun di pembuat Divi, Anda dapat menyesuaikan warna dan ukuran, mengatur tempat tampilannya dengan kontrol modul, dan menambahkan lingkaran atau batas.

Instalasi Pro Ikon Divi

Buka zip file unduhan. Di dalam, Anda akan menemukan plugin dan instruksinya. Unggah dan aktifkan plugin seperti biasa.

Aktifkan API Key dengan masuk ke Settings > Divi Icons PRO Activation di menu dashboard. Anda sekarang dapat menggunakan versi pro dari plugin. Ikon secara otomatis terintegrasi ke dalam Divi Builder, jadi tidak ada lagi yang perlu Anda lakukan kecuali Anda ingin menyesuaikan pengaturan default dalam opsi tema.

Divi Icons Pro Opsi Tema Divi

Ikon diaktifkan secara default, tetapi Anda dapat mengaktifkan atau menonaktifkan kelompok ikon yang Anda inginkan dan memilih cara memuatnya ke situs web. Tab Divi Icons Pro baru ditambahkan ke Opsi Tema Divi. Di sini, Anda dapat memilih keluarga ikon yang ingin Anda gunakan. Anda juga dapat memilih untuk memuat Font Awesome dan Google Material Icon Fonts dari CDN.

Divi Ikon Pro Ikon

Ikon, filter, dan fitur pencarian secara otomatis ditambahkan ke modul Divi yang menggunakan ikon. Ini adalah tiga modul uraian yang menampilkan ikon dari Ikon Gaya Garis, Font Awesome, dan Ikon Desain Material.

Pencarian Pro Ikon Divi

Fitur pencarian memungkinkan Anda menggunakan kata-kata intuitif untuk menemukan ikon Anda. Anda tidak perlu tahu nama ikonnya. Cukup masukkan kata kunci yang ingin Anda cari dan ikon muncul di area pemilihan ikon. Anda dapat mempersempit pencarian Anda berdasarkan merek jika Anda mau dengan memilih merek di filter. Beberapa ikon tidak muncul di hasil pencarian, jadi pencariannya tidak sempurna, tetapi bekerja dengan cukup baik. Beberapa ikon dari Font Awesome dan Material Icons mungkin tidak dinamai dengan baik.

Filter Pro Ikon Divi

Anda dapat memfilter ikon atau melihat semuanya. Filter menampilkan ikon dari merek atau keluarga tertentu. Untuk melihat merek tertentu, cukup klik tombol dengan label merek yang ingin Anda lihat. Ini akan menyaring semua ikon lainnya. Contoh ini menunjukkan contoh kecil Ikon Tema Elegan.

Berikut adalah contoh Ikon Gaya Garis. Mereka lebih tipis dari ikon lainnya, sehingga mereka cenderung bekerja lebih baik sendiri. Saya memang mencobanya dengan yang lain dan mereka bekerja bersama dalam beberapa kasus. Ada baiknya mencoba melihat apa yang cocok untuk Anda. Ikon dirancang dengan baik dan merupakan beberapa favorit saya di antara merek.

Berikut adalah contoh kecil ikon Font Awesome.

Berikut adalah contoh kecil dari Ikon Desain Material.

Contoh Divi Icons Pro

Untuk contoh ini, saya telah mengganti gambar di layout Resort dengan Line Style Icons. Saya telah mengaturnya menjadi biru dan mengubah ukurannya menjadi 48 piksel. Ikon tampak hebat dalam tata letak.

Dalam hal ini, saya telah mengubah lokasi ikon dari atas ke kiri. Saya juga telah mengubah ukuran menjadi 30px dan menambahkan 50px padding ke tengah setiap uraian.

Dalam contoh ini, saya mengganti modul media sosial di footer dengan uraian sehingga saya dapat memilih ikon saya sendiri dan menatanya. Semua ini dari Font Awesome. Saya telah mengatur warna agar sesuai dengan branding jaringan, mengubah ukurannya menjadi 52px, dan menambahkan padding 30px ke sisi kanan untuk memusatkannya.

Kali ini, saya telah mengubah ikon menjadi putih dan membuat latar belakang menjadi warna bermerek. Saya telah menambahkan bayangan kotak dan menambahkan beberapa bantalan untuk memusatkan ikon. Saya juga menambahkan padding ke tombol oranye untuk memperlebarnya sehingga cocok dengan lebar ikon sosial. Ikon menyatu dengan baik dengan desain tata letak.

Yang ini menggunakan tata letak Perbaikan Rumah. Saya telah mengganti gambar dengan uraian dan kombinasi ikon menggunakan keluarga font yang berbeda. Mereka diatur untuk ditampilkan di sebelah kiri uraian. Ikonnya berukuran 50px. Anda dapat melihat dalam contoh ini bahwa saya mencari ikon Font Awesome untuk "cat".

Ini sudah uraian dengan ikon, jadi saya hanya memilihnya, mencari topik yang sama, dan memilih ikon yang berbeda.

Yang ini menambahkan lingkaran ke ikon. Saya telah membuat lingkaran putih agar sesuai dengan latar belakang tata letak dan membuat warna lingkaran cocok dengan ikon.

Ikon berfungsi dengan tombol, tetapi tidak ditampilkan di Visual Builder. Mereka bekerja dengan baik di situs web yang sebenarnya.

Inilah ikon di tombol di dalam tata letak. Ini bekerja dengan baik.

Berikut tampilan lebih dekat sehingga Anda dapat melihat tampilannya di tombol.

Dalam contoh ini, saya mengganti gambar dengan uraian di dalam tata letak Paralegal. Saya mencari ikon yang sesuai dengan topik dan, dengan pengecualian ikon uang, menggunakan warna dari grafik aslinya.

Untuk contoh ini, saya mengganti gambar di tata letak Butcher dengan ikon. Saya menggunakan warna merah dari teks judul dan mengatur ukuran font ikon ke 84px.

Saya menambahkan warna latar belakang dan bayangan kotak ke setiap uraian. Itu tampak hebat dalam tata letak. Saya mengarahkan kursor ke uraian di tengah untuk menunjukkan efek melayangnya. Itu naik di atas yang lain dan konten, termasuk ikon, bergeser ke kanan.

Divi Icons Pro Harga

Ada beberapa opsi pembelian berdasarkan berapa banyak situs yang ingin Anda gunakan dengan plugin. Mereka termasuk dukungan 6 bulan dan pembaruan seumur hidup. Anda dapat membeli Divi Icon Pro dari situs web pengembang.

• Lisensi reguler (1 situs) – €25.00
• Lisensi yang diperpanjang (situs tidak terbatas) – €65.00

Ada juga versi gratis yang menyertakan ikon gaya garis 360. Itu tidak termasuk dukungan atau pembaruan.

Dokumentasi Divi Icon Pro

Dokumentasi disertakan dalam file unduhan, tetapi Anda juga dapat mengaksesnya secara online. Dokumentasinya dirinci dan memandu Anda dalam menginstal plugin dan menggunakan ikon dan fitur. Ini juga mencakup FAQ dan tautan untuk mendapatkan dukungan. Tautan mencakup komunitas Divi di media sosial dan akun Anda dengan tautan untuk membuat tiket dukungan.

Mengakhiri Pikiran

Plugin ikon adalah cara termudah untuk menambahkan ikon baru ke Divi Builder dan Divi Icons Pro semudah yang didapat. Ini mencakup banyak ikon dan Anda dapat mengaktifkan atau menonaktifkan merek ikon tertentu untuk memiliki kontrol lebih besar atas apa yang muncul di modul. Saya suka fitur filter dan pencarian. Saya dapat menemukan ikon untuk setiap topik yang saya kerjakan.

Satu-satunya masalah yang saya miliki adalah ikon tidak ingin ditampilkan di tombol saat menggunakan Visual Builder, tetapi itu berfungsi dengan baik di Classic Builder dan mereka muncul dengan baik di situs web. Beberapa ikon tidak muncul di hasil pencarian, tapi saya pikir itu lebih merupakan masalah bagaimana ikon diberi nama oleh pengembang ikon. Masalah ini kecil dan tidak akan menghalangi saya untuk menggunakan atau merekomendasikan plugin.

Divi Icons Pro mudah digunakan dan menambahkan banyak ikon baru dengan hampir tanpa usaha. Jika Anda tertarik untuk menambahkan lebih banyak ikon ke pembuat Divi, Divi Icons Pro dapat digunakan.

Kami ingin mendengar dari Anda. Sudahkah Anda mencoba Divi Icon Pro? Beri tahu kami pendapat Anda tentang hal itu di komentar.

Gambar Unggulan melalui VectorsMarket / shutterstock.com