> For the complete documentation index, see [llms.txt](https://shopby-help.nhn-commerce.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://shopby-help.nhn-commerce.com/guide/required-setting/design.md).
# 디자인
## **1. 쇼핑몰 디자인은 어떻게 진행하나요?**
shop by에선 쇼핑몰 디자인을 하는 방법은 크게 3가지로 나뉩니다.
\
1\. shop by가 제공하는 **기본 스킨 활용**\
2\. 내 쇼핑몰 컨셉에 맞는 **유료 스킨 구매**\
3\. 원하는 대로 제작하는 **디자인 맞춤 제작**
위 3가지 방법 중 예산, 일정 등을 고려하여 가장 적합한 방법을 선택해 보세요!
***
## **2. 기본 스킨 활용 방법 알려드릴게요!**
{% embed url="" %}
**(1) shop by가 제공하는 기본 스킨은 무엇인가요?**\
shop by는 'AURORA'라는 기본 스킨을 제공하고 있습니다.\
shop by 쇼핑몰 솔루션을 신청하면 자동적으로 기본 쇼핑몰에 적용되므로, 별도 설치하지 않으셔도 됩니다.\
\
**(2) AURORA 스킨을 수정해서 쓰려면 어떻게 해야 하나요?**\
[\[디자인 > 디자인 설정\]](https://admin.shopby.co.kr/pro/appearance/custom/skin-banners) 에서 배너, 팝업창, 상품 진열, 스킨 색상, 파비콘을 기본 기능으로 변경할 수 있어요.
\
**기본 기능 외 디자인 세부 수정이 필요하다면?**\
[오로라 스킨 에디터](https://nhnent.dooray.com/share/pages/Ot5TX_K2QIa4GfbnseokMg)에서 직접 HTML, CSS 파일의 소스 코드를 수정할 수 있어요.\
에디터 기능 상세 가이드는 아래 버튼을 클릭해 주세요!
\
[ ](https://nhnent.dooray.com/share/pages/Ot5TX_K2QIa4GfbnseokMg)
에디터를 사용하려면 아래와 같이 설정해 주세요.
**①** 샵바이 어드민 > 디자인 > 디자인 스킨 리스트\
오로라 개별형 스킨 복사 후 '보유 스킨'에 복사된 스킨 확인**②** '에디터' 버튼 클릭
\
추가로 쇼핑몰에서 효과적으로 이벤트, 공지사항 등을 알릴 수 있는 **팝업창 등록** 방법도 참고해 보세요.\
팝업창 등록은 [\[디자인 > 디자인 설정 > 팝업창 관리\]](https://admin.shopby.co.kr/pro/appearance/custom/popup) 에서 '팝업창 등록' 버튼을 클릭해 생성할 수 있어요
**① 쇼핑몰 선택**\
팝업창을 등록할 쇼핑몰을 먼저 선택해 주세요.\
\
**② 팝업명**\
내부 관리 용도로만 사용됟는 팝업창 이름을 입력합니다.\
\
**③ 플랫폼 구분**\
팝업창을 노출할 플랫폼을 선택해 주세요. (PC웹, 모바일웹, 모바일앱 선택 가능)
**④ 팝업 내용 입력**\
팝업 내용 에디터 창에 직접 팝업 내용을 입력하거나 이미지 아이콘을 클릭하여 이미지 파일로 제작한 팝업 내용을 첨부할 수 있습니다.
**⑤ 팝업 노출 페이지**\
해당 팝업창이 노출되는 페이지를 선택합니다. \
개별 설정의 경우, 장바구니/로그인/회원가입 페이지 등 다양한 페이지에서 팝업창 노출이 가능합니다.
***
## **3. 유료 스킨에 대해 알려드릴게요!**
기본 스킨이 아닌 나만의 브랜드 컨셉을 녹일 수 있는 디자인이 필요하신가요?\
유료 스킨을 구매하면 저렴한 비용으로 컨셉에 맞게 디자인을 업그레이드할 수 있어요!
\
아래 링크를 통해 shop by 전용 스킨 중, 마음에 드는 디자인을 찾아보세요.\
[**shop by 전용 스킨 구매하기**](https://design.nhn-commerce.com/goods/goods-list.php?bn=GNB\&tab=shopbypro)