# 2024.01.08 기능 업데이트 안내

안녕하세요! 2024년 새해 맞이 새로운 기능으로 돌아온 찰나입니다.😃\
찰나의 핵심 기능 중 하나인 플레이어 코드 복사 버튼이 새롭게 업데이트 되어 안내드려요!

## 첫째, 샵플레이어 UI가 새로워졌어요!

{% hint style="info" %}

* <mark style="color:purple;">**인스타그램 프로필 링크**</mark>를 누르면 샵플레이어와 함께 관련 상품 및 자사몰 페이지를 연결하고 싶은 분들이 읽으면 좋아요! 직접 재생 해보기 -> <https://player.charlla.io/shoplayer/eqFhheLgPLg><br>

  <figure><img src="https://1296347489-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FLKEFnVmIYlmffzSBEtw1%2Fuploads%2Fdlr0ARoeeO1YDON7MpRb%2F%EC%97%85%EB%8D%B0%EC%9D%B4%ED%8A%B8%EC%86%8C%EC%8B%9D9.png?alt=media&#x26;token=1bb8ceb3-1e5e-42e8-a17c-4d8581f2dcb6" alt=""><figcaption></figcaption></figure>
* <mark style="color:purple;">**할인이나 기획전을 마케팅**</mark>할 때 고객들에게 동영상과 연관된 상품을 함께 보여줄 수 있어요!&#x20;
  {% endhint %}

<figure><img src="https://1296347489-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FLKEFnVmIYlmffzSBEtw1%2Fuploads%2FLpJfXTncGVFF3jAqIa9T%2F%E1%84%8B%E1%85%A5%E1%86%B8%E1%84%83%E1%85%A6%E1%84%8B%E1%85%B5%E1%84%90%E1%85%B3%E1%84%89%E1%85%A9%E1%84%89%E1%85%B5%E1%86%A87.png?alt=media&#x26;token=8996630a-3b44-4ab3-8548-a9f42ddab7cc" alt=""><figcaption></figcaption></figure>

* 쇼핑몰 이름 위치 변경 : 기존에 배너 상단에 위치했던 쇼핑몰 이름(상호명)이 샵플레이어 상단으로 이동했어요. 배너위에 유용한 정보를 표기할 수 있도록 업데이트 예정이니 기대해 주세요.🥳
* 상품배너 UI 및 인터랙션 변경 : 상품 배너에 더보기 버튼이 새로 생겼어요. 더보기 버튼을 터치하면 동영상에 포함 된 다른 상품 목록을 한 번에 볼 수 있어요. 이제 스와이프 대신 간단히 터치해 주세요.

## 둘째, 링크 복사 버튼이 디스플레이어 URL -> 디스플레이어 코드로 변경되었어요

{% hint style="info" %}
상세페이지 편집에 **HTML**을 활용하시는 분들이 읽으면 좋아요!
{% endhint %}

찰나에서 가장 많이 사용되는 플레이어는 상세페이지에 추가하는 ‘디스플레이어'에요.

한 번의 클릭으로 디스플레이어 iframe을 복사하여 상세페이지 HTML 코드에 붙여넣을 수 있었는데요, 이때 사용하는 버튼의 이름이 **\[디스플레이어 코드]**&#xB85C; 변경되었어요.

<figure><img src="https://1296347489-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FLKEFnVmIYlmffzSBEtw1%2Fuploads%2FY6juj43TZZE1DPebLaYs%2F%E1%84%8B%E1%85%A5%E1%86%B8%E1%84%83%E1%85%A6%E1%84%8B%E1%85%B5%E1%84%90%E1%85%B3%E1%84%89%E1%85%A9%E1%84%89%E1%85%B5%E1%86%A81.png?alt=media&#x26;token=d4e4dc6d-d2b3-46a2-b289-8751a61839a4" alt=""><figcaption></figcaption></figure>

<figure><img src="https://1296347489-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FLKEFnVmIYlmffzSBEtw1%2Fuploads%2FMnMgpq5abCq2S3ieQ889%2F%E1%84%8B%E1%85%A5%E1%86%B8%E1%84%83%E1%85%A6%E1%84%8B%E1%85%B5%E1%84%90%E1%85%B3%E1%84%89%E1%85%A9%E1%84%89%E1%85%B5%E1%86%A82.png?alt=media&#x26;token=9da329b4-3b2f-4df3-9541-65e23c1c5b7b" alt=""><figcaption></figcaption></figure>

이름만 변경되었을 뿐 클릭으로 복사되는 기능과 위치는 변하지 않았으니 업데이트 후에도 같은 버튼으로 생각해 주세요! 클릭 전에 버튼 위에 마우스를 올리면 툴 팁으로 복사될 코드를 미리 볼 수 있어요.

🤔 <mark style="color:purple;">**링크랑 코드랑 뭐가 달라요?**</mark>

* 코드 : 코드를 복사해서 주소창에 붙여넣었을 때 동영상이 재생되지 않으면 플레이어 ‘코드'에요. HTML 코드를 사용한 페이지에서 재생할 수 있어요.
* 링크 : 링를 복사해서 주소창에 붙여넣었을 때 동영상이 재생되면 플레이어 ‘링크'에요.

## 셋째, 사이드바 > 상세정보에 \[디스플레이어 링크] 버튼이 추가되었어요

{% hint style="info" %}
상세페이지 편집에 에디봇과 같은 **노코드(No Code)툴**을 활용하시는 분들이 읽으면 좋아요!
{% endhint %}

찰나 디스플레이어 링크를 지원하는 노코드 툴(ex. 카페24 에디봇)로 상세페이지를 제작하신다면 \
사이드바 > 디스플레이어 > 상세 정보 > 링크 복사 > **\[디스플레이어 링크]**&#xBC84;튼을 클릭해 주세요.&#x20;

