공유 가능한 링크

공유 가능한 링크는 Wink의 핵심 기능이며, 인터넷에서 가장 간단한 방법인 하이퍼링크를 통해 인벤토리와 가격 정보를 동적으로 전달할 필요성에서 탄생했습니다.

https://trvl.as/3xWCH

위는 우리 링크 중 하나의 예시입니다. 짧고 휴대하기 편하며… 기억할 만큼 충분히 짧습니다. 짧지만 이 링크에는 다음과 같은 폭발적인 정보가 담겨 있습니다:

귀하의 App ID.
귀하의 Affiliate ID.
사용자에게 표시할 이미지 및 텍스트.
외관 및 느낌(즉, 테마, 색상 등).
가격 조회에 사용할 일정(성인 2명, 1박).
가격 표시 통화.
텍스트 표시 언어.

이 문서의 나머지 부분에서는 링크를 생성, 맞춤 설정 및 공유하는 방법을 안내합니다.

링크 생성

위 이미지는 검색에서 가져온 것으로, 검색 결과에서 할 수 있는 몇 가지 작업을 보여줍니다. 그 중 하나가 링크 만들기입니다. 해당 버튼을 클릭하면 공유 가능한 링크 양식 페이지로 리디렉션되어 링크 맞춤 설정을 시작할 수 있습니다.

링크 맞춤 설정

양식에서는 다음과 같은 방식으로 링크를 맞춤 설정할 수 있습니다:

링크가 무엇에 관한 것인지 기억할 수 있도록 이름을 지정합니다.
이 링크에 적용할 맞춤 설정을 선택합니다.
웹 크롤러에서 사용할 키워드를 쉼표로 구분하여 추가합니다.
선택적으로 X 계정 핸들이나 Facebook App ID를 입력합니다.
사용자가 볼 언어로 제목과 설명을 추가합니다.
Facebook이나 LinkedIn 같은 플랫폼에서 링크를 공유할 때 표시할 하나 이상의 이미지를 선택합니다.
선택한 이미지 위에 브랜드 디자인을 추가하는 테마/오버레이를 선택합니다. 참고: 이 방법으로 이미지 위에 가격이 표시됩니다.
저장 버튼을 클릭하여 계속합니다.

링크를 저장하면 공유 가능한 링크 페이지로 리디렉션되며, 이제 링크를 전 세계와 공유할 준비가 완료됩니다.

링크 공유

위 이미지는 링크에 사용할 수 있는 모든 작업을 보여줍니다:

미리보기 링크가 어떻게 구성되었고 사용자에게 어떻게 보일지 빠르게 확인할 수 있습니다.
업데이트 링크 구성을 업데이트합니다.
WinkLinks에 추가 링크를 WinkLinks 계정에 추가합니다.
복사 링크를 클립보드에 복사하여 어디서든 쉽게 공유할 수 있습니다(WinkLinks 포함).
공유 여러 소셜 네트워크 및 메시징 플랫폼에서 공유할 수 있는 새 창을 엽니다.
QR 코드 IG와 같이 이미지 중심 플랫폼에서 공유할 수 있는 QR 코드를 생성합니다.
임베드 이 링크를 광고 배너로 웹사이트에 임베드하는 방법을 보여줍니다.
WordPress와 함께 사용 이 링크를 웹사이트에 임베드하는 데 사용할 수 있는 WordPress 플러그인 사용법을 안내합니다.

아래에서 이 옵션들 중 일부를 자세히 다룹니다.

미리보기

미리보기를 클릭하면 테마가 적용된 이미지가 표시됩니다. Facebook과 같은 소셜 미디어에서 링크를 공유할 때, 피드에 제목과 설명과 함께 동일한 내용이 표시됩니다.

소셜 공유

공유 버튼을 클릭하면 즐겨 사용하는 소셜 네트워크 및 메시징 앱으로 직접 공유할 수 있는 편리한 새 창이 열립니다. 아이콘 버튼을 클릭하여 해당 네트워크에 링크를 게시하세요. 참고: 일부 버튼은 모바일 기기에서 공유할 때만 표시됩니다.

QR 코드

링크 대신 QR 코드를 공유하려면 QR 코드 버튼을 클릭하면 QR 코드가 표시된 새 창이 나타납니다.

QR 코드 저장 방법:

노트북에서는 이미지 위에서 마우스 오른쪽 버튼을 클릭하고 이미지 저장을 선택하세요.
모바일에서는:
- 이미지 위에 손가락을 누르고 있으면 사진에 저장할 옵션이 나타납니다.
- QR 코드 스크린샷을 찍고 적절히 자른 후 사진에 저장하세요.

임베드

<html>
  <head>
    <link rel="stylesheet" href="https://elements.wink.travel/styles.css"></link>
  </head>
  <body>
    <wink-content-loader
       layout="AD_BANNER"
       id="3xWCH"
    ></wink-content-loader>

    <script src="https://elements.wink.travel/elements.js" type="module" defer></script>

    <wink-app-loader
      client-id="YOUR CLIENT ID GOES HERE"
      configuration-id="YOUR CUSTOMIZATION ID GOES HERE"
    ></wink-app-loader>
  </body>
</html>

사이트에 광고 배너로 링크를 임베드하는 방법은 다음과 같습니다:

3번째 줄은 Wink 스타일을 사이트에 임베드하는 방법을 보여줍니다.
6~9번째 줄은 wink-content-loader 웹 컴포넌트를 사용하여 광고 배너를 가져오는 방법을 보여줍니다.
11번째 줄은 자바스크립트를 사이트에 임베드하는 방법을 보여줍니다.
13번째 줄은 wink-app-loader 웹 컴포넌트를 사용하여 페이지 수준 구성 설정을 가져오는 방법을 보여줍니다.

API

공유 가능한 링크를 관리하려는 개발자는 Developers > API > Inventory로 이동하세요.

추가 자료

웹 컴포넌트 모음에 대해 자세히 알아보세요.
Wink WordPress 플러그인에 대해 자세히 알아보세요.