in

Apa itu WordPress Hooks ? Action Dan Filter

TokoDaring.Com – Apa Itu WordPress Hooks ? Hampir semua artikel kami yang membahas tentang bagaimana mengkustom website eCommerce WordPress dengan memanfaatkan hooks.

Bahkan kita bisa mengubah satu halaman login WordPress berubah secara signifikan seperti membuat sebuah halaman baru. padahal hanya dengan memasukan beberapa baris kode saja dengan mengkatrol hook dan sama sekali tidak membuat satu halaman login baru.

Lalu, apa itu WordPress Hooks ? Bagaimana cara menggunakannya ? Kapan dan kenapa harus di lakukan ?

Definisi apa itu WordPress hooks ?

Apa itu WordPress hooks ? WordPress hooks adalah sebuah fitur yang sediakan oleh WordPress untuk berinteraksi atau memodifikasi bagian lain dari WordPress di tempat yang telah ditentukan sebelumnya.

Anggaplah bahwa WordPress Hooks adalah fitur yang di sediakan oleh WordPress yang memungkinkan kita untuk memanipulasi prosedur standar WordPress tanpa harus melakukan perubahan pada file inti atau script WordPress secara langsung.

Sebuah hook dapat diterapkan baik untuk action (action hook) dan filter (filter hook). Bagi anda yang ingin mempelajari bagaimana memodifikasi atau mengkustom website WordPress, tentu penting untuk mengetahui bagaimana hook-hook tersebut bekerja.

Action dan Filter

WordPress hooks merupakan satu bagian penting dari WordPress yang di tujukan terutama untuk kalangan developer. Bahkan bagi siapapun yang mengembangkan atau membangun bisnis eCommerce menggunakan WordPress.

Hooks pada WordPress sangat erat kaitannya dengan Action dan Filter. Dalam industri tema dan plugin WordPress, Hooks merupakan fungsi yang dapat diterapkan ke dalam Action atau Filter.

Action dan Filter di WordPress merujuk pada fungsi yang dapat di modifikasi oleh developer tema dan plugin untuk mengubah, menambah atau mengurangi fungsi default WordPress. Namun, perlu dicatat bahwa action dan filter bukanlah hal yang sama.

Action adalah fungsi yang dilakukan ketika suatu event tertentu terjadi di WordPress. Sedangkan Filter memungkinkan kita untuk mengubah suatu fungsi.

Argumen yang digunakan untuk menghook action dan filter memang terlihat sama. Tetapi sebenarnya memiliki tujuan yang berbeda.


Untuk lebih dapat menerima tentang apa itu WordPress hooks dan tujuannya untuk pengembangan tema dan plugin adalah contoh kasus dan script berikut :

Misalnya, sebuah website atau blog yang ingin menampilkan iklan google adsense di dalamnya, tentunya harus memasukan kode adsense ke dalam WordPress. Dan google mengharuskan agar kode adsense tersebut untuk di letakan di dalam header website (wp_head).

<head>
<script data-ad-client="ca-pub-xxxxxxxxxxxxxxxx" async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>

</head>

Masalahnya website WordPress sangat bergantung pada tema yang masih di maintain oleh pihak pengembang tema. Ketika anda menambahkan kode adsense tersebut langsung pada file header, itu sangat beresiko kode tersebut hilang ketika terdapat update dari pengembang tema.

Maka WordPress menyediakan tempat atau yang di sebut dengan hook agar anda bisa menambahkan kode iklan tersebut ke dalam WordPress tanpa harus merubah susunan script file header (<head> dan </head>).

Jika memanfaatkan hook wp_head maka kode adsense tersebut akan di tuliskan dengan cara berikut.

// kode google adsense

add_action('wp_head','kode_adsense', 20);
function kode_adsense() { ?>
<script data-ad-client="ca-pub-xxxxxxxxxxxxxxxx" async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<?php
}

Tentu anda masih perlu untuk mengakses folder dan file hosting lalu menulisnya ke dalam file function. Bagi kalangan non developer, mengakses langsung file header.php atau menulis kode menggunakan hook tentu menyulitkan dan sama susahnya.

Maka dalam industri pengembangan tema dan plugin WordPress, para developer memanfaatkan hook tersebut untuk membuat sebuah software atau biasa di sebut plugins.

Contohnya adalah plugin insert header & footer yang memanfaatkan hook tersebut. Lalu membuat interface di dalam dashboard WordPress. Dan orang-orang bisa memasukan kode adsense secara mudah hanya dengan mengcopy dan paste kode adsense tersebut ke dalam kotak snippet.


WordPress Hooks

