• About
  • Advertise
  • Privacy & Policy
  • Contact
MyComputer.vn: Thông tin công nghệ, thủ thuật, tư vấn về điện thoại, máy tính, camera, đồ điện gia dụng và âm thanh, khoa học kĩ thuật.
  • PC & Mobile
    • Windows
    • Mac
    • Android
    • iPhone & iPad
    • Internet
    • Bảo mật
    • Miễn Phí
      • Phần mềm bản quyền miễn phí
      • Khóa học Online
  • My Computer
    • Office
    • Sáng tạo
  • Hardware
    • Giải thích công nghệ
    • Tư vấn Công Nghệ
    • Đánh giá sản phẩm
  • DEV Tuts
No Result
View All Result
MyComputer.vn
  • PC & Mobile
    • Windows
    • Mac
    • Android
    • iPhone & iPad
    • Internet
    • Bảo mật
    • Miễn Phí
      • Phần mềm bản quyền miễn phí
      • Khóa học Online
  • My Computer
    • Office
    • Sáng tạo
  • Hardware
    • Giải thích công nghệ
    • Tư vấn Công Nghệ
    • Đánh giá sản phẩm
  • DEV Tuts
No Result
View All Result
MyComputer.vn
No Result
View All Result
Home DEV Tuts

Cách thêm biểu tượng loại bỏ (xóa) sản phẩm trong trang thanh toán WooCommerce

MyComputer bởi MyComputer
19/02/2022
Thời gian đọc: 2 phút
A A
xoa checkout woocommece
Theo dõi MyComputer trên

Chia sẻ lên FacebookChia sẻ lên TwitterChia sẻ lên TelegramChia sẻ lên Linkedin

Trong phần tóm tắt đơn đặt hàng của trang thanh toán, điều quan trọng là cho phép người dùng xóa sản phẩm đã được thêm vào giỏ hàng nhưng họ không muốn tiếp tục thanh toán với sản phẩm. Để thêm biểu tượng xóa vào trang thanh toán WooCommerce (trang checkout WooCommerce), bạn cần thêm bộ lọc sẽ thêm biểu tượng vào phía trước sản phẩm trên bản tóm tắt đơn hàng.

Nút xóa này cho phép người dùng xóa từng sản phẩm khỏi các được thêm vào giỏ hàng, Biểu tượng loại bỏ này theo mặc định được tìm thấy trên trang giỏ hàng nhưng trong hầu hết các themes WooCommerce, nhưng nó không xuất hiện tại các trang thanh toán (trang checkout) của WooCommerce.

Những chủ đềnên tham khảo

WooCommerce: Tự động mở rộng chỗ nhập phiếu giảm giá trên trang checkout (thanh toán)

WooCommerce: Tự động mở rộng chỗ nhập phiếu giảm giá trên trang checkout (thanh toán)

1.6k
Hướng dẫn cách tạo thanh toán PayPal bằng VNĐ trên WooCommerce

Hướng dẫn cách tạo thanh toán PayPal bằng VNĐ trên WooCommerce

1.8k
Cách dễ dàng để nhúng (embed) Gist vào các bài đăng trên WordPress

Cách dễ dàng để nhúng (embed) Gist vào các bài đăng trên WordPress

1.5k
[Hướng dẫn] Rebake all posts Discourse? Rebake các bài viết trên Discourse sau khi cấu hình lại CDN

[Hướng dẫn] Rebake all posts Discourse? Rebake các bài viết trên Discourse sau khi cấu hình lại CDN

1.5k

Và hôm nay mình sẽ hướng dẫn các bạn cách thêm nút xóa hay nút loại bỏ sản phẩm trong trang thanh toán hay trang checkout như hình:

add remove icon or button to woocommerce checkout page
Cách thêm biểu tượng loại bỏ (xóa) sản phẩm trong trang thanh toán WooCommerce (Ảnh 3 - Source: Google Image)

