Hoạt động mọi nền tảng

Từ Shopify đến storefront React tùy chỉnh — thêm Rivet trong vài phút. Nhúng không code cho hầu hết, npm cho developer.

Shopify🛍️WooCommerce⚛️React / Next.js🌐Tùy chỉnh / Mọi trang
Shopify logo

Shopify

Nền tảng TMĐT số 1

Cài Rivet Chat trực tiếp từ rivet-chat.com/install và bật App embed — không cần dán theme.liquid. Bong bóng chat xuất hiện trên theme chạy trong dưới 2 phút.

Không code⏱ 2 phút
  1. 1Cài Rivet Chat từ rivet-chat.com/install, mở app → Setup.
  2. 2Vào theme editor / App embeds cho theme đã phát hành.
  3. 3Bật nhúng Rivet Chat và lưu theme chạy (theme nháp không hiện cho khách).
  4. 4Xác nhận Tenant ID trên Setup, mở storefront test bong bóng.

Đoạn code tùy chọn (đường App Embed không cần dán)

<!-- Optional custom snippet (App Embed path needs no paste) -->
<link rel="stylesheet" href="https://rivet-chat.com/static/chat.css?v=39">
<script src="https://rivet-chat.com/static/chat.js?v=39" defer></script>
<script>
window.addEventListener("DOMContentLoaded", function () {
  SmartReply.init({
    server: "https://rivet-chat.com",
    tenantId: "t-xxxxxxxx",
    title: "Customer Support",
    primaryColor: "#2563eb"
  });
});
</script>
Theme editor Shopify với App embed Rivet Chat bật
Shopify nên dùng App Embed. Đoạn dưới chỉ cho theme tùy chỉnh.
Lấy mã nhúng →
🛍️

WooCommerce

TMĐT WordPress

WooCommerce trên WordPress? Rivet nhúng qua khối HTML tùy chỉnh hoặc footer theme — không cần cài plugin.

Không code⏱ 3 phút
  1. 1Sao chép mã nhúng từ dashboard Rivet.
  2. 2Trong WordPress, Vẻ ngoài → Tùy chỉnh → HTML bổ sung (hoặc plugin header/footer).
  3. 3Dán đoạn code vào phần footer.
  4. 4Xuất bản. Widget xuất hiện toàn cửa hàng.
Lấy mã nhúng →
⚛️

React / Next.js

Cho storefront tùy chỉnh

Xây storefront headless với React/Next.js? Dùng gói npm cho tích hợp sạch, có kiểu — SSR-safe, tree-shakeable.

Ít code⏱ 5 phút
  1. 1Cài: npm install smartreply-chat
  2. 2Import và khởi tạo trong client component (useEffect cho Next.js).
  3. 3Truyền URL server và tenant ID.
  4. 4Widget mount vào document.body, ngoài virtual DOM React.
import SmartReply from 'smartreply-chat'

useEffect(() => {
  SmartReply.init({
    server: 'https://rivet-chat.com',
    tenantId: 't-xxxxxxxx',
    platform: 'custom',
  })
}, [])
Lấy mã nhúng →
🌐

Tùy chỉnh / Mọi trang

BigCommerce, Wix, Magento, v.v.

Rivet chạy trên mọi trang cho phép thêm script tag. BigCommerce, Wix, Magento, Squarespace, hay HTML tay — đều hỗ trợ.

Không code⏱ 2 phút
  1. 1Sao chép mã nhúng từ dashboard Rivet.
  2. 2Tìm nơi trang cho phép HTML/script tùy chỉnh (thường trong cài theme hoặc Code Injection).
  3. 3Dán đoạn code vào <head> hoặc trước </body>.
  4. 4Lưu và xuất bản. Xong.
  5. 5Cho thêm vào giỏ thẻ sản phẩm trên giỏ tùy chỉnh, nối RivetChat.onAddToCart — xem hướng dẫn.

Hướng dẫn thêm vào giỏ cho cửa hàng tùy chỉnh →

Lấy mã nhúng →

Biến trang sản phẩm thành quầy bán

Giới thiệu sản phẩm khách đang xem, trả lời từ dữ liệu thực, để họ thêm vào giỏ ngay trong chat.

Dùng thử miễn phí