# 시작하기

<div align="center"><figure><img src="/files/2yqoWDQ4s6evq3fpbHx0" alt=""><figcaption></figcaption></figure></div>

인앱 게임 외 기타 애플리케이션을 사용하시는 경우 블리피에서는 Web 기반의 HTML 임베디드 코드를 제공합니다.\
임베디드 코드는 기본 HTML 구조로 구성되며 <mark style="color:blue;">`iframe`</mark>을 통해 런처를 렌더링하게 됩니다.\
서비스 내에서 런처를 호출할 수 있는 UI 트리거를 생성하세요. 생성된 UI 트리거로 유저에게 다양한 블리피 애플리케이션을 제공할 수 있습니다.

***

## 임베디드 코드 확인하기

* [<mark style="color:orange;">\[Client Admin\]</mark>](https://client-admin.bleepy.io/)에서 자사의 프로모션을 생성합니다.
* <mark style="color:blue;">`[프로모션 관리]`</mark> > <mark style="color:blue;">`[프로모션 목록]`</mark> > <mark style="color:blue;">`[프로모션 상세]`</mark> > <mark style="color:blue;">`[개발 정보 확인하기 팝업]`</mark>에서 임베디드 기본 정보를 확인 할 수 있습니다.

<figure><img src="/files/q1qEn9YvVby0E5aN9oJ4" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/RhZjhTaH0pnztscXxCEg" alt=""><figcaption></figcaption></figure>

Ⓐ 개발 정보 확인하기 : 프로모션을 등록하시면 프로모션 상세 페이지에 해당 버튼이 노출되며, 버튼 클릭 시 임베디드 코드가 표시된 팝업창이 호출됩니다.

Ⓑ 임베디드 코드 : 자사 서비스에서 원하는 위치에 블리피 애플리케이션을 실행할 수 있도록 HTML 코드 형태로 제공되며, <mark style="color:blue;">`iframe`</mark>에 런처 호출 URL이 로드됩니다.

ⓒ userKey 설정 : 블리피 애플리케이션은 userKey 정보를 필수로 요구합니다. 유저를 구분할 수 있는 유니크한 key 값으로 직접 설정이 필요한 부분입니다. 자사 서비스의 회원 DB 정보 중 유니크한 값을 해당 값과 매핑 시키는 것을 추천드립니다.

{% hint style="danger" %}
블리피에서 제공하는 Secret Key의 보안 관리에 대한 책임은 클라이언트에게 있습니다. 재발급은 불가능하므로 외부로 유출되지 않도록 주의하시길 바랍니다.&#x20;
{% endhint %}

{% hint style="info" %}
개발에 대한 추가 설명이 더 필요하신가요?

"[<mark style="color:orange;">\[Client Admin\]</mark>](https://client-admin.bleepy.io/login) 로그인 → 오른쪽 하단 채널톡 위젯" 클릭 후 개발 카테고리에 문의 남겨주시면 기술 개발팀에서 확인 후 연락드리겠습니다.
{% endhint %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://bleepy.gitbook.io/bleepy-developers/etc-promotion/start.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.