> For the complete documentation index, see [llms.txt](https://help.livebuy.tv/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.livebuy.tv/faq/embed-video-in-product/shopline.md).

# SHOPLINE | 嵌入影片

## SHOPLINE 商品頁嵌入影片

此項教學會帶您一步步完成影片嵌入的設定，讓消費者可在商品頁直接觀看商品介紹影片，提高消費者對於商品理解與興趣。

### 📌 步驟一：準備影片來源

#### 確保影片已上傳至 Livebuy 後台

在開始之前，請優先確認您的商品影片已正確上傳至 Livebuy 後台，並將「 [影片可見度](/product-tour/videos.md#ying-pian-ke-jian-du-she-ding) 」調整成「 僅連結可見 」的狀態。

### 📌 步驟二：取得影片嵌入代碼 ( IFrame )

#### 從影片播放頁面取得影片嵌入碼

進入 Livebuy 後台的「 影片總覽 」，點選您要的商品影片，再點選影片連結，進入影片播放頁面後，點擊「 分享 」，找到「 嵌入」，選取「 IFrame 」即可取得影片嵌入代碼。

<figure><img src="/files/pEXy3fQ3uATG7akdoirH" alt=""><figcaption><p>影片嵌入碼 - 1</p></figcaption></figure>

<figure><img src="/files/O6usPVZ0gFlfOk7lW97K" alt=""><figcaption><p>影片嵌入碼 - 2</p></figcaption></figure>

### 📌 步驟三：開啟 SHOPLINE 商品頁面的商品描述欄位

#### 設定 SHOPLINE 後台商品資訊中的「 商品描述 」

在 SHOPLINE 後台，選取需要的商品，並進入編輯，找到商品資訊頁面，再找到「 商品描述 」編輯欄位，選取「 Toggle HTML 」進行設定。

<figure><img src="/files/49f1kFxsOSYZwohqvY8w" alt=""><figcaption><p>商品描述欄位</p></figcaption></figure>

### 📌 步驟四：嵌入影片

#### 貼上已複製的影片嵌入代碼

將先前取得的影片嵌入碼，輸入至「 商品描述 」中的「Toggle HTML 」再儲存即可嵌入影片。

<figure><img src="/files/DYOkyOyaL4czPabr6UXA" alt=""><figcaption><p>貼上代碼</p></figcaption></figure>

### 📽️ 影片嵌入完成示意畫面

<figure><img src="/files/mT3tQQgOZkB0a7sz5naY" alt=""><figcaption><p>商品頁示意圖</p></figcaption></figure>
