> For the complete documentation index, see [llms.txt](https://support.charlla.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://support.charlla.io/userguide/library/oepn_sidebar/tap_dis.md).

# 디스플레이어 탭

## 동영상 제목 변경 <a href="#undefined" id="undefined"></a>

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

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

1. \[라이브러리] > \[동영상 탭]에서 편집을 원하는 동영상을 클릭해 주세요.
2. \[사이드바]가 표시되면  \[디스플레이어 탭] > \[동영상 제목]에서 원하는 제목을 입력하세요.
3. &#x20;**\[저장 및 업데이트] 버튼**을 클릭하면 동영상 목록에 제목이 반영돼요.&#x20;

## 플레이어 설정 변경

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

1. \[사이드바] > \[디스플레이어 탭] > \[플레이어 설정]에서 토글을 On/off 하여 원하는 설정을 적용하세요.
2. 디스플레이어 설정을 수정한 후 **\[저장 및 업데이트] 버튼**을 클릭할 경우, 해당 동영상 url이 사용된 모든 페이지의 플레이어가 자동으로 업데이트됩니다.

{% hint style="danger" %} <mark style="color:red;">**동영상 채우기 설정을 변경할 경우는 플레이어 코드 및 링크를 교체해야 합니다.**</mark>\ <mark style="color:red;">**\[사이드바] > \[저장 및 업데이트] > \[링크]버튼 > \[디스플레이어 코드 또는 링크복사] > \[웹 페이지 편집기에 붙여넣기]**</mark>
{% endhint %}

### 컨트롤 바

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

* 컨트롤 바 on : 재생 버튼, 볼륨 조절 등 컨트롤 바가 동영상 위에 표시됩니다.
* 컨트롤 바 off : 재생, 볼륨을 조절하는 컨트롤바가 동영상 위에 표시되지 않아요. 동영상을 조작할 필요가 없고 이미지처럼 깔끔하게 활용하고 싶을 때 이용하세요.

### 자동재생

{% hint style="danger" %} <mark style="color:red;">**자동 재생 on을 설정하면 동영상이 재생될 때 소리가 없는 음소거 상태로 동영상이 재생됩니다.**</mark>
{% endhint %}

* 자동재생 on : 시청자가 재생 버튼을 누르지 않아도 페이지가 로딩되는 순간 동영상이 자동으로 로드됩니다. 이때, 소리는 음소거인 채로 자동 재생됩니다.&#x20;
* 자동재생 off : 시청자가 재생버튼을 누를 때만 동영상이 자동 재생됩니다.&#x20;

### 반복재생

* 반복재생 on : 동영상이 끝나도 끊기지 않고 다시 처음부터 재생됩니다.&#x20;
* 반복재생 off : 동영상이 끝나면 재생이 끊깁니다. 시청자가 재생 버튼을 클릭해야만 동영상이 처음부터 다시 재생됩니다.&#x20;

### 동영상 채우기

{% hint style="danger" %} <mark style="color:red;">**동영상 채우기 설정을 변경할 경우는 플레이어 링크를 교체해야 합니다.**</mark>\ <mark style="color:red;">**\[사이드바] > \[링크]버튼 > \[디스플레이어 코드 또는 링크복사] > \[웹 페이지 편집기에 붙여넣기]**</mark>
{% endhint %}

### 동영상 채우기 off <a href="#videofit" id="videofit"></a>

처음 설정은 동영상 채우기 Off로 되어있어요.

{% tabs %}
{% tab title="크기 조절" %}

* 영상의 크기를 숫자로 입력해서 조절할 수 있어요.
* 왼쪽 동영상 하단의 **\[미리보기 버튼]**&#xC73C;로 입력한 크기가 어떻게 표시되는지 확인할 수 있어요.
* 크기를 입력하지 않으면 동영상 원본 크기가 적용되어 있어요.
* 최소 200px \~ 최대 1920px까지 가로 크기를 입력할 수 있어요.

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

채우기 Off ➡️ 가로 크기 변경 ➡️ 저장 및 업데이트 ➡️ 상단의 **\[코드 복사]**&#xD558;면 사용할 수 있어요.

<figure><img src="/files/HwdTlUHrM6Ftzll4wjEB" alt="" width="375"><figcaption></figcaption></figure>
{% endtab %}

{% tab title="항상 가운데 정렬" %}
**✅항상 가운데 정렬 체크**

* 찰나 플레이어가 HTML 편집 페이지 중앙으로 자동 배치돼요.
* 단, HTML 편집 페이지에서 제공하는 **텍스트 가운데 정렬이 적용되지 않아요.**

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

**항상 가운데 정렬 체크해제**

* 항상 가운데 정렬 체크를 해제하면 찰나 플레이어가 왼쪽으로 배치돼요.
* 단, html 편집 페이지에서 제공하는 **텍스트 가운데 정렬** 기능을 사용할 수 있어요.

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

쇼핑몰에 사용 중인 스킨과 커머스 플랫폼 별로 작성 방식에 차이가 있을 수 있어요.\
테스트 후 각 쇼핑몰에 알맞는 설정을 저장해주세요.
{% endtab %}
{% endtabs %}

### 동영상 채우기 On

특정 영역에 동영상을 채우고 싶다면 채우기 On 하세요

* 디자인 스킨을 사용하거나 웹사이트 자체 제작으로 동영상 영역이 지정된 경우, 채우기 On을 사용하세요
* 사용자가 만든 영역의 가로 크기에 영상을 딱 맞게 채우는 기능이에요.
* 만들어진 영역의 크기를 자동으로 계산해요.
* 찰나 플레이어 설정창에서는 크기를 설정할 필요가 없어요.

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

채우기 On ➡️ 저장 및 업데이트 버튼 ️➡️ 코드 복사하면 사용할 수 있어요.

<figure><img src="/files/rGyndyxX69bCIKHl3tQ4" alt="" width="375"><figcaption></figcaption></figure>


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## 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, and the optional `goal` query parameter:

```
GET https://support.charlla.io/userguide/library/oepn_sidebar/tap_dis.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

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.