Ada dua jenis Hook di WordPress, yaitu : Action dan Filter. Untuk menggunakannya, anda perlu untuk menulis fungsi kustom yang dikenal sebagai Callback, lalu mendaftarkannya dengan hook WordPress menggunakan action atau filter.

Action Hooks

Action hooks memungkinkan untuk menambahkan data atau mengubah cara kerja WordPress. Action hooks akan berjalan pada titik tertentu untuk mengeksekusi file inti, plugin, dan tema.

Fungsi callbacknya dapat melakukan beberapa jenis tugas, seperti membuat output ke pengguna atau memasukan data ke dalam database WordPress.

Filter Hooks

Sedangkan Filter hook memberi kemampuan untuk mengubah data ketika melakukan eksekusi file inti WordPress, plugin, ataupun tema.

Fungsi callbacknya akan menerima variabel, memodifikasi, dan mengembalikannya lagi. Hook filter dimaksudkan untuk bekerja secara terisolasi, dan tidak boleh memiliki efek yang mempengaruhi variabel dan output global.

Perbedaan action hook dan filter hook

Action hook akan mengambil informasi yang diterima, lalu melakukan sesuatu tanpa mengembalikan apa pun. Dengan kata lain Action hook bekerja pada sesuatu dan kemudian keluar, tanpa mengembalikan apa pun ke kait panggilan.

Action hook menginterupsi proses kode yang berjalan lalu melakukan sesuatu, dan kemudian kembali ke proses normal tanpa mengubah apa-apa.

Pada contoh kode adsense di atas yang menggunakan action hooks, maka iklan adsense dapat tampil tanpa merubah proses apapun pada file WordPress, tema ataupun plugin.

Sedangkan Filter hook mengambil info yang diterima, memodifikasinya, dan mengembalikannya. Dengan kata lain, Filter hook akan menyaring sesuatu dan meneruskannya kembali ke hook untuk digunakan lebih lanjut.

Filter hook digunakan untuk memodifikasi sesuatu dengan cara tertentu dan hasilnya seperti tujuan dari modifikasi tersebut.

Contoh script berikut memfilter hook the_content. Hasilnya adalah membuat tombol WhatsApp di atas setiap artikel. Dan tombol tersebut dapat di gunakan untuk melakukan share.

add_filter('the_content', 'like_and_share_artikel');
function like_and_share_artikel($content) {
    global $post;
    if(is_singular('post')) {
        $siteURL = urlencode(get_permalink());
		$JudulPost = htmlspecialchars(urlencode(html_entity_decode(get_the_title(), ENT_COMPAT, 'UTF-8')), ENT_COMPAT, 'UTF-8');
		$whatsappURL = 'whatsapp://send?text='.$siteURL;
		$variable .= '<div class="tokodaring-social-share">';
		$variable .= '<h2 style="text-decoration:underline;" >Like & Share artikel ini :</h2>';
		$variable .= '<br />';
		$variable .= '<a class="link whatsapp" href="'.$whatsappURL.'" target="_blank">Share via WA</a>';
		$variable .= '</div>';
		return $variable.$content;
		}else{
		    return $variable.$content;
	}
};

Hook pada tema dan plugin WordPress

Selain WordPress, tema website dan plugin juga memiliki hook. Secara fungsi dan tujuan memiliki fungsi yang sama. Yaitu dapat mengubah fungsi, baik menambah atau mengurangi.

Ketika anda mengaitkan pada WordPress hooks maka itu akan merubah fungsi dan fitur dari WordPress.

Sedangkan ketika anda mengaitkannya pada hook tema atau plugin, maka itu akan merubah atau memodifikasi kemampuan dari tema atau plugin tersebut.

Tujuan WordPress hooks

Setelah mengetahui apa itu WordPress hooks. Lalu apa tujuan WordPress hook, tema atau hook plugin ?

Tidak lain adalah untuk menjalankan fungsi secara otomatis untuk tujuan seperti di jelaskan di atas. Yaitu untuk merubah, menjalankan perintah baru atau menambahkan data ke dalam database.

Selain itu, teknik ini juga memiliki kemampuan untuk memodifikasi, memperluas, atau membatasi fungsionalitas suatu tema atau plugin.

Jika contoh kode adsense di atas adalah untuk menambah fungsi yaitu menampilkan iklan dari pihak ketiga. Maka hook juga bisa di manfaatkan untuk merubah atau menonaktifkan fitur yang tidak anda inginkan.

Menonaktifkan atau membatasi fitur plugin

Contoh berikut adalah bagaimana memanfaatkan hook dari plugin WooCommerce untuk menonaktifkan cart_fragment di setiap halaman non WooCommerce.

