06/11/2024 Thủ thuật 3 phút đọc 3.2K lượt xem

Các Hooks trong Flatsome bạn cần biết để code ez

Các Hooks trong Flatsomebạn cần biết để code ez

Tunlamweb Cập nhật ngày 01/12/2024
Các Hooks trong Flatsome bạn cần biết

Flatsome là một chủ đề WordPress phổ biến cho WooCommerce và các trang web thương mại điện tử khác, và nó có rất nhiều hooks (móc) để tùy chỉnh giao diện và chức năng. Dưới đây là một số hook quan trọng mà Flatsome cung cấp:

Các Hooks trong Flatsome bạn cần biết

Các Hooks trong Flatsomebạn cần biết để code ez
Các Hooks trong Flatsomebạn cần biết để code ez

1. Header Hooks

  • flatsome_before_header: Chạy trước khi phần header hiển thị.
  • flatsome_header: Hook chính để tùy chỉnh nội dung trong header.
  • flatsome_after_header: Chạy ngay sau phần header.

2. Content Hooks

  • flatsome_before_page: Hook trước khi phần nội dung chính của trang bắt đầu.
  • flatsome_page_content: Hook để chèn nội dung tùy chỉnh vào giữa trang.
  • flatsome_after_page: Chạy sau khi phần nội dung chính của trang kết thúc.

3. Footer Hooks

  • flatsome_before_footer: Chạy trước khi phần footer bắt đầu.
  • flatsome_footer_widgets: Hook để tùy chỉnh các widget trong footer.
  • flatsome_after_footer: Chạy sau phần footer, hữu ích cho các nội dung bổ sung.

4. Product Page Hooks (WooCommerce)

  • flatsome_before_product: Hook chạy trước khi phần chi tiết sản phẩm bắt đầu.
  • flatsome_product_summary: Hook để thêm nội dung vào phần mô tả sản phẩm.
  • flatsome_after_product: Hook chạy sau khi phần chi tiết sản phẩm kết thúc.

5. Blog Post Hooks

  • flatsome_before_blog_post: Chạy trước khi bài viết blog hiển thị.
  • flatsome_after_blog_post: Chạy sau khi bài viết blog kết thúc.

6. Other Useful Hooks

  • flatsome_before_checkout: Hook chạy trước khi bắt đầu trang thanh toán.
  • flatsome_after_checkout: Chạy sau khi trang thanh toán hoàn tất.
  • flatsome_before_cart: Hook chạy trước khi hiển thị giỏ hàng.
  • flatsome_after_cart: Chạy sau khi giỏ hàng hiển thị.

Những hook này cho phép bạn chèn mã HTML, CSS, hoặc JavaScript tùy chỉnh vào các vị trí khác nhau trong chủ đề Flatsome. Nếu bạn cần hỗ trợ thêm về cách sử dụng từng hook, mình sẵn sàng giúp bạn!

Hướng dẫn sử dụng hàm hook

Các Hooks trong Flatsomebạn cần biết để code ez
Các Hooks trong Flatsomebạn cần biết để code ez

Ví dụ: Các bạn muốn hiển thị thêm dòng “Tunlamweb” cuối trang sản phẩm thì thêm hàm kiểm tra single product is_product() và hook vào vị trí woocommerce_after_single_product như sau:

Chúc các bạn thành công.

Thích 0
Bình thường 0
0 0 đánh giá
Đánh giá bài viết
Theo dõi
Thông báo của
0 Góp ý
Cũ nhất
Mới nhất Được bỏ phiếu nhiều nhất