Cara Membuat Fitur Like/Dislike di WordPress Tanpa Plugin

Ingin menambahkan fitur like dan dislike di website WordPress kamu, tapi malas ribet dengan plugin? Tenang, kamu tidak sendirian! Banyak yang merasa plugin bisa memperlambat website atau malah menimbulkan masalah kompatibilitas. Kabar baiknya, kamu bisa menambahkan fitur interaktif ini tanpa plugin sama sekali.

Di artikel ini, kita akan membahas langkah demi langkah cara membuat fitur like dan dislike di WordPress secara manual. Yup, kamu tidak salah baca! Dengan sedikit kode dan panduan mudah dari kami, kamu bisa memberikan kontrol lebih kepada pengunjung untuk berinteraksi dengan kontenmu, dan itu semua tanpa harus menginstall plugin tambahan. Siap untuk meningkatkan engagement di website WordPress-mu? Yuk, langsung kita mulai!

Tutorial Fitur Like/Dislike di WordPress Tanpa Plugin

Memberikan opsi bagi pengunjung untuk memberikan reaksi terhadap konten di website adalah hal yang penting. Salah satu cara yang umum digunakan adalah fitur like dan dislike. Meskipun banyak plugin yang tersedia untuk menambahkan fitur ini di WordPress, namun Anda juga bisa membuatnya sendiri tanpa plugin.

Dalam tutorial ini, kita akan belajar cara menambahkan fitur like/dislike di WordPress tanpa plugin.

Langkah 1: Membuat Fungsi Like/Dislike

Pertama-tama, kita perlu membuat fungsi untuk menangani like dan dislike. Tambahkan kode berikut ke file functions.php di tema Anda:

<?php function wpb_likes_dislikes() { // Periksa apakah fitur sudah diaktifkan if ( get_option( 'wpb_likes_dislikes' ) == '1' ) { global $post; $post_id = $post->ID; // Mendapatkan jumlah like dan dislike $likes = get_post_meta( $post_id, 'likes', true ); $dislikes = get_post_meta( $post_id, 'dislikes', true ); // Menampilkan tombol like dan dislike echo '<div class="wpb-likes-dislikes">'; echo '<a href="#" class="like" data-post-id="' . $post_id . '"><i class="fa fa-thumbs-up"></i> <span class="count">' . $likes . '</span></a>'; echo '<a href="#" class="dislike" data-post-id="' . $post_id . '"><i class="fa fa-thumbs-down"></i> <span class="count">' . $dislikes . '</span></a>'; echo '</div>'; } } ?> 

 

Kode di atas akan membuat fungsi wpb_likes_dislikes(). Fungsi ini akan menampilkan tombol like dan dislike dengan jumlah like dan dislike saat ini.

Langkah 2: Mengaktifkan Fungsi

Selanjutnya, kita perlu mengaktifkan fungsi wpb_likes_dislikes() agar ditampilkan di website. Tambahkan kode berikut ke file functions.php:

<?php add_action( 'the_content', 'wpb_likes_dislikes' ); ?>

 

Kode di atas akan memanggil fungsi wpb_likes_dislikes() setelah konten postingan ditampilkan.

Langkah 3: Menangani Like dan Dislike dengan AJAX

Sekarang, kita perlu menangani klik pada tombol like dan dislike. Kita akan menggunakan AJAX untuk memperbarui jumlah like dan dislike tanpa memuat ulang halaman. Tambahkan kode berikut ke file functions.php:

<?php add_action( 'wp_ajax_wpb_likes_dislikes', 'wpb_likes_dislikes_process' ); add_action( 'wp_ajax_nopriv_wpb_likes_dislikes', 'wpb_likes_dislikes_process' ); function wpb_likes_dislikes_process() { // Memeriksa nonce if ( ! wp_verify_nonce( $_POST['nonce'], 'wpb-likes-dislikes-nonce' ) ) { die ( 'Unauthorized action.' ); } // Mendapatkan data dari AJAX request $post_id = $_POST['post_id']; $action = $_POST['action']; // Mendapatkan jumlah like dan dislike saat ini $likes = get_post_meta( $post_id, 'likes', true ); $dislikes = get_post_meta( $post_id, 'dislikes', true ); // Memperbarui jumlah like atau dislike if ( $action == 'like' ) { $likes++; update_post_meta( $post_id, 'likes', $likes ); } else if ( $action == 'dislike' ) { $dislikes++; update_post_meta( $post_id, 'dislikes', $dislikes ); } // Mengembalikan jumlah like dan dislike terbaru echo json_encode( array( 'likes' => $likes, 'dislikes' => $dislikes ) ); wp_die(); } ?>

 

Kode di atas akan membuat fungsi wpb_likes_dislikes_process(). Fungsi ini akan menangani permintaan AJAX dari tombol like dan dislike. Fungsi ini akan memperbarui jumlah like dan dislike di database dan mengembalikan jumlah terbaru ke JavaScript.

Langkah 4: Menambahkan JavaScript

Terakhir, kita perlu menambahkan JavaScript untuk mengirim permintaan AJAX saat tombol like dan dislike diklik. Tambahkan kode berikut ke file footer.php di tema Anda, tepat sebelum tag </body>:

<script> jQuery(document).ready(function($) { $('.wpb-likes-dislikes a').on('click', function(e) { e.preventDefault(); var $this = $(this), post_id = $this.data('post-id'), action = $this.hasClass('like') ? 'like' : 'dislike', nonce = ''; $.ajax({ url: '', type: 'POST', data: { action: 'wpb_likes_dislikes', post_id: post_id, action: action, nonce: nonce }, success: function(response) { var data = JSON.parse(response); $this.find('.count').text(data[action]); } }); }); }); </script>

 

Kode di atas akan mengirim permintaan AJAX ke server saat tombol like atau dislike diklik. Kode ini juga akan memperbarui jumlah like dan dislike di halaman web tanpa memuat ulang halaman.

Itulah cara menambahkan fitur like/dislike di WordPress tanpa plugin. Dengan mengikuti langkah-langkah di atas, Anda dapat memberikan opsi bagi pengunjung untuk memberikan reaksi terhadap konten Anda tanpa menggunakan plugin tambahan.

Catatan:

• Pastikan untuk mengganti wpb dengan prefix unik Anda sendiri untuk menghindari konflik dengan tema atau plugin lain.
• Anda dapat menyesuaikan tampilan tombol like dan dislike dengan menambahkan CSS Anda sendiri.
• Fitur ini hanya menghitung jumlah like dan dislike. Anda mungkin perlu menambahkan fitur lain, seperti sistem login, untuk mencegah pengguna memberikan like atau dislike beberapa kali.

Manfaat Menggunakan Fitur Like/Dislike di WordPress Tanpa Plugin

Fitur like/dislike telah menjadi elemen umum di berbagai platform daring, termasuk situs web dan blog. Meskipun WordPress tidak menawarkan fitur bawaan untuk ini, Anda dapat dengan mudah menambahkannya tanpa harus bergantung pada plugin. Menariknya, menggunakan fitur like/dislike tanpa plugin memiliki sejumlah manfaat yang patut dipertimbangkan.

Performa Website yang Lebih Cepat: Salah satu keuntungan utama menghindari plugin adalah menjaga performa website tetap optimal. Plugin tambahan dapat membebani situs Anda, menyebabkan waktu loading yang lebih lama. Dengan memilih solusi tanpa plugin, Anda membantu menjaga situs tetap ringan dan cepat, memberikan pengalaman pengguna yang lebih baik.

Keamanan yang Lebih Terjamin: Setiap plugin yang Anda tambahkan ke situs WordPress Anda berpotensi menimbulkan risiko keamanan. Plugin yang tidak terawat dengan baik atau berasal dari sumber yang tidak terpercaya dapat menjadi celah bagi peretas. Dengan tidak menggunakan plugin, Anda mengurangi risiko potensial ini dan meningkatkan keamanan situs Anda secara keseluruhan.

Fleksibilitas dan Kontrol Penuh: Solusi tanpa plugin memberi Anda fleksibilitas dan kontrol penuh atas desain dan fungsionalitas tombol like/dislike. Anda dapat menyesuaikan tampilan agar sesuai dengan tema situs Anda dan mengintegrasikannya dengan mudah ke dalam desain yang ada.

Kemudahan Implementasi: Meskipun terdengar teknis, menerapkan fitur like/dislike tanpa plugin relatif mudah, bahkan untuk pengguna WordPress pemula. Terdapat banyak tutorial dan panduan online yang memandu Anda melalui proses langkah demi langkah.

Analisis Data yang Lebih Akurat: Dengan solusi tanpa plugin, Anda dapat mengintegrasikan fitur like/dislike dengan alat analitik yang Anda gunakan, seperti Google Analytics. Hal ini memungkinkan Anda melacak interaksi pengguna dengan lebih akurat dan mendapatkan wawasan berharga tentang konten yang paling disukai audiens Anda.

Secara keseluruhan, meskipun plugin menawarkan kemudahan, menggunakan fitur like/dislike di WordPress tanpa plugin memberikan sejumlah manfaat penting. Dari peningkatan performa dan keamanan hingga fleksibilitas dan kontrol yang lebih besar, pendekatan ini layak dipertimbangkan untuk meningkatkan keterlibatan pengguna di situs WordPress Anda.