// wcOptimization
add_action('wp_enqueue_scripts', 'remove_cart_fragments', 11);
function remove_cart_fragments() {
    if(is_page(array(10, 11, 12, 13, 15)) || is_singular('post')) {
        wp_dequeue_script('wc-cart-fragments');
    }
}

Contoh di atas, terdapat fungsi / callback remove_cart_fragments dengan aksi wp_enqueue_script.

Hook wp_enqueue_script akan memasukan fungsi atau style baru ke dalam antrian proses. Kode di atas akan menghapus skrip atau style yang sudah di antrekan sebelumnya yakni wc-cart_fragments WooCommerce melalui wp_dequeue_script('wc-cart-fragments').

Hasil dari fungsi di atas adalah cart_fragment WooCommerce tidak akan berjalan di setiap halaman yang bukan milik WooCommerce.

Cart fragment WooCommerce adalah skrip ajax untuk memperbarui keranjang belanja tanpa merefresh sebuah halaman. Pada halaman selain WooCommerce, hal ini tentu tidak perlu di lakukan karena justru dapat memperlambat kinerja loading website.

Cart fragment WooCommerce

Menonaktifkan atau membatasi fitur inti WordPress

WordPress banyak membawa fitur-fitur untuk memudahkan user menerbitan konten (publishing). Namun kami yakin tidak semua fitur tersebut di perlukan, terutama jika anda menggunakan WordPress sebagai website bisnis.

Misalnya fitur feed rss, kita bisa me-nonaktifkan feed dengan membuat fungsi callback dan mengaitkan ke beberapa hook feed.

Biasanya feed secara default bisa di akses pada url https://tokodaring.com/feed/. Jika anda tidak menginginkan WordPress untuk menghasilkan feed, maka itu bisa di non-aktifkan dengan script berikut :

// Menonaktifkan Feed
function tkdr_disable_feed() {
    wp_die(__('Kami tidak menyediakan feed, Mohon kunjungi halaman homepage kami !!!'));
}
add_action('do_feed', 'tkdr_disable_feed', 1);
add_action('do_feed_rdf', 'tkdr_disable_feed', 1);
add_action('do_feed_rss', 'tkdr_disable_feed', 1);
add_action('do_feed_rss2', 'tkdr_disable_feed', 1);
add_action('do_feed_atom', 'tkdr_disable_feed', 1);
add_action('do_feed_rss2_comments', 'tkdr_disable_feed', 1);
add_action('do_feed_atom_comments', 'tkdr_disable_feed', 1);

Nah sudah tau apa itu WordPress hooks ? Juga tujuan wordpress hooks ? WordPress ternyata menyediakan banyak hook yang dapat di manfaatkan. Ini akan membantu anda mengkontrol sendiri fungsi, fitur atau kemampuan website eCommerce anda sesuai dengan produk yang anda jual.

List lengkap WordPress hooks bisa di lihat di halaman https://developer.wordpress.org/reference/hooks/.

WooCommerce hooks

Selain WordPress, WooCommerce juga membawa segudang hooks untuk di manfaatkan mengkustom website eCommerce yang anda kelola.

Lihat selengkapnya tentang daftar hooks WooCommerce pada artikel terpisah ini.


Tentang TokoDaring [impresum]

TokoDaring.Com adalah ‘media online’ dengan artikel-artikel yang praktis di bidang ecommerce. Kami menulis dengan bahasa yang menyenangkan dan mudah di pahami. Mulai dari teknologi, platform dan update, hingga secara teknis bagaimana mendesain dan memaksimalkan website ecommerce untuk dapat membantu orang-orang yang baru memulai atau sudah ada pada bisnis online.

Unit usaha TokoDaring.Com adalah sebagai penyuplai bahan makanan untuk usaha kuliner (daging, sayur, buah, bumbu & rempah) yang melayani pembelian kebutuhan suplai b2b kerjasama antar usaha (restoran/kafe/hotel/katering/kuliner/rumah sakit). Produk pesanan akan di antarkan langsung ke dapur produksi usaha tanpa ada biaya pengiriman (gratis ongkir).

Divisi kreatif TokoDaring.Com melayani order pembuatan website, cetak digital, food & video photography. Hingga platform untuk promosi bisnis via halaman business listing.

Written by TokoDaring

TokoDaring.Com | Where Cooking & Coding are Met!!! We Make F & B Commerce More Fun!!!

custom halaman login wordpress

Custom Halaman Login WordPress eCommerce Agar Terlihat Menarik

daftar hooks woocommerce

Daftar Hooks WooCommerce, WooCommerce Hooks