Cara Mudah Menambahkan Notifikasi Tab Browser di WordPress

Apakah Anda ingin menambahkan pemberitahuan tab browser untuk situs web Anda?

Menambahkan notifikasi tab browser dapat menjadi cara yang bagus untuk menarik kembali perhatian pengguna, dapat menurunkan tingkat pengabaian keranjang, serta meningkatkan penjualan dan pendapatan.

Pada artikel ini, kami akan menunjukkan cara menambahkan notifikasi tab browser di WordPress.

Cara Menambahkan Notifikasi Tab Browser di WordPress

Apa itu Pemberitahuan Tab Browser?

Notifikasi tab browser adalah saat Anda mengubah sesuatu pada tab untuk situs web Anda saat pengguna berfokus pada situs lain di browser mereka.

Dengan menambahkan fitur notifikasi tab browser di Situs web WordPressAnda dapat menarik perhatian pengguna saat mereka membuka tab lain untuk meninggalkan halaman Anda.

Misalnya, Anda dapat mengubah favicon situs web Anda, menghidupkannya, menulis pesan khusus, atau hanya mem-flash tab.

Jika Anda memiliki toko online, notifikasi tab browser benar-benar dapat membantu Anda. Notifikasi ini akan mengembalikan pelanggan yang terganggu, menurunkan tingkat pengabaian keranjang, dan meningkatkan keterlibatan pelanggan.

Dengan menggunakan fitur ini, Anda dapat mengingatkan pelanggan Anda tentang pengabaian keranjang atau bahkan menawarkan diskon jika mereka mengembalikan perhatian mereka ke situs Anda.

Berikut adalah contoh notifikasi tab browser.

Contoh notifikasi tab browser gif

Karena itu, kami akan menunjukkan kepada Anda cara menambahkan tiga jenis pemberitahuan browser yang berbeda ke WordPress.

Instal WPCode untuk Menambahkan Notifikasi Tab Browser

Anda dapat dengan mudah menambahkan pemberitahuan tab browser di situs Anda dengan menambahkan kode khusus di WordPress. Biasanya, Anda harus mengedit file functions.php tema Anda, tetapi itu dapat merusak situs web Anda bahkan dengan kesalahan kecil.

Itu sebabnya kami merekomendasikan menggunakan WPCodeplugin cuplikan kode teraman dan terpopuler, digunakan oleh lebih dari 1 juta situs web.

Pertama, Anda perlu menginstal dan mengaktifkan plugin WPCode gratis. Untuk detail lebih lanjut, Anda dapat melihat panduan langkah demi langkah kami di cara install plugin wordpress.

Setelah Anda mengaktifkan plugin, cukup buka Cuplikan Kode » Semua Cuplikan di panel admin WordPress Anda.

Buka Cuplikan Kode, klik Tambah Baru

Cukup klik tombol ‘Add New’, yang kemudian akan membawa Anda ke halaman ‘Add Snippet’.

Sekarang, arahkan kursor ke opsi ‘Tambahkan Kode Kustom Anda (Cuplikan Baru)’ dan klik tombol ‘Gunakan Cuplikan’ di bawahnya.

Cukup klik tombol Gunakan Cuplikan

Plugin kemudian akan membawa Anda ke halaman ‘Buat Cuplikan Kustom’.

Apa pun jenis notifikasi tab browser yang Anda gunakan, Anda akan memasukkan kode di bawah menggunakan halaman ini.

Buat halaman Cuplikan Kustom

Ketik 1. Menampilkan Pembaruan Baru sebagai Pemberitahuan Tab Browser

Jika Anda menggunakan kode di bawah ini, pengguna Anda akan diberi tahu tentang pembaruan baru yang diposkan di situs Anda. Sebuah nomor akan muncul di tab untuk memberi tahu mereka berapa banyak item baru yang hilang.

Misalnya, jika Anda memiliki toko online dan Anda baru saja menambahkan beberapa produk baru ke inventaris, pengguna akan melihat notifikasi tab browser sebagai angka yang menunjukkan berapa banyak produk baru yang ditambahkan.

Anda dapat melihat ini pada gambar di bawah ini:

Pembaruan Baru sebagai pemberitahuan tab browser

Setelah Anda berada di laman ‘Buat Cuplikan Khusus’, Anda perlu memberi nama cuplikan Anda. Anda dapat memilih apa pun yang membantu Anda mengidentifikasi kode. Ini hanya untukmu.

Selanjutnya, Anda akan memilih ‘Jenis Kode’ dari menu drop-down di sebelah kanan. Ini adalah kode JavaScript, jadi cukup klik opsi ‘JavaScript Snippet’.

Pilih JavaScript sebagai Jenis Kode

Kemudian, yang harus Anda lakukan adalah menyalin dan menempelkan cuplikan kode berikut ke area ‘Pratinjau Kode’.

biarkan hitung = 0; judul const = dokumen.judul; function changeTitle() { hitung++; var newTitle=”(” + hitung + ‘) ‘ + judul; document.title = newTitle; } function newUpdate() { const update = setInterval(changeTitle, 2000); } document.addEventListener(‘DOMContentLoaded’, PembaruanBaru);

Salin dan tempel kode JavaScript

Setelah Anda menempelkan kode, gulir ke bawah ke bagian ‘Penyisipan’. Anda akan menemukan dua pilihan: ‘Auto Insert’ dan ‘Shortcode.’

Cukup pilih opsi ‘Sisipkan Otomatis’, dan kode Anda akan secara otomatis dimasukkan dan dijalankan di situs Anda.

Anda dapat menggunakan metode ‘Kode pendek’ jika Anda hanya ingin menampilkan pembaruan baru pada halaman tertentu tempat Anda menambahkan kode pendek.

Pilih mode penyisipan

Setelah Anda memilih opsi Anda, kembali ke bagian atas halaman.

Klik sakelar dari ‘Tidak Aktif’ ke ‘Aktif’ di sudut kanan atas, lalu cukup klik tombol ‘Simpan Cuplikan’.

Simpan cuplikan kode Anda

Setelah itu selesai, cuplikan kode khusus Anda akan ditambahkan ke situs Anda dan mulai berfungsi.

Ketik 2. Mengubah Favicon sebagai Pemberitahuan Tab Browser

Dengan metode ini, Anda akan menampilkan favicon yang berbeda di tab browser situs Anda saat pengguna keluar dari tab lain.

SEBUAH favicon adalah gambar kecil yang Anda lihat di browser web. Sebagian besar bisnis akan menggunakan versi logo yang lebih kecil.

Favicon sebagai pemberitahuan browser web

Sekarang, untuk mengubah favicon pada tab browser Anda, kami akan menggunakan plugin WPCode.

Pertama, pergi ke Cuplikan Kode » Semua Cuplikan di panel admin WordPress Anda dan kemudian klik tombol ‘Tambah Baru’.

Selanjutnya, arahkan kursor ke opsi ‘Tambahkan Kode Kustom Anda (Cuplikan Baru)’ dan klik tombol ‘Gunakan Cuplikan’ di bawahnya

Ini akan membawa Anda ke halaman ‘Buat Cuplikan Kustom’. Anda dapat memulai dengan memasukkan judul untuk cuplikan kode Anda.

Sekarang cukup pilih ‘Jenis kode’ dari menu tarik-turun di sebelah kanan. Untuk cuplikan kode ini, Anda harus memilih opsi ‘Snippet HTML’.

Pilih HTML sebagai Jenis Kode Anda

Setelah Anda selesai melakukannya, cukup salin dan tempel kode berikut di ‘Pratinjau Kode.’

.

Sumber Artikel

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *