Bài viết này hướng dẫn cách tùy chỉnh giao diện và cảm giác của nút "Cá nhân hóa thiết kế" trong cửa hàng Shopify, và cách hiển thị hoặc ẩn các nút "Thêm vào giỏ" và "Mua ngay" cho sản phẩm có thể cá nhân hóa.
Tùy chỉnh kiểu nút trên Shopify
Bạn có hai cách để tùy chỉnh kiểu nút "Cá nhân hóa thiết kế" trong cửa hàng Shopify: dùng Gelato+ hoặc CSS.
Gelato+
Nếu bạn là thuê bao Gelato+ và dùng một trong các giao diện sau – Dawn, Debut, Studio, Craft, hoặc Simple – bạn có thể tùy chỉnh kiểu nút ngay từ Trang quản lý Gelato của bạn. Cách thực hiện:
Trong Trang quản lý Gelato, vào phần Cửa hàng.
Nhấp Chỉnh sửa chi tiết cửa hàng.
Cuộn xuống đến phần Cá nhân hóa.
Tại đây, bạn có thể thay đổi văn bản, màu nền, màu viền và màu chữ của nút "Cá nhân hóa Design". Bạn cũng có thể tùy chỉnh các nút "Thêm vào giỏ hàng" và "Quay lại mua sắm" xuất hiện ở góc trên bên trái và bên phải của Design Editor.
CSS
Nếu bạn không có gói đăng ký Gelato+, bạn có thể tùy chỉnh nút "Cá nhân hóa thiết kế" của Shopify bằng CSS. Trong CSS, có thể tham chiếu nút này qua bộ chọn ID #ge-personalize.
Bạn có thể tìm thêm thông tin về cách thêm CSS tùy chỉnh tại đây. Vui lòng tham khảo tài liệu của chủ đề Shopify của bạn hoặc liên hệ với nhà phát triển chủ đề để biết thêm chi tiết về cách thực hiện điều đó.
Ví dụ, bạn có thể đổi màu nút thành đen bằng cách thêm CSS sau vào theme của bạn:
#ge-personalize { color: black !important;}
Bạn cũng có thể tùy chỉnh nút "Thêm vào giỏ" bằng CSS. Nút này có thể được tham chiếu trong CSS qua bộ chọn ID #ge-add-to-cart. Ví dụ, bạn có thể thay đổi chiều rộng, màu sắc và cỡ chữ của nút "Thêm vào giỏ" với đoạn CSS sau:
#ge-add-to-cart {width: 50% !important; color: black !important; font-size: 30px; }
Hiển thị hoặc ẩn nút Thêm vào giỏ hàng và Mua ngay trên Shopify
Bạn có thể chọn hiển thị hoặc ẩn các nút "Thêm vào giỏ hàng" và "Mua ngay" trên các trang sản phẩm cho phép Cá nhân hóa. Bạn sẽ tìm thấy cài đặt này trong phần Cá nhân hóa của Trang quản lý Gelato, như đã mô tả ở trên.
