Google sử dụng công nghệ AI để dịch nội dung sang ngôn ngữ bạn ưu tiên. Bản dịch bằng AI có thể có lỗi.

Giá khách sạn: bật tính năng điều hướng bằng trình thu thập dữ liệu và gắn thẻ giá

Hướng dẫn này trình bày cách gắn thẻ trang web của bạn bằng vi dữ liệu và thuộc tính điều hướng để trình thu thập thông tin về độ chính xác của giá của Google có thể tự động điều hướng trong phễu đặt phòng và xác thực giá phòng của bạn.

Để biết quy cách kỹ thuật đầy đủ của tất cả các thuộc tính dữ liệu có cấu trúc hiện có (bao gồm cả thuế, phí và thông tin chi tiết về phòng theo từng khoản), hãy xem tài liệu tham khảo về dữ liệu có cấu trúc về giá khách sạn.

1. Triển khai thành phần điều hướng (`data-nav-*`)

Sử dụng các thuộc tính HTML data-nav-* tuỳ chỉnh để chú thích các phần tử tương tác và khai báo các giai đoạn trong phễu để trình thu thập thông tin có thể đi qua quy trình đặt phòng của bạn.

1.1 Khai báo giai đoạn ở đầu trang (`data-nav-stage`)

Mỗi trang trong phễu đặt phòng hiển thị giá đều phải khai báo giai đoạn của trang, được đính kèm vào thẻ <body> hoặc thẻ bao bọc chính (chẳng hạn như <div>, <section> hoặc <main>). Điều này cho biết trình thu thập dữ liệu giai đoạn nào của quy trình đặt phòng đang hoạt động và hỗ trợ khắc phục sự cố sau này.

data-nav-stage (Nên dùng): Khai báo giai đoạn của phễu đang hoạt động. Mặc dù không bắt buộc, nhưng việc chỉ định tên (ví dụ: "landing", "room-selection", "checkout", "ready-for-payment") sẽ giúp xác định giai đoạn đang hoạt động trong quá trình xác thực.

1.2 Chỉ báo giai đoạn cuối (`data-nav-stage-final`)

Trên trang cuối cùng hiển thị giá trước khi người dùng nhập thông tin cá nhân hoặc thông tin thanh toán, hãy thêm cờ giai đoạn cuối vào vùng chứa đầu trang cùng với một khai báo giai đoạn (ví dụ: data-nav-stage="ready-for-payment").

data-nav-stage-final (Không bắt buộc): Đặt thành "true" (data-nav-stage-final="true") trên trang giá cuối cùng trước khi thanh toán. Điều này cho biết với trình thu thập dữ liệu rằng trang này là trang cuối cùng và bạn có thể trích xuất giá để xác thực. Trang này phải chứa cấu trúc giá có gắn thẻ vi dữ liệu.

1.3 Thuộc tính tương tác trên đường dẫn quan trọng

Trên các trang trung gian, hãy gắn thẻ các phần tử tương tác (nút hoặc đường liên kết) giúp người dùng chuyển sang bước tiếp theo trong lộ trình đặt phòng quan trọng. Nếu cần thực hiện nhiều thao tác trên cùng một trang, hãy chỉ định thứ tự thực hiện. Trình thu thập thông tin tuân theo thứ tự được chỉ định trước khi cố gắng trích xuất giá trên trang cuối cùng.

Thuộc tính	Giá trị bắt buộc	Mục đích
`data-nav-criticalpath`	`"true"`	Đánh dấu nút/đường liên kết bắt buộc mà trình thu thập dữ liệu phải nhấp vào để chuyển sang bước tiếp theo.
`data-nav-interactiontype`	`"CLICK"`	Khai báo rằng cần có thao tác nhấp để chuyển sang bước tiếp theo trong quy trình.
`data-nav-interactionorder`	`"1"`, `"2"`, ...	Khai báo trình tự thực thi nếu cần thực hiện nhiều thao tác trên cùng một trang.

Ví dụ tối giản về điều hướng

<button data-nav-criticalpath="true"
        data-nav-interactiontype="CLICK"
        data-nav-interactionorder="1">
  Continue
</button>

2. Khai báo giá (vi dữ liệu)

Trên trang cuối cùng mà người dùng có thể truy cập trong quy trình đặt phòng (trước khi nhập thông tin cá nhân hoặc thông tin thanh toán), hãy gắn thẻ cho sản phẩm giá (một sản phẩm giá) bằng thẻ vi dữ liệu. Bạn chỉ nên gắn thẻ một ưu đãi trên trang, cho biết mức giá mà trình thu thập dữ liệu trích xuất, tương ứng với mức giá được chọn trên Google trước khi người dùng truy cập vào trang web của bạn. Để biết thông tin chi tiết về cách xác định các tham số trang đích, hãy xem biến và điều kiện.

