# 프로 테마 커스터마이징하기

> ## 테마 개발시 pro 커스터마이징하기

다보리 컴포저블의 기본 쇼핑몰 테마인 dcdemo의 pro 페이지를 커스터마이징하는 예제입니다.

dcdemo가 설치되어 있지 않다면 [프론트엔드 설치하기](https://manual.dabory.com/books/quick-start/page/docker) 예제를 통해 설치를 완료해주세요.

---

<p class="callout info"> pro의 구조</p>

**pro 디렉토리는 다음과 같이 구성되어있습니다. 커스터마이징시 app, para, resources, routes에서 모든 커스터마이징이 이뤄집니다.**

[![image.png](https://manual.dabory.com/uploads/images/gallery/2025-02/scaled-1680-/ZsWimage.png)](https://manual.dabory.com/uploads/images/gallery/2025-02/ZsWimage.png)

> ## 예제1

[![image.png](https://manual.dabory.com/uploads/images/gallery/2025-02/scaled-1680-/G6yimage.png)](https://manual.dabory.com/uploads/images/gallery/2025-02/G6yimage.png)

위 이미지처럼 item-details 페이지에서 상품구분, 상품명, 상품 가격, 옵션 등의 데이터들을 출력하고 있습니다.

예제1에서는 item-details 페이지에서 출력하고 있는 데이터를 변경하여 원하는 데이터로 바꿔서 출력하겠습니다.