Nếu bạn đang sử dụng thuộc tính sản phẩm (năm sinh) để lọc sản phẩm, thì URL đúng sẽ có định dạng dựa trên taxonomy ?filter_<slug-thuoc-tinh>=<slug-cua-gia-tri>
thay vì product-tag
.
Dưới đây là cách tạo shortcode đúng để lọc sản phẩm theo thuộc tính “Năm sinh”:
1. Mã Shortcode
Thêm đoạn mã này vào file functions.php
của theme con (child theme):
// Tạo shortcode hiển thị dropdown lọc theo thuộc tính "Năm sinh"
add_shortcode('year_of_birth_filter', 'create_year_of_birth_filter_shortcode');
function create_year_of_birth_filter_shortcode() {
// Thay 'pa_nam-sinh' bằng slug của thuộc tính "Năm sinh"
$attribute_name = 'pa_nam-sinh';
// Lấy danh sách các giá trị (terms) của thuộc tính
$terms = get_terms([
'taxonomy' => $attribute_name,
'hide_empty' => true,
]);
if (!empty($terms) && !is_wp_error($terms)) {
ob_start(); // Bắt đầu buffer để trả về nội dung
echo '<form method="GET" action="' . esc_url(get_permalink(wc_get_page_id('shop'))) . '" id="year_of_birth_filter">';
echo '<label for="year_of_birth">Lọc theo năm sinh:</label>';
echo '<select id="year_of_birth" name="filter_' . esc_attr(str_replace('pa_', '', $attribute_name)) . '">';
echo '<option value="">Chọn năm sinh</option>';
foreach ($terms as $term) {
echo '<option value="' . esc_attr($term->slug) . '">' . esc_html($term->name) . '</option>';
}
echo '</select>';
echo '</form>';
// JavaScript tự động submit form khi chọn năm sinh
echo "
<script>
document.getElementById('year_of_birth').addEventListener('change', function() {
this.form.submit();
});
</script>
";
return ob_get_clean(); // Kết thúc buffer và trả về nội dung
} else {
return '<p>Không tìm thấy thuộc tính "Năm sinh".</p>';
}
}
2. Cách sử dụng
- Sau khi thêm đoạn mã vào
functions.php
, bạn có thể sử dụng shortcode[year_of_birth_filter]
ở bất kỳ vị trí nào (trang, bài viết, widget, v.v.).
3. Cách hoạt động
- URL sẽ tự động được tạo: Khi chọn một giá trị năm sinh (ví dụ:
1992
), URL sẽ có định dạng:https://yourwebsite.com/shop/?filter_nam-sinh=1992
nam-sinh
: Slug của thuộc tính.1992
: Slug của giá trị thuộc tính.
- WooCommerce sẽ tự động hiển thị các sản phẩm tương ứng với năm sinh được lọc.
4. Lưu ý
- Slug thuộc tính chính xác: Đảm bảo slug của thuộc tính “Năm sinh” trong WooCommerce là
pa_nam-sinh
. Nếu slug khác, thay đổi biến$attribute_name
trong mã. - Trang cửa hàng: Mặc định, form sẽ chuyển hướng đến trang cửa hàng (Shop). Nếu bạn muốn thay đổi, hãy thay
wc_get_page_id('shop')
bằng ID hoặc URL của trang bạn muốn.
Chúc bạn thành công! 🚀