Mặc dù Google hỗ trợ đầy đủ hệ thống phân cấp hoàn chỉnh trong tài liệu tham khảo về dữ liệu có cấu trúc về giá khách sạn (bao gồm giá cơ sở theo từng mục, thuế, phí và thông tin phòng riêng lẻ), Google cũng chấp nhận cây dữ liệu có cấu trúc đơn giản để giúp bạn dễ dàng gắn thẻ giá khách sạn trên các trang web của mình.

Bạn phải cung cấp tổng giá lưu trú cho các mức giá hiện có. Nếu một hành trình hoặc phòng không có sẵn hoặc đã bán hết, hãy khai báo https://schema.org/SoldOut trong makesOffer mà không có priceSpecification:

<div itemprop="makesOffer" itemscope itemtype="https://schema.org/Offer">
  <meta itemprop="availability" content="https://schema.org/SoldOut"/>
  Sold Out
</div>

Để biết thêm thông tin, hãy xem quy cách thuộc tính availability.

2.1 Cây dữ liệu có cấu trúc đơn giản

Để đơn giản hoá việc gắn thẻ trên các trang đặt phòng, bạn chỉ cần khai báo vùng chứa gốc của khách sạn và đặt phòng, ngày lưu trú (YYYY-MM-DD), số người lưu trú và một ưu đãi duy nhất có chứa tổng giá lưu trú:

Hotel / LodgingReservation (Root Container)
├── identifier                   [Meta/Attribute] Hotel ID
├── name                         [Visible text] Hotel Name
├── checkinTime / checkoutTime   [Visible text with YYYY-MM-DD in content="..."] Stay Dates
├── numAdults / numChildren      [Visible text] Occupancy
└── makesOffer (Offer)
    └── priceSpecification (CompoundPriceSpecification)
        ├── priceCurrency        [ISO Code, such as "USD"] Currency
        └── price                [Visible text] Total Stay Price (Taxes & Fees Included)

2.2 Quy tắc hiển thị quan trọng

Để đảm bảo trích xuất giá một cách đáng tin cậy, hãy tuân thủ các quy tắc về khả năng hiển thị sau đây khi gắn thẻ HTML:

Tổng giá lưu trú phải xuất hiện: Gắn thẻ trực tiếp số giá xuất hiện trên trang bằng cách sử dụng itemprop="price". Đừng sử dụng siêu dữ liệu ẩn (<meta>) hoặc giá trị thuộc tính (value="..." hoặc content="...") cho số giá.
Ngày lưu trú mà máy có thể đọc được: Gắn thẻ ngày lưu trú mà người dùng nhìn thấy trên trang nhiều nhất có thể. Nếu cần, bạn có thể sử dụng thuộc tính content="..." trên các phần tử <span> để cung cấp định dạng YYYY-MM-DD tiêu chuẩn trong khi hiển thị ngày có thể nhìn thấy (ví dụ: <span itemprop="checkinTime" content="2026-08-10">August 10, 2026</span>).
Các trường không hiển thị: Các trường không hiển thị trực tiếp trên trang (chẳng hạn như mã khách sạn hoặc mã đơn vị tiền tệ) có thể sử dụng thẻ <meta> hoặc thuộc tính content="...".

3. Ví dụ

Các ví dụ toàn diện sau đây cho thấy cách gắn thẻ các bước trung gian trong phễu và trang thanh toán cuối cùng bằng thuộc tính điều hướng và vi dữ liệu.

Ví dụ 1: trang trung gian có nút có thể nhấp

Đoạn mã sau đây minh hoạ một trang chọn phòng trung gian (room-selection) có một nút hành động theo đường dẫn quan trọng duy nhất được gắn thẻ để chuyển sang bước tiếp theo của quy trình:

<body data-nav-stage="room-selection">
  <!-- Main page content -->
  <button class="btn-continue"
          data-nav-criticalpath="true"
          data-nav-interactiontype="CLICK"
          data-nav-interactionorder="1">
    Book This Room
  </button>
</body>

Ví dụ 2: trang giá cuối cùng có chỉ báo giai đoạn và vi dữ liệu tối thiểu

Đoạn mã sau minh hoạ trang cuối cùng trước khi thanh toán (ready-for-payment) trong đó data-nav-stage-final="true" được khai báo trên trình bao bọc và giá lưu trú có thẩm quyền được hiển thị rõ ràng:

