Thêm custom field ảnh đại diện cho danh mục sản phẩm

Đóng góp bởi: Lê Thiện 215 lượt xem Đăng ngày 22/06/2024

Trong nhiều trường hợp, chúng ta muốn tùy chỉnh ảnh đại diện cho mỗi danh mục sản phẩm woocommerce để website được trình bày hiện đại và theo ý mình muốn hơn. Tuy nhiên, để tạo custom field ảnh đại diện và gọi ra được trang danh mục sản phẩm thì không phải ai cũng làm được. Hôm nay, cùng mình thực hiện công việc này nhé!

Giuseart.com---THêm-custom-field-ảnh-đại-diện-cho-danh-mục-sản-phẩm
Toptheme.info – Thêm custom field ảnh đại diện cho danh mục sản phẩm

Dưới đây là hướng dẫn cụ thể để thêm custom field ảnh đại diện cho danh mục sản phẩm:

  1. Thêm custom field vào form thêm và chỉnh sửa danh mục:
    • Thêm custom field vào form thêm danh mục.
    • Thêm custom field vào form chỉnh sửa danh mục.
  2. Lưu giá trị của custom field:
    • Lưu giá trị của custom field khi danh mục được tạo mới hoặc cập nhật.
  3. Hiển thị giá trị của custom field:
    • Hiển thị giá trị của custom field khi xem hoặc chỉnh sửa danh mục.

Dưới đây là ví dụ cụ thể để thêm một custom field ảnh đại diện vào taxonomy product_cat:

Thêm custom field vào form thêm danh mục mới

Bạn copy và paste toàn bộ code này vào Giao diện – Theme File Editor – Function.php

Thêm custom field vào form chỉnh sửa danh mục đã có

Bạn copy và paste toàn bộ code này vào Giao diện – Theme File Editor – Function.php

Lưu giá trị custom field vào database

Vẫn tiếp tục copy và paste đoạn code dưới đây vào function.php nha

Hiển thị ảnh đại diện ra trang danh mục sản phẩm ngoài front end

Ở bước này, tùy vào theme bạn đang sử dụng sẽ có vị trí hiển thị ảnh đại diện khác nhau. Ví dụ, theme flatsome – woocommerce – layout – có các layout khác nhau của trang danh mục, bạn chỉ cần tìm được vị trí cần hiển thị ảnh đại diện rồi paste đoạn code sau vào:

Với các đoạn mã trên, bạn sẽ có thể thêm, lưu và hiển thị custom field ảnh đại diện cho taxonomy product_cat một cách dễ dàng.

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *

Mẫu web mới đăng

Mời bạn xem một số mẫu web mới đăng của Toptheme.info | NinhBinhweb