Nếu bạn đang sử dụng website WordPress và WooCommerce, bài viết này sẽ hướng dẫn bạn tích hợp SePay vào WordPress WooCommerce giúp tự động hóa việc xác nhận thanh toán qua chuyển khoản.

Kết quả sau khi tích hợp:

Video demo kết quả tích hợp WordPress WooCommerce

1. Phía người dùng mua hàng trực tuyến

• Khi khách đặt hàng và thanh toán, sẽ có thêm tùy chọn Chuyển khoản ngân hàng

• Mã QR code kèm thông tin thanh toán sẽ hiện lên sau khi chọn phương thức thanh toán trên.

• Website sẽ hiện Bạn đã thanh toán thành công sau khi khách hàng thanh toán chỉ vài giây.

2. Phía giao diện Quản lý Đơn hàng của WooCommerce

Đơn hàng sẽ tự động ghi nhận thanh toán. Và tự chuyển sang trạng thái từ Tạm giữ (On-Hold) sang Đang xử lý (Processing) nếu khách thanh toán đủ.

Hướng dẫn tích hợp

Bước 1: Cài plugin SePay Gateway vào website WordPress

Bước này giúp bạn thêm hình thức thanh toán vào website. Thực hiện như sau:

• Tải plugin tại đây
• Truy cập vào giao diện Admin của website WordPress -> Plugin -> Cài mới -> Tải plugin lên. Chọn vào file sepay-gateway.zip và bấm Cài đặt. Sau đó chọn Kích hoạt plugin

• Tại phần Danh sách plugin, bạn chọn vào Settings tại plugin SePay Payment Gateway

• Về cài đặt cho SePay Gateway bao gồm các cấu hình bên dưới:
  • Bật/Tắt: Tích chọn để bật hình thức thanh toán mới.
    
  • Tên hiển thị: Tên hiển thị cho phương thức thanh toán.
    
  • Mô tả: Thông tin mô tả phương thức thanh toán.
    
  • Ngân hàng & số tài khoản/số VA: Cho phép chọn tất cả các ngân hàng SePay đang hỗ trợ .

    1 Đối với các ngân hàng hiện đang hỗ trợ xác thực thanh toán thông qua số VA gồm: KienLongBank, OCB và MSB. SePay yêu cầu nhập số VA tương ứng.

    

    2 Đối với các ngân hàng còn lại, SePay yêu cầu nhập chính xác số tài khoản để có thể xác thực thanh toán.

    
  • Chủ tài khoản: Điền tên chủ tài khoản ngân hàng.
    
  • Tiền tố mã thanh toán: Điền giống với phần Tiền tố tại SePay. Xem tại phần Cấu hình chung.
    
  • Thông điệp thanh toán thành công: Nội dung thông báo trên website sau khi khách hàng thanh toán thành công. Hỗ trợ định dạng chữ thuần, HTML và Javascript. Nếu bạn muốn thêm code javascript để bắn sự kiện lên các trang tracking như Google Analytics, bạn có thể chèn mã Javascript tại đây.
    
  • Trạng thái đơn hàng sau thanh toán: Là Trạng thái đơn hàng tại WooCommerce sau khi khách thanh toán đủ. Nếu không chỉ định, trạng thái này sẽ do WooCommerce quyết định. Hoặc bạn có thể chỉ định là Đang xử lý (Proccessing) hoặc Đã hoàn tất (Completed).
    
  • Chế độ tải xuống sau khi thanh toán: Tùy chọn này dành cho các đơn hàng sản phẩm số, bạn có thể chỉ định cách mà người dùng tải xuống sản phẩm thông qua hình thức Thủ công hoặc Tự động.
    
  • Hiển thị tên ngân hàng: Chế độ hiện thị tên ngân hàng trên màn hình thanh toán, SePay hỗ trợ ba tùy chọn gồm: Tên đầy đủ, Tên viết tắt hoặc Tên đầy đủ kèm tên viết tắt.
    
• Chọn Lưu thay đổi để lưu các cấu hình trên.
• Copy key tại phần API Key để chuẩn bị thêm vào SePay ở bước tiếp theo.
  

Lưu ý:

• Phải điền chính xác các thông tin Ngân hàng, Số tài khoản, Chủ tài khoản.
• Bảo mật API Key của bạn, không được tiết lộ cho bất kỳ ai.

Bước 2: Tạo Webhook phía SePay.

Vào my.sepay.vn -> Tích hợp Webhooks -> Thêm Webhooks

Tại giao diện tạo tích hợp, điền các thông tin sau:

• Đặt tên cho tích hợp: Điền bất cứ tên nào. Ví dụ Tích hợp Woo.
• Bắn WebHooks khi: Chọn Có tiền vào
• Khi tài khoản ngân hàng là: Chọn tài khoản ngân hàng mà bạn điền ở bước 1.
• Bỏ qua nếu nội dung giao dịch không có Code thanh toán?: Chọn Có
• Gọi đến URL: Điền URL với cấu trúc https://website-cua-ban.com/wp-json/sepay-gateway/v1/add-payment . Thay https://website-cua-ban.com thành đường dẫn website của bạn.
• Là WebHooks xác thực thanh toán?: Chọn Đúng
• Kiểu chứng thực: Chọn API Key
• Request Content type: Chọn application/json
• API Key: Điền API Key đã copy ở bước 1

Bấm Thêm để hoàn tất.

Đến đây bạn đã hoàn tất tích hợp SePay với WooCommerce.

Kiểm tra các cấu hình của bạn

Để biết chúng mọi thứ có hoạt động đúng như cấu hình hay không. Bạn có thể thực hiện như sau:

• Thử đặt hàng trên website của bạn. Hãy chọn đơn hàng giá trị nhỏ nhất.
• Đến bước Thanh toán bạn chọn hình thức thanh toán là Chuyển khoản ngân hàng (Quét mã QR) như đã thêm ở bước 1.
• Nếu mã QR code hiện ra sau khi đặt hàng nghĩa là bạn đã cấu hình thành công.
• Thử thanh toán, nếu sau khi hoàn tất thanh toán, giao diện thanh toán hiện lên Bạn đã thanh toán thành công nghĩa là việc cấu hình đã chính xác. Đồng thời xem tại giao diện quản lý đơn hàng, bạn sẽ thấy đơn hàng được chuyển sang Đang xử lý (Processing).