<body data-nav-stage="ready-for-payment" data-nav-stage-final="true">

  <!-- Root Container: Co-Typed Hotel & LodgingReservation -->
  <div itemscope itemtype="https://schema.org/Hotel https://schema.org/LodgingReservation">
    
    <!-- Hotel Identifier (Can be hidden meta tag) -->
    <meta itemprop="identifier" content="grand-view-001" />
    <h1 itemprop="name">Grand View Hotel</h1>
    
    <!-- Visible Stay Dates & Occupancy -->
    <p>
      Check-in: <span itemprop="checkinTime" content="2026-08-10">Aug 10, 2026</span> |
      Check-out: <span itemprop="checkoutTime" content="2026-08-15">Aug 15, 2026</span> |
      Guests: <span itemprop="numAdults">2</span> Adults, <span itemprop="numChildren">1</span> Child
    </p>

    <!-- Single Minimal Rate Offer -->
    <div itemprop="makesOffer" itemscope itemtype="https://schema.org/Offer">
      <div itemprop="priceSpecification" itemscope itemtype="https://schema.org/CompoundPriceSpecification">
        
        <p class="summary-total">
          Total Stay Price (Taxes & Fees Included):
          
          <!-- 3-letter ISO Currency Code (can use content="" for hiding the 3-letter currency code while displaying a symbol) -->
          <span itemprop="priceCurrency" content="EUR">€</span>
          
          <!-- VISIBLE TOTAL STAY PRICE (Directly wrapped, no hidden attributes) -->
          <span itemprop="price">650.00</span>
        </p>

      </div>
    </div>

  </div>

</body>

4. Xác minh quá trình triển khai

Trước khi triển khai các thay đổi, hãy kiểm tra mã đánh dấu và thẻ điều hướng để đảm bảo trình thu thập thông tin có thể xác thực thành công dữ liệu về giá của bạn.

4.1 Xác minh cấu trúc giá và vi dữ liệu

Bạn có thể sử dụng Trình xác thực Schema.org hoặc Công cụ kiểm tra kết quả nhiều định dạng của Google để kiểm tra vi dữ liệu được trích xuất từ URL trang hoặc nội dung HTML của bạn. Xác minh các trường đã trích xuất dựa trên quy cách trong tài liệu tham khảo về dữ liệu có cấu trúc về giá khách sạn và đảm bảo rằng phần tử itemprop="price" là một mục có thể nhìn thấy trên trang.

4.2 Xác minh thành phần điều hướng

Để xác minh thẻ, hãy mở Công cụ cho nhà phát triển trình duyệt trong Google Chrome bằng cách nhấp chuột phải vào trang web của bạn rồi chọn Kiểm tra (hoặc nhấn F12) để kiểm tra DOM HTML.

Xác nhận rằng việc triển khai của bạn đáp ứng các yêu cầu sau về thành phần điều hướng:

Giai đoạn đầu trang được khai báo: Mọi trang trong quy trình đặt phòng đều có data-nav-stage="..." trên thẻ <body> hoặc thẻ bao bọc gốc, còn trang giá cuối cùng có data-nav-stage-final="true".
Đã hoàn tất đường dẫn quan trọng: Các trang trung gian có các phần tử tương tác (nút hoặc đường liên kết) được đánh dấu bằng data-nav-criticalpath="true", data-nav-interactiontype và data-nav-interactionorder. Nếu có nhiều thao tác, hãy đảm bảo rằng bạn đã đặt đúng số đơn đặt hàng.

4.3 Xác minh khả năng hiển thị và chất lượng của mã đánh dấu

Xác nhận rằng vi dữ liệu của bạn đáp ứng tất cả các yêu cầu về cấu trúc và khả năng hiển thị (để biết thông tin chi tiết, hãy xem cây dữ liệu có cấu trúc đơn giản và các quy tắc quan trọng về khả năng hiển thị):

Hệ thống phân cấp nghiêm ngặt: Đảm bảo mã đánh dấu của bạn tuân theo thứ tự lồng ghép bắt buộc (có thể là cây đơn giản hoặc quy cách tham chiếu dữ liệu có cấu trúc đầy đủ). Trình thu thập thông tin có thể bỏ lỡ các phần tử không theo thứ tự hoặc được lồng không đúng cách.
Giá hiển thị: itemprop="price" trực tiếp bao bọc số giá hiển thị mà không có thuộc tính ẩn hoặc thẻ <meta>.
Ngày lưu trú mà máy có thể đọc: checkinTime và checkoutTime chứa YYYY-MM-DD tiêu chuẩn (bạn có thể tuỳ ý sử dụng thuộc tính content="...").
Gắn thẻ trực tiếp cho phần tử: Tất cả các thuộc tính hiển thị (tên khách sạn, ngày lưu trú, số người lưu trú) đều bao bọc văn bản hiển thị trên trang.