02. 공통 스타일 설정하기

✨ 공통 스타일이 무엇인가요?

공통 스타일은 쇼핑몰 전체에 일괄 적용되는 디자인 요소를 한 번에 관리하는 기능이에요. 한 번 설정해 두면 쇼핑몰 전체에 일괄 적용돼서, 페이지마다 따로 디자인을 손 볼 필요가 없어요. 디자인 에디터를 처음 열었다면 이 항목부터 먼저 설정해 보세요! 🎨

🚀 공통 스타일 설정 방법

1

디자인 에디터 진입하여 좌측 하단에 [공통 스타일] 아이콘을 클릭해주세요.

2

원하는 항목을 펼쳐 값을 조정해보세요.

💡 TIP 공통 스타일은 디자인 에디터에서 한 번만 설정하면 돼요! 이후 개별 섹션이나 위젯을 편집할 때는 공통 스타일에서 정한 값을 기본으로 사용하므로 작업 시간이 크게 줄어들어요.

🎯 공통 스타일 설정 항목

공통 스타일에서 설정할 수 있는 항목들이에요. 각 항목의 세부 옵션을 살펴보고 내 쇼핑몰에 어울리는 값으로 정해 보세요.

그룹
설명

색상

내 쇼핑몰을 대표하는 색을 정할 수 있어요.

글자 - 글꼴

기본 제공 폰트 중에서 제목용·본문용 글꼴을 각각 선택할 수 있어요. (외부 폰트 파일을 직접 올리는 기능은 미지원이에요)

글자 - 크기

제목·본문·버튼의 글자 크기를 각각 조정할 수 있어요. 쇼핑몰 전체 텍스트 크기를 한 번에 키우거나 줄이는 기능은 추가제공될 예정이에요.

레이아웃

화면 가운데에 보이는 본문 영역의 최대 너비를 정해요. 좁게 잡으면 깔끔한 느낌, 넓게 잡으면 시원한 느낌이 들어요.

버튼

쇼핑몰 곳곳에 쓰이는 기본 버튼의 색을 한 번에 통일해요. 매번 따로 손보지 않아도 일관된 디자인이 유지돼요.

슬라이드

배너 슬라이드의 좌우 화살표와 페이징 점 디자인을 한 번에 정해요. 모든 슬라이드 섹션에 동일하게 적용할 수 있어요.

💡 TIP 처음 스킨을 만든다면 색상 → 글자 → 레이아웃 → 버튼 → 슬라이드 순서로 살펴보면 디자인이 자연스럽게 잡혀요. 물론 원하는 항목부터 자유롭게 설정해도 좋아요!

🔄 공통 적용 범위 알아보기

공통 스타일은 디자인 에디터에서 직접 편집할 수 없는 페이지에도 동일하게 적용돼요! 페이지 종류마다 어떤 차이가 있는지 아래 표에서 한눈에 확인해 보세요.

페이지 종류
에디터에서 직접 편집
공통 스타일 적용

기본 제공 페이지 (메인, 상품 목록, 상품상세, 검색결과, 장바구니, 주문서, 회원가입, 로그인)

빈 페이지 (관리자가 직접 추가)

시스템 페이지 (게시판, 1:1 문의, 마이페이지 등)

공통스타일을적용하면게시판이나 마이페이지처럼 디자인 에디터에서 직접 손 볼 수 없는 페이지도 쇼핑몰 전체와 일관된 디자인을 유지할 수 있어요. 👍

💡자주 묻는 질문

chevron-right폰트 파일을 직접 업로드해 사용할 수 있나요?hashtag

현재는 에디터가 기본 제공하는 폰트 목록에서만 선택할 수 있어요.

chevron-right본문 텍스트 크기를 전체적으로 한 번에 키우고 싶어요.hashtag

제목·본문·버튼 세 가지 위젯에 한해 글자 크기 조정이 가능해요.

쇼핑몰 전체 텍스트 크기를 한 번에 키우거나 줄이는 기능은 추가 제공될 예정이니 기다려주세요.

Last updated

Was this helpful?