Nếu nút loại bỏ sản phẩm này bị thiếu trong trang thanh toán của bạn và bạn muốn thêm nó vào phần tóm tắt đơn hàng như được hiển thị trên hình ảnh ở trên, thì sau đây là các bước bạn nên thực hiện:

  1. Mở tệp functions.php của theme đang hoạt động của bạn nhưng tốt hơn là child theme của bạn. Bạn có thể truy cập các tệp chủ đề thông qua bảng điều khiển WordPress hoặc qua CPanel hoặc FTP.
  2. Thêm đoạn mã này vào tệp functions.php và lưu các thay đổi:

Để tạo kiểu cho biểu tượng chữ X đỏ, bạn có thể sử dụng CSS như tôi đã sử dụng trong ví dụ trên.

.remove-icon {
    padding: 5px;
    padding-top: 0; 
    color: red;
    font-size: 16px;
    font-weight: bold;
}

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

Tags: Web Developmentwordpress
MyComputer

MyComputer

Thích là nhích...

Bài cùng DANH MỤC

WooCommerce: Tự động mở rộng chỗ nhập phiếu giảm giá trên trang checkout (thanh toán)
DEV Tuts

WooCommerce: Tự động mở rộng chỗ nhập phiếu giảm giá trên trang checkout (thanh toán)

1.6k
Hướng dẫn cách tạo thanh toán PayPal bằng VNĐ trên WooCommerce
DEV Tuts

Hướng dẫn cách tạo thanh toán PayPal bằng VNĐ trên WooCommerce

1.8k
Cách dễ dàng để nhúng (embed) Gist vào các bài đăng trên WordPress
DEV Tuts

Cách dễ dàng để nhúng (embed) Gist vào các bài đăng trên WordPress

1.5k
[Hướng dẫn] Rebake all posts Discourse? Rebake các bài viết trên Discourse sau khi cấu hình lại CDN
DEV Tuts

[Hướng dẫn] Rebake all posts Discourse? Rebake các bài viết trên Discourse sau khi cấu hình lại CDN

1.5k
Bài kế tiếp
[Hướng dẫn] Rebake all posts Discourse? Rebake các bài viết trên Discourse sau khi cấu hình lại CDN

[Hướng dẫn] Rebake all posts Discourse? Rebake các bài viết trên Discourse sau khi cấu hình lại CDN

guest

guest

0 Bình luận
Phản hồi nội tuyến
Xem tất cả bình luận

TOP TRENDING

  • 10 cách giúp Chrome sử dụng ít dung lượng ổ đĩa hơn

    10 cách giúp Chrome sử dụng ít dung lượng ổ đĩa hơn

    703 lượt chia sẻ
    Chia sẻ 280 Tweet 175
  • Các lỗi & mã lỗi SADP tool thường gặp (SADP Error Codes)

    1033 lượt chia sẻ
    Chia sẻ 413 Tweet 258
  • [Unbox] Bo mạch chủ COLORFUL Z790D5 Gaming Frozen

    7 lượt chia sẻ
    Chia sẻ 80 Tweet 50
  • COLORFUL trình làng dòng bo mạch chủ Intel B760

    249 lượt chia sẻ
    Chia sẻ 99 Tweet 62
  • [Đánh giá] Ram APACER NOX RGB White 2x8GB 3600MHz – Hiệu suất tốt, khả năng ép xung mạnh mẽ và ĐẸP

    17 lượt chia sẻ
    Chia sẻ 572 Tweet 357

TOP SÔI ĐỘNG

    MyComputer.vn

    © 2019 MyComputer.vn

    Bảo lưu mọi quyền

    • About
    • Advertise
    • Privacy & Policy
    • Contact

    Follow me

    No Result
    View All Result
    • PC & Mobile
      • Windows
      • Mac
      • Android
      • iPhone & iPad
      • Internet
      • Bảo mật
      • Miễn Phí
        • Phần mềm bản quyền miễn phí
        • Khóa học Online
    • My Computer
      • Office
      • Sáng tạo
    • Hardware
      • Giải thích công nghệ
      • Tư vấn Công Nghệ
      • Đánh giá sản phẩm
    • DEV Tuts

    © 2019 MyComputer.vn