fbpx
Search
Generic filters
Exact matches only
Filter by Custom Post Type

Try these: dockerwebpackwordpressatomic csshackerrankmalaysia

WordPress Theme – Tìm Hiểu Action Hook và Filter Hook

Các anh em có bao giờ đã nghe qua khái niệm Event-Driven Programming ( lập trình hướng sự kiện ) trong WordPress chưa? Câu chuyện đó thực hư như thế nào thì chúng ta sẽ cùng làm rõ qua hai khái niệm Action và Filter Hook trong WordPress nhé 😹😹😹

hook wordpress

Vậy Action Hook và Filter Hook là gì?

Để làm rõ hai khái niệm trên chúng ta cần phải hiểu Hook là gì trước cái đã.

Theo WordPress định nghĩa mà mình hiểu được thì, Hook hay còn gọi là một điểm “móc” là một phương thức để các anh em có thể tương tác được với WordPress Core thông qua các theme hoặc plugin.

Có hai loại Hook đó là Action và Filter. Để sử dụng, chúng ta cần phải viết một custom function để Call Back và đăng ký với WordPress Core cho một Action hoặc Filter cụ thể.

WordPress cung cấp rất nhiều Hook có sẵn nhưng bên cạnh đó các anh em có thể tự tạo một cái riêng cho bản thân mình.

Action Hook

Action Hook hiểu nôm na như là một hành động sẽ được thực thi khi nó có lời gọi hàm từ một nơi nào đó trong theme của các anh em.

Ví dụ như: gán CSS link vào tag <head>chẳng hạn.

function add_css() {
   wp_enqueue_style( style, get_template_directory_uri() . '/style.css' );
}
add_action( 'wp_enqueue_scripts', 'add_css' );

Ở trên mình sẽ viết một hàm thêm CSS là add_css, trong hàm này mình sẽ sử dụng hàm wp_enqueue_style do WordPress quy định (xem thêm tại đây) để load CSS.

Để kết thúc hàm add_css này mình sẽ đăng ký hàm này với Hook wp_enqueue_scripts bằng lệnh add_action

Các Action Hook Cơ Bản:

  • add_action: thêm action vào Hook
  • remove_action: xoá action khỏi Hook
  • remove_all_actions: xoá tất cả các action khỏi Hook
  • has_action: kiểm tra sự tồn tại của action

Filter Hook

Filter Hook là một hàm dùng để kiểm soát một thứ gì đó đang xảy ra hoặc dùng để thay đổi nội dung tại một điểm khai báo nào đó.

Ví dụ điển hình đó là thay đổi text hoặc làm plugin dịch đa ngôn ngữ cho website WordPress chẳng hạn.

Các anh em có thể xem đoạn code mẫu bên dưới để hiểu thêm nhé ahihi 😹😹

function change_text($text) {
   $text = 'hung dep trai';
   return $text;
}
add_filter( 'hung_xau_trai', 'change_text' );

Ở đây mình sẽ có hàm change_text với kết quả đầu ra là “hung dep trai” sau đó mình sẽ dùng add_filter đăng ký hàm này với một điểm đã được khai báo từ trước đó là “hung_xau_trai”.

Sau khi kết thúc quá trình chúng ta sẽ có một nội dung mới được thay đổi đó là “hung dep trai”

Cool chưa 😂😂😂

Các Filter Hook Cơ Bản:

  • add_filter: thêm filter vào Hook
  • remove_filter: xoá filter khỏi Hook
  • remove_all_filters: xoá tất cả các filter khỏi Hook
  • has_filter: kiểm tra sự tồn tại của filter

Hướng dẫn trước khi dùng

Sau khi các anh em đã hiểu về Action và Filter Hook rồi thì chúng ta sẽ làm một demo nho nhỏ như sau.

Ở đây mình sẽ tự tạo một Hook để load CSS cho theme của mình dựa trên chuẩn Google AMP.

function load_css () {
 include(get_template_directory().'/styles/public/app.min.css');
}
add_action( 'amp_template', 'load_css' );

Sau khi tạo xong một Hook có tên là amp_template, mình sẽ gọi Hook này ở nơi mà mình muốn sử dụng nó như sau:

<head>
  <style amp-custom>
    <?php do_action('amp_template'); ?>
  </style>
</head>

Ngoài ra các anh em có thể tham khảo example trong  theme WordPress mà mình đang build ở bên dưới để hiểu thêm nhé.

Các nguồn tra cứu Hook WordPress

Về cơ bản Hook WordPress nhiều vô số kể và bản thân mình cũng chỉ biết và sử dụng một ít trong số chúng.

Dưới đây là 2 nguồn để các anh em có thể follow và tìm hiểu thêm về Hook

Nếu có bất kì thắc mắc nào liên quan về bài viết của mình vui lòng để lại bình luận bên dưới nhé, thân chào và quyết thắng 😹😹😹

Xin chào các đồng chí tôi là Phạm Phi Hùng, tác giả của blog Hung Pham Dev Web Tôi là một Front-end Developer, kiêm writer, quay phim dạo, sửa máy dạo và làm một số ngành nghề khác nữa

Leave a reply:

Your email address will not be published.

Site Footer