Tùy biến hiển thị danh mục category wordpress

Quảng cáo
Ads_ngang
Website dinhthuanit.com có bài Tùy biến hiển thị danh mục category wordpress

Để tùy biến can thiệp vào từng category bạn mong muốn hiển thị hoặc không muốn hiển thị trong danh sách categories bạn liệt kê ở sidebar widget thì chúng ta sử dụng tham số walker cũng giống với cách tùy biến với nav menu nhưng thừa kế class Walker_Category .

Walker là class đặc biệt cho việc hiển thị cấu trúc cây của menu, categories, pages, comments trong wordpress. Điển hình hàm wp_list_categories() có tham số walker giúp bạn tùy chỉnh bất kỳ dữ liệu danh mục nào bạn mong muốn hiển thị có phối phù hợp với template tags.

Đầu tiên, chúng ta tạo class thừa kế Walker_Category . Chép nội dung class sau vào functions.php hoặc viết vào plugin mới. Nhưng cho dễ dàng bạn có thể thêm nữa trong theme functions.php để tạo ra kết quả ngay.

 class Post_Category_Walker extends Walker_Category { private $term_ids = array(); function __construct( $post_id, $taxonomy ) { // fetch the list of term ids for the given post $this-> term_ids = wp_get_post_terms( $post_id, $taxonomy, 'fields=ids' ); } function display_element( $element, &$children_elements, $max_depth, $depth=0, $args, &$output ) { $display = false; $id = $element-> term_id; if ( in_array( $id, $this-> term_ids ) ) { // the current term is in the list $display = true; } elseif ( isset( $children_elements[ $id ] ) ) { // the current term has children foreach ( $children_elements[ $id ] as $child ) { if ( in_array( $child-> term_id, $this-> term_ids ) ) { // one of the term's children is in the list $display = true; // can stop searching now break; } } } if ( $display ) parent::display_element( $element, &$children_elements, $max_depth, $depth, $args, &$output ); } }  

Lưu ý : Tương tự như việc làm việc của Menu Walker. Walker_Category Walker_Nav_Menu có thừa kế base class chung là Walker . Vì vậy cũng đều có thể override các phương thức thuộc sở hữu Walker class như: display_element, start_lvl, end_lvl, start_el, end_el.

ở đây chúng ta thấy có hàm display_element() , hàm này được gọi cho mỗi category và quyết định cho từng category được hiển thị hoặc không bằng cách gọi mặc định phương thức mẹ parent::display_element của nó. Hàm override này quét tất cả các categories, categories nào thuộc sở hữu post có chỉ định $id định vị qua constructor sẽ cho hiển thị cho dù là parent categories và cả subcategories.

Tạo đối tượng walker cho hàm hiển thị danh mục categories trong wordpress wp_list_categorie , ví dụ dẫn vào hàm sau:

 function walk_post_categories( $post_id, $args = array() ) { $args = wp_parse_args( $args, array( 'taxonomy' =>  'category' ) ); $args['walker'] = new Post_Category_Walker( $post_id, $args['taxonomy'] ); $output = wp_list_categories( $args ); if ( $output ) return $output; }  

Để hiển thị các danh mục của bài viết theo cấu trúc tầng chúng ta truyền post vào hàm :

     

Đưa thêm tham số vào hàm wp_list_categories nếu muốn.

     

Hàm start_lvl có vai trò tạo thẻ html bao các categories con, thường là ul, ol tùy theo bạn thiết lập. Mặc định là tag ul . Chúng ta cũng đều có thể hiển thị danh mục con bên dưới danh mục mẹ hoặc chỉ hiển thị danh mục mẹ với thuộc tính hierarchical.
Do vậy để sử dụng phương thức start_lvl end_lvl hãy chắc chắn có thiết lập tính chất “hierarchical=true”.

 wp_list_categories(array('hierarchical'=> true));  

Hàm wp_list_categories cũng cấp phép loại bỏ wrap bao ngoài toàn bộ danh mục bằng phương pháp khai báo tính chất ‘ title_li ‘ với giá trị chuỗi rỗng.

 wp_list_categories(array('title_li'=> ''));  

Kết quả chỉ từ những thẻ bao nội dung mỗi category, nếu style=”list” thì hàm wp_list_categories trả về sẽ như thế này.

  
  • Item 1
  • Item 2
  • Item 3
  • Tuy nhiên nếu có thiết lập tham số ‘title_li’ thì kết quả có thêm thẻ bao li hoặc ul bên phía ngoài dữ liệu categories, khi Inspect Element trên chrome bạn sẽ thấy như sau:
    list-categories-wp
    Không có cách nào loại bỏ với bắt đầu bằng thẻ li của wp_list_categories, nhưng bạn cũng có thể dùng css tạo style cho thẻ li này.

    Tham khảo một số phương thức walker cũng đều có thể dùng đến cho website của bạn, sẽ cực kỳ hữu ích khi bạn muốn chỉnh sửa HTML trong cấu trúc hiển thị dữ liệu mặc định category/Menu.

     class hw_Walker_categories extends Walker_Category { function __construct(){ } public function start_lvl( &$output, $depth = 0, $args = array() ) { if ( 'list' != $args['style'] ) return; $indent = str_repeat("t", $depth); $output .= "$indent 
      n"; } public function end_lvl( &$output, $depth = 0, $args = array() ) { if ( 'list' != $args['style'] ) return; $indent = str_repeat("t", $depth); $output .= "$indent
    n"; } public function start_el( &$output, $category, $depth = 0, $args = array(), $id = 0 ) { /** This filter is documented in wp-includes/category-template.php */ $cat_name = apply_filters( 'list_cats', esc_attr( $category-> name ), $category ); $link = 'description ) ) { $link .= 'title="' . esc_attr( strip_tags( apply_filters( 'category_description', $category-> description, $category ) ) ) . '"'; } $link .= '> '; $link .= $cat_name . ''; if ( ! empty( $args['feed_image'] ) || ! empty( $args['feed'] ) ) { $link .= ' '; if ( empty( $args['feed_image'] ) ) { $link .= '('; } $link .= ''; if ( empty( $args['feed_image'] ) ) { $link .= $name; } else { $link .= "'; } $link .= ''; if ( empty( $args['feed_image'] ) ) { $link .= ')'; } } if ( ! empty( $args['show_count'] ) ) { $link .= ' (' . number_format_i18n( $category-> count ) . ')'; } if ( 'list' == $args['style'] ) { $output .= "t
  • term_id; if ( ! empty( $args['current_category'] ) ) { $_current_category = get_term( $args['current_category'], $category-> taxonomy ); if ( $category-> term_id == $args['current_category'] ) { $class .= ' current-cat'; } elseif ( $category-> term_id == $_current_category-> parent ) { $class .= ' current-cat-parent'; } } $output .= ' '; $output .= "> $linkn"; } else { $output .= "t$link
    n"; } } public function end_el( &$output, $page, $depth = 0, $args = array() ) { if ( 'list' != $args['style'] ) return; $output .= "n"; } }
  • So sánh các phương thức này tại đây.

    WordPress Category Widget

    Đối với category widget, wordpress cung cấp cho chúng ta hook widget_categories_args để thiết lập thêm tham số cho hàm wp_list_categories của category widget. Sau khi kéo widget category trên sidebar sẽ hiển thị ra website, chúng ta chèn đoạn code sau đây vào theme functions.php. Lưu ý là wordpress không có mọi tùy chỉnh nâng lên với widget này mà bạn phải code ngoài nhé.

     function my_wp_list_categories($cat_args){ global $post; $tax=get_object_taxonomies($post); $cat_args['title_li'] = 'ABC'; $cat_args['exclude'] = 1; $cat_args['use_desc_for_title'] = 0; $cat_args['walker']=new Post_Category_Walker( $post-> ID, $tax[1] ); return $cat_args; } add_filter('widget_categories_args', 'my_wp_list_categories', 10, 2);  

    Không hiểu sao categories widget mặc định trong wordpress không bổ trợ đầy đặn walker, phương thức start_lvl và end_lvl không hoạt động. Mình thử với plugin Display Categories Widget thì hoạt động tốt. Phiên bản gốc ngày nay không có tùy chọn option Walker tuy vậy mình đã can thiệp thêm cài đặt này cấp phép bạn điền class Walker để sử dụng tính năng này. Sửa code plugin cũng không cầu kỳ với nhưng bạn thành thạo PHP, nếu ai không biết thì liên hệ với mình nha.

    Ngoài ra sử dụng filter “wp_list_categories” bạn có thể thêm, sửa, xóa toàn phần hiển thị HTML của hàm wp_list_categories.

     add_filter('wp_list_categories','filter_wp_list_categories'); function filter_wp_list_categories($output){ .... return $output; }  

    Chú ý: nếu gặp lỗi ‘escape slashes’ sẩy ra với thẻ html giống thế này,

      
  • Chinese Tea
  • Giải pháp sử lý loại bỏ slashes, trong php có hàm stripslashes , phối hợp với hàm tiện ích wordpress wp_rel_nofollow .

     add_filter('wp_list_categories','esc_wp_rel_nofollow'); function esc_wp_rel_nofollow($output){ .... return stripslashes(wp_rel_nofollow($output)); }  

    Chúc bạn thành công!

    Hãy cho mình biết suy nghĩ của bạn trong phần bình luận bên dưới bài viết này. Hãy theo dấu kênh chia sẻ kiến thức WordPress của TopVn trên Twitter và Facebook

    Bài viết Tùy biến hiển thị danh mục category wordpress được tổng hợp và biên tập bởi: dinhthuanit.com. Mọi ý kiến đóng góp và phản hồi vui lòng gửi Liên Hệ cho dinhthuanit.com để điều chỉnh. dinhthuanit.com xin cảm ơn.

    Bài Viết Liên Quan


    Bài Viết Khác


    Quảng cáo
    Ads_ngang