Menu

Action Hook và Filter Hook toàn tập

Do đây là hai khái niệm quan trọng nhất khi lập trình với WordPress nên mình mạn phép viết lại để bổ sung cho bài cũ, ở bài này mình sẽ cố gắng viết gọn nhất, dễ hiểu và chính xác nhất về khái niệm Action Hook và Filter Hook.

Để hiểu bài này tốt nhất, hãy xem qua một khái niệm căn bản trong PHP đó là Function (Hàm).

Ý nghĩa của Action & Filter

Hai khái niệm này là khái niệm quan trọng bậc nhất nếu các bạn viết plugin hay làm theme, nó sẽ giúp bạn chèn và thực hiện một hành động gì đó trong WordPress ví dụ như tự gửi email khi có bài mới được đăng (Action) và thao tác lọc nội dung trong một đối tượng nào đó, chẳng hạn như bóp méo con chữ trong phần nội dung bài viết ở mọi trang (Filter).

Có thể lúc bạn mới tìm hiểu về hai cái này thì thấy nó đơn giản và không mạnh mẽ nhưng thật sự đã dùng WordPress mà bạn không biết đến hai khái niệm này thì coi như bạn đã mất đi 60% sức mạnh để tùy biến WordPress.

Action có hai hướng sử dụng, một là được dùng để xác định vị trí trong theme để chúng ta có thể chèn một cái gì đó một cách chính xác, cái này hay sử dụng trong việc custom child theme ở các framework như Genesis, Thematic,….Hai là xác định một hành động nào đó trong website để ta thực hiện một hành động làm sau nó, cái này hay sử dụng trong làm plugin.

Filter thì chỉ được dùng để lọc một nội dung nào đó nhưng nó cũng khá hữu ích, ví dụ như bạn cần chèn thêm cái gì vào cuối nội dung, đầu tiêu đề, biến đổi các thành phần bên trong đó thì chỉ có cách duy nhất là dùng Filter. Cái này được dùng trong cả làm theme và plugin.

Vậy bạn đã hiểu được khái niệm Action và Filter rồi chứ gì? Quá đơn giản để hiểu, không cần dài dòng. Chi tiết hơn bạn sẽ biết rõ khi sử dụng nó.

Vậy Hook là cái gì?

Như tiêu đề, mình có thêm một chữ Hook vào sau Filter và Action, nghĩa là cả hai cái này đều có Hook. Vậy Hook là cái gì vậy?

Trước khi bạn hiểu Hook một cái gì, bạn hãy phân tích câu sau đây:

Tôi muốn tán đổ em gái đang đứng ở dưới gốc cây.

Câu trên nghĩa là bạn muốn thực hiện một hành động gì đó tới một đối tượng cụ thể, cụ thể là em gái đứng ở dưới gốc cây chứ không phải em gái đang chạy xe SH. Vậy mình có thể nói rằng, tán là một hành độngem gái đứng dưới gốc cây là một cái Hook để chúng ta thực hiện hành động đó.

Khi ta nói Action và Filter, thì nghĩa là ta đang nói chung về định nghĩa của tụi nó. Nhưng khi ta nói Action Hook thì nghĩa là một vị trí của Action, tương tự với Filter. Bạn sẽ rõ hơn ở phần sử dụng, nhưng tới đây bạn nên tạm hiểu rằng Hook là một khái niệm để xác định Action nào, Filter nào.

Cách sử dụng Action toàn tập

Để sử dụng Action, thì ta có hai bước chính bao gồm:

  1. Tạo function (hàm) để thực thi hành động của mình tạo ra.
  2. Kích hoạt function vừa tạo vào một Action Hook chỉ định.

Và code của nó sẽ như thế này.

//Tạo function của bạn

function my_action() {

echo "Hello Action!";

}

//Kích hoạt function ở trên vào action hook

add_action ( 'ten_action_hook', 'my_action' );

Trong code, nghĩa là mình sẽ tạo một function tên là my_action() và sau đó là sẽ dùng hàm add_action() có trong WordPress để kích hoạt function my_action() vào một hook có tên là ten_action_hook.

Và đây là danh sách một số Action Hook hay dùng trong WordPress:

  • init – Thực thi hành động khi WordPress tải xong một trang nhưng trước khi các thông số trong HEADER được gửi đi
  • wp_loaded – Thực thi khi WordPress đã tải xong toàn bộ trang.
  • wp_head – Thực thi một cái gì đó trong cặp thẻ <head></head>.
  • wp_footer – Thực thi một cái gì đó vào nơi mà hàm wp_footer() được gọi trong theme.
  • delete_post – Thực thi khi thao tác xóa một post.
  • publish_post – Thực thi khi một post chuyển qua trạng thái Published.
  • publish_page – Tương tự public_post nhưng nó sẽ làm việc với Page.
  • wp_insert_comment – Thực thi khi một bình luận mới được thêm vào database.

Còn rất nhiều nữa, bạn nên xem thêm:

Thực hành với Action Hook

Bài 1 – Chèn một file CSS vào thẻ <header> của theme.

function chen_css() {
 echo "<link rel'stylesheet' href='".get_template_directory_uri()."/my_css.css' />";
}
add_action( 'wp_head', 'chen_css' );

Trong đoạn trên mình có sử dụng hàm get_template_directory_uri(), đây là một hàm rất thông dụng dùng để lấy đường dẫn của theme đang được kích hoạt. Và đây là kết quả sau khi chèn đoạn trên vào file functions.php hoặc tạo plugin mới.

Chèn một file CSS mới vào thẻ <head>

Bài 2 – Gửi email thông báo khi có bài đăng mới

Ở ví dụ này chúng ta sẽ làm việc với Action chỉ hành động, cụ thể là Action Hook tên publish_post để thực thi code gửi email khi có một bài mới được đăng.

function notify_new_post($post_id) {
    if( ( $_POST['post_status'] == 'publish' ) ) {
        $post = get_post($post_id);
        $author = get_userdata($post->post_author);
        $author_email = $author->user_email;
        $email_subject = "Bài viết $post->title của bạn đã được đăng.";

        ob_start(); ?>

        <html>
            <head>
                <title>Bài viết mới tại <?php bloginfo( 'name' ) ?></title>
            </head>
            <body>
                <p>
                    Chào <?php echo $author->user_firstname ?>,
                </p>
                <p>
                    Bài viết <a href="<?php echo get_permalink($post->ID) ?>"><?php the_title_attribute() ?></a> đã được đăng lên website của bạn.
                </p>
            </body>
        </html>

        <?php

        $message = ob_get_contents();

        ob_end_clean();

        wp_mail( $author_email, $email_subject, $message );
    }
}

add_action( 'publish_post', 'notify_new_post' ); ?>

Đoạn code gốc

Tự tạo Action Hook với do_action

Trong WordPress cho phép bạn tự tạo một Action Hook dành cho riêng mình, đó là lý do vì sao Genesis hay Thematic đều có các Action Hook dành cho riêng mình. Tạo một Action Hook rất dễ, chỉ với một đoạn sau đây.

do_action( 'thachpham_before_post' );

Đoạn ở trên là mình tạo một Action Hook tên là thachpham_before_post và bạn chèn đoạn trên ở đâu thì hook này sẽ nằm ở đó. Ví dụ bạn mở file index.php trong theme lên chèn vào bên trên một Loop thì nếu bạn muốn chèn cái gì đó lên trên đoạn Loop thì chỉ việc viết function và gán vào cái Action Hook mới này, tương tự ví dụ 1.

Tự tạo một Action Hook riêng

Nguồn bạn cần biết:

Cách sử dụng Filter toàn tập

Minh họa tính năng Filter trong WordPress

Như mình đã nói ở đầu bài, Filter nghĩa là tính năng để lọc một cái gì đó, cái đó là cái gì? Chính xác, là lọc một Filter Hook.

Cách sử dụng cũng giống như ta sử dụng Action Hook vậy, chỉ thay action thành filter mà thôi.

function filter_post( $content ) {
	$ads = <<<ADS
		<div class="ads">
			Viết quảng cáo vào đây
		</div>
ADS;
	return $content.$ads;
}
add_filter( 'the_content', 'filter_post' );

Đoạn ở trên nghĩa là mình sẽ tạo một hàm tên filter_post() có một tham số là biến $content. Các bạn chú ý, bất cứ một Filter Hook nào cũng cần có tham số và tham số này nó sẽ trả về giá trị mặc định của nó. Do đó, khi tạo hàm thì bạn phải ghi tên một biến bất kỳ, nó sẽ tự hiểu là tham số của filter.

Sau đó, mình kích hoạt function này vào một Filter Hook có tên là the_content (Hook để lọc nội dung của post/page/…) để chèn một khung quảng cáo. Cũng xin nói thêm là ký tự <<<ADS nghĩa là khái niệm HEREDOC trong PHP để mình chèn nội dung khác vào dễ dàng và dễ return thông qua biến $ads.

Bạn vẫn chưa hiểu? Xem video bên dưới.

Tham khảo:

Tắt Filter bằng hàm remove_filter

Tương tự với Action, bạn cũng có thể tắt một filter đang hoạt động bằng hàm tên là remove_filter(). Cấu trúc sử dụng như sau:

remove_filter( 'ten_hook', 'ten_function', $thu_tu );

Dĩ nhiên là bạn vẫn có thể bỏ qua cái tham số thứ tự thực thi, nó chỉ sử dụng khi bạn tiến hành tắt các filter được gán thứ tự trong các theme framework

Thực thi Filter trực tiếp không cần function

Nếu bạn có một đoạn filter ngắn thì có thể áp dụng thẳng vào hook mà không cần phải tạo một function mới. Cấu trúc như sau:

echo apply_filters( 'ten_hook', 'gia_tri_moi' );

Ví dụ

echo apply_filters( 'widget_title', 'Tiêu đề widget' );

Thực hành với Theme Framework

Đổi chữ Search this website…trong ô tìm kiếm với Filter

function change_search_text($default) {

$default = esc_attr__('Gõ từ khóa tìm kiếm...');

return $default;

}

add_filter( 'genesis_search_text', 'change_search_text' );

Chèn quảng cáo bên trên tiêu đề bằng Action

function add_ads() {

$ads = <<<ADS

<div class="ads">

<!--Chèn mã vào đây-->

</div>

ADS;

return $ads;

}

add_action( 'genesis_entry_header', 'add_ads' );

Lời kết

Mặc dù bài hơi dài mà ít hình ảnh nên có thể nó hơi khóc đọc cho các bạn nhưng nếu bạn có ý định muốn tìm hiểu cách làm việc với một Theme Framework hay viết plugin thì bạn nên đọc bài này kỹ hơn vì hai cái này thật sự rất quan trọng, nó có thể giúp bạn custom WordPress nhanh hơn bao giờ hết.

Hơn nữa, việc tự tạo các Action Hook cũng làm cho theme của bạn trở nên chuyên nghiệp để người khác có thể dễ dàng custom.

Chúc các bạn thành công và đừng quên gửi câu hỏi ở phần bình luận để mình có thể giúp bạn kỹ hơn.

Facebook Comments

No comments

Trả lời