> For the complete documentation index, see [llms.txt](https://docs.archisketch.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.archisketch.com/guide/dev-kr/builder/wordpress/model-viewer-embed.md).

# 4.3. 워드프레스: 모델 뷰어 삽입하기(Embed)

## 워드프레스(WordPress): 모델 뷰어 삽입 방법

**워드프레스 관리자(wp-admin)** 속 **블로그 글**(또는 커머스 상세 페이지)에 아키스케치 모델 뷰어를 삽입하는 방법을 안내합니다.

{% embed url="<https://cylinder.archisketch.com/?id=X1MNWceF0DE919CAF004414>" %}

### 임베드(Embed)란?

**임베드**(embed)는 다른 웹사이트나 애플리케이션에서 특정 콘텐츠를 가져와서 자신의 웹페이지에 삽입하는 방법을 말합니다. 워드프레스(WordPress)에서는 이미지, 동영상 등 다양한 콘텐츠를 외부 웹사이트나 블로그에 삽입할 수 있습니다.

> 📘 참조: 아키스케치 모델 뷰어 임베드 링크 획득 방법
>
> **모델 뷰어 임베드 링크 획득 방법**은 [4.3. 모델 뷰어: 공유/임베드](/guide/dev-kr/contents/model-viewer/share-embed.md) 페이지에서 확인하실 수 있습니다.

## 제품 상세 에디터를 활용하여 임베드(Embed)하기

워드프레스 **글(또는 Woo-Commerce)**&#xB97C; 활용하여 모델 뷰어를 웹사이트나 상품 페이지에 손쉽게 임베드할 수 있습니다. 아래 단계별 안내에 따라 모델 뷰어를 임베드해 보세요.

{% stepper %}
{% step %}

### 워드프레스 관리자 로그인 및 컨텐츠 관리 페이지로 이동

**워드프레스 관리자 대시보드**에서 **글(또는 Woo-Commerce)** 페이지로 이동해주세요. 그 후, 컨텐츠 목록 페이지에서 모델 뷰어를 임베드하려는 컨텐츠를 선택합니다.

![](/files/QEfgRXburtQmev7QxwvA)
{% endstep %}

{% step %}

### 컨텐츠 상세 페이지 편집

컨텐츠 상세 페이지 에디터에서 **\[+]**&#xBC84;튼을 클릭하고, **사용자 정의 HTML** 버튼을 클릭해주세요.

![](/files/M54I0OWNDqX6ha8lVI63)
{% endstep %}

{% step %}

### `<iframe>` 태그 삽입

이후 등장한 **HTML 입력란**에 **아키스케치 모델 뷰어 임베드 링크**를 넣어주세요. 넣은 후, HTML 버튼 옆 **미리보기** 버튼을 클릭하시면, **삽입된 모델 뷰어**를 확인 할 수 있습니다.

> 📘 참조: 아키스케치 모델 뷰어 임베드 링크 획득 방법
>
> **모델 뷰어 임베드 링크 획득 방법**은 [4.3. 모델 뷰어: 공유/임베드](/guide/dev-kr/contents/model-viewer/share-embed.md) 페이지에서 확인하실 수 있습니다.

![](/files/Jj29foHFlTRU8HXqLQHi)

워드프레스 > HTML 에디터

![](/files/LpMToVKGpFocR60Lkv8z)

HTML 버튼 옆 **미리보기**를 클릭하시면, 적용된 모델 뷰어를 확인 할 수 있습니다.
{% endstep %}

{% step %}

### 수정된 제품 데이터 저장

**모델 뷰어** 삽입 작업을 완료하셨다면, **\[저장]** 버튼을 클릭하여, 제품을 수정해주세요.
{% endstep %}
{% endstepper %}