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

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

Tài liệu này sẽ hướng dẫn bạn nhúng module Tìm kiếm và Đặt vé máy bay của Datacom lên website hoặc ứng dụng của bạn. Sau khi tích hợp, website, ứng dụng của bạn sẽ ngay lập tức có được tính năng Đặt vé máy bay cực kỳ mạnh mẽ và tiện lợi.

Chuẩn bị

Trước khi bắt đầu, bạn cần chuẩn bị các thông tin sau:

  • Mã nguồn website của bạn, bao gồm:
    • Trang chứa form Tìm kiếm (bắt buộc), ví dụ: /home hoặc /index
    • Trang chứa form Đặt vé (không bắt buộc), ví dụ: /flight hoặc https://yourdomain.com/flight
  • Mã đại lý: Được Datacom cung cấp, hoặc tự đăng ký tại đây

Bước 1: Tích hợp form Tìm kiếm

Sao chép và dán đoạn mã dưới đây vào mã nguồn (HTML) website của bạn, tại vị trí muốn hiển thị form Tìm kiếm:

Lưu ý : Thay DC120386 trong đoạn mã thành Mã đại lý mà bạn đã được cấp. 

<div id="dtc-plugin" data-flight-url="/flight" data-key="DC120386"></div>
<script type="text/javascript">
(function () {
    var dtcScript = document.createElement('script');
    dtcScript.src = 'https://plg.datacom.vn/js/plugin.js';
    dtcScript.setAttribute('asp-append-version', 'true');
    document.head.appendChild(dtcScript);
})();
</script>

Nhập giá trị các tham số ở thẻ  <div id="dtc-plugin"></div> để tùy chỉnh bộ nhúng:

Trường thông tin Mô tả Bắt buộc Ví dụ
data-key Mã đại lý Có DC120386
data-flight-url Đường dẫn trang Đặt vé Không /flight

Tải lại website, nếu trang của bạn xuất hiện form Tìm kiếm chuyến bay, tức là đã tích hợp thành công, ví dụ minh họa:

Nếu bạn không nhập  data-flight-url, khi người dùng bấm nút Tìm chuyến bay, phần Đặt vé sẽ xuất hiện trên cùng trang mà bạn nhúng form Tìm kiếm.

Nếu bạn muốn phần Đặt vé hiển thị ở một trang khác, vui lòng nhập  data-flight-url, và thực hiện tiếp Bước 2:

 

Bước 2: Tích hợp trang Đặt vé

Sao chép và dán đoạn mã dưới đây vào mã nguồn (HTML) website của bạn, tại vị trí muốn hiển thị phần Đặt vé:

Lưu ý : Thay  DC120386 trong đoạn mã thành Mã đại lý mà bạn đã được cấp.

<div id="dtc-plugin" data-key="DC120386"></div>
<script type="text/javascript">
(function () {
    var dtcScript = document.createElement('script');
    dtcScript.src = 'https://plg.datacom.vn/js/plugin.js';
    dtcScript.setAttribute('asp-append-version', 'true');
    document.head.appendChild(dtcScript);
})();
</script>

Nhập giá trị các tham số ở thẻ <div id="dtc-plugin"></div> như ở Bước 1

Sau khi tích hợp, phần hiển thị Kết quả tìm kiếm chuyến bay và Đặt vé sẽ xuất hiện như minh họa dưới đây: