콘텐츠로 이동

지금 예약 버튼

지금 예약(BOOK NOW) 버튼은 숙박 업계에서 널리 사용되는 용어로, 호텔이 해당 숙소의 가용성과 가격을 알고 여행자가 객실을 예약할 수 있도록 하는 공급자와의 자체 통합을 의미합니다. 이 버튼은 호텔이 자체 웹사이트에서 자체 조건으로 객실을 판매할 수 있는 가장 간단한 방법입니다.

많은 호텔이 채널 매니저에서 제공하는 번들 예약 엔진을 사용합니다. 하지만 호텔이 특정 예약 엔진을 선택하기 전에 네이티브 예약 엔진을 조사하고 비교해보는 것을 권장합니다.

이 문서는 주로 무료 고전환율 예약 엔진을 호텔 웹사이트에 설치하려는 호텔을 위한 것입니다.
하지만… 우리 기술을 웹사이트에 적용하려는 모든 분에게도 유익한 내용입니다.

가장 간단한 통합을 위해 공유 가능한 링크를 사용하는 것을 권장합니다.

다음은 그 절차입니다:

  1. https://extranet.wink.travel 에 접속합니다.
  2. 오른쪽 상단의 로그인 / 회원가입을 클릭하고 사용자 계정으로 로그인합니다.
  3. 왼쪽 상단 드롭다운에서 작업할 숙소를 선택합니다.
  4. 내비게이션 바에서 예약 엔진을 클릭합니다.
  5. 페이지에 링크가 표시됩니다.
  6. 이 링크를 웹마스터에게 전달하고 지금 예약(BOOK NOW) 버튼에 사용합니다.
  7. 완료 ✅.

링크에는 이미 선택한 커스터마이제이션에서 유래한 일정이 URL에 포함되어 있습니다.
링크를 더 맞춤화하려면:

  • 선택한 커스터마이제이션 변경 또는
  • 일정을 재정의

이 문서에서는 후자에 집중합니다. 이는 여행자가 웹사이트에서 일정을 선택하고 Wink 예약 엔진으로 전달할 수 있는 더 큰 자유를 제공합니다.

자신만의 일정을 URL과 함께 전달하는 방법은 다음과 같습니다.

유효한 요청 매개변수:

  • sd 시작 날짜 추가: sd=2024-08-24
  • n 숙박 일수 추가: n=1 또는
  • ed 종료 날짜 사용: ed=2024-08-25
  • rc 투숙객: rc=a2 (성인 2명)
  • l 표시 언어 요청: l=es
  • c 표시 통화 요청: c=EUR
  • p 프로모션 추가: p=ABC123

URL 예시는 다음과 같습니다:

https://trvl.as/abc123?sd=2024-08-24&n=1&rc=a2&l=es&c=EUR

더 고급 사용 사례로, + 기호를 사용해 여러 객실 구성을 요청할 수도 있습니다:

예시:

https://trvl.as/abc123?sd=2024-08-24&n=1&rc=a2-ca16q1-ca8q1+a2&l=es&c=EUR

  • 객실 유형 1 = 성인 2명, 어린이 2명 (16세 + 8세)
  • 객실 유형 2 = 성인 2명

샘플 지금 예약(BOOK NOW) 버튼 HTML:

이 샘플은 기본 CSS 라이브러리로 Bootstrap을 사용한다고 가정합니다.

<a
href="https://trvl.as/abc123"
target="_blank"
class="btn btn-lg btn-primary"
title="객실 예약"
>
지금 예약
</a>

우리 링크를 지금 예약 버튼으로 사용하면 다음과 같은 추가 이점이 있습니다.

  • 소셜 친화적 링크는 소셜 미디어에서 쉽게 공유할 수 있으며, 선택한 이미지 위에 동적 가격을 표시합니다.
  • 짧음 URL이 매우 공유하기 쉬워 인스타그램 프로필 URL 등에도 사용할 수 있습니다.

일부 호텔은 웹사이트에 더 많은 기능과 깊은 통합을 원합니다. 이 예시는 카드를 웹사이트에 임베드하는 방법을 다룹니다.

다음은 그 절차입니다:

  1. https://studio.wink.travel 에 접속합니다.
  2. 오른쪽 상단의 로그인 / 회원가입을 클릭하고 사용자 계정으로 로그인합니다.
  3. 왼쪽 상단에서 작업할 숙소를 선택합니다.
  4. 메인 내비게이션 바에서 검색을 클릭합니다.
  5. 숙소 이름을 입력하고 검색 버튼을 클릭합니다.
  6. 검색 결과 카드에서 작업 링크를 클릭하고 생성 > 카드 만들기를 선택합니다.
  7. 카드가 생성됩니다.
  8. 오른쪽 상단에 카드가 준비되었으며 추가 커스터마이징이 가능한 메시지가 표시됩니다.
  9. 메인 내비게이션 바에서 도구 > 카드를 클릭하면 새 카드를 볼 수 있습니다.
  10. 카드의 작업 링크를 클릭하고 임베드를 클릭합니다.
  11. 새 창이 열리며 복사할 수 있는 샘플 HTML 코드가 표시됩니다.
  12. 클라이언트-ID를 확인하려면 Applications으로 이동합니다.
  13. 구성-ID를 확인하려면 Customization으로 이동합니다.
  14. 완료 ✅.

샘플 임베드 카드 HTML:

<wink-content-loader
layout="GUEST_ROOM"
id="09d7cca4-6ff6-11ef-949b-42004e494300"
></wink-content-loader>

위 HTML 샘플에는 필요한 Wink CSS 및 Javascript가 포함되어 있지 않으며, 카드만 포함되어 있습니다.

카드 미리보기
가용성이 표시된 전면 객실 유형 카드

예약자는 이제 동적 가격을 확인하고 일정을 변경하며 웹사이트에서 직접 예약할 수 있습니다. 예약 버튼을 클릭하면 결제를 완료할 수 있는 Wink 숙소 랜딩 페이지로 이동합니다.