공유 가능한 링크

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

https://trvl.as/3xWCH

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

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

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

링크 생성

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

링크 맞춤 설정

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

링크가 무엇에 관한 것인지 기억할 수 있도록 이름을 지정합니다.
이 링크에 적용할 맞춤 설정 을 선택합니다.
웹 크롤러 가 사용할 키워드를 쉼표로 구분하여 추가합니다.
선택적으로 X 계정 핸들이나 Facebook 앱 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

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

추가 자료

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