<figure><img src="https://1296347489-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FLKEFnVmIYlmffzSBEtw1%2Fuploads%2FTQIBdqO9q6ZzJrCE6ehr%2F%E1%84%8B%E1%85%A5%E1%86%B8%E1%84%83%E1%85%A6%E1%84%8B%E1%85%B5%E1%84%90%E1%85%B3%E1%84%89%E1%85%A9%E1%84%89%E1%85%B5%E1%86%A83.png?alt=media&#x26;token=0af1c80d-bc5a-4f06-9751-5935a05a2e4a" alt=""><figcaption></figcaption></figure>

클릭 한 번으로 링크를 복사 할 수 있도록 개선되었어요. (이전에는 드래그하여 링크를 복사하는 방식이었어요.)\
클릭 전에 버튼 위에 마우스를 올리면 툴 팁으로 복사될 링크를 미리 볼 수 있어요.

## 넷째, 사이드바 > 상세정보에 \[MP4동영상 링크] 버튼이 추가되었어요

{% hint style="info" %}

* **네이티브 모바일 앱**에서도 찰나에 업로드한 영상을 사용하고 싶으신 분들이 읽으면 좋아요.
* 보안상의 이유로 iframe으로 된 찰나 디스플레이어 코드를 쓸 수 없으신 분들이 읽으면 좋아요.
  {% endhint %}

MP4 동영상 링크를 이용하면 찰나 라이브러리에 업로드한 동영상을 MP4파일 형식으로 재생할 수 있어요.

MP4 파일 형식은 동영상 사용에 자유도가 높은 대신, 서비스에 맞춤 작업을 해야하기 때문에 복잡한 코딩이 필수적으로 필요해요. 찰나의 플레이어 설정도 **적용되지 않아요.**

사이드바 > 디스플레이어 > 상세 정보 > 링크 복사 > **\[MP4 동영상 링크]**&#xBC84;튼을 클릭해 주세요.&#x20;

<figure><img src="https://1296347489-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FLKEFnVmIYlmffzSBEtw1%2Fuploads%2FD4iK9Xz4mykMEpTq90pk%2F%E1%84%8B%E1%85%A5%E1%86%B8%E1%84%83%E1%85%A6%E1%84%8B%E1%85%B5%E1%84%90%E1%85%B3%E1%84%89%E1%85%A9%E1%84%89%E1%85%B5%E1%86%A84.png?alt=media&#x26;token=f0668947-429a-4e86-b6da-5dd6f481478e" alt=""><figcaption></figcaption></figure>

**\[MP4 동영상 링크]**&#xBC84;튼을 클릭하여 복사된 링크를 네이티브 앱에서도 찰나 동영상을 재생할 수 있어요.\
특정한 조건으로 인해 웹 플레이어를 자체적으로 개발한 경우에도 MP4 파일 형식을 이용해 찰나 동영상을 불러올 수 있어요.

사용 목적에 알맞은 링크 및 코드 복사 버튼으로 찰나 플레이어를 더 다앙하게 사용해 보세요!

## 다섯째, 디스플레이어를 항상 가운데 정렬하는 플레이어 설정이 추가되었어요

{% hint style="warning" %}

* <mark style="color:red;">**보통의 경우에는 ‘체크 해제'를 추천드려요.**</mark>
* <mark style="color:red;">**디스플레이어 코드를 사용할 때만 적용되는 설정이에요.**</mark>
  {% endhint %}

특정한 이유로 HTML을 사용하는 상세페이지에서 디스플레이어가 가운데 정렬이 되지 않을 경우, 가운데 정렬을 강제할 수 있는 설정이 추가되었어요.\
사이드바 > 플레이어 설정 > 동영상 채우기 on > 찰나 플레이어 영역 우선 + 항상 가운데 정렬에 체크 했을 때만 사용할 수 있는 ‘선택’ 설정이에요. <mark style="color:red;">`</> 디스플레이어 코드`</mark>를 붙여넣기 했을때만 적용돼요.

<figure><img src="https://1296347489-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FLKEFnVmIYlmffzSBEtw1%2Fuploads%2F745R57ZFp13tJcla7Ml1%2F4.png?alt=media&#x26;token=cb8a25e1-e6b9-4660-9300-e45902ce0c44" alt=""><figcaption></figcaption></figure>

<mark style="color:purple;">**보통의 경우에는 ‘체크 해제'를 추천드려요. 아래와 같은 유의사항 때문이에요.**</mark>

1. 항상 가운데 정렬 설정이 적용된 디스플레이어 왼쪽이나 오른쪽에 다른 이미지나 요소가 올 수 없어요.\
   디스플레이어의 세로 길이만큼 상세페이지 한 줄을 디스플레이어가 모두 차지해요.<br>

   <figure><img src="https://1296347489-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FLKEFnVmIYlmffzSBEtw1%2Fuploads%2FrULYN6sVoiHYDmDumsQT%2F5.png?alt=media&#x26;token=cb2e90b9-f3b0-451e-b474-74975cd8e8f7" alt=""><figcaption></figcaption></figure>
2. 상세페이지 편집기 자체에 '가운데 정렬'이 있다면 항상 가운데 정렬을 체크했을 때 가운데 정렬이 안 되는 경우가 있어요. \
   1\. 편집기에 있는 정렬을 먼저 적용\
   2\. 실제 페이지에서 정렬되지 않을 경우 찰나의 가운데 정렬 체크\
   3\.  <mark style="color:red;">`</> 디스플레이어 코드`</mark> 복사, 다시 붙여넣기 해주세요.

2024년에 더 발전하는 찰나가 될게요!