스타일 편집

상점의 여러 페이지에 공통적으로 적용되는 스타일 편집 설정에 대해 알아보겠습니다.

목차

1. 스타일 편집이란?

전체 상점 웹사이트에 공통적으로 적용되는 스타일 속성을 '스타일 편집'이라고 합니다. 스타일 편집은 고객에게 일관적인 브랜드 테마를 노출하기 위해 필요하며 템플릿 지정 시 템플릿 별 기본 설정값이 자동으로 적용됩니다. 이후 변경 사항은 페이지 내 모든 섹션과 요소에 일괄 적용됩니다.

각 섹션과 요소의 일부 속성은 개별 편집을 통해 상황에 맞게 스타일 등을 변경할 수 있습니다.

2. 스타일 편집

2-1. 스타일 편집 열기

Step 1. 화면 좌측 하단에 위치한 페이지 관리 메뉴(≡) 버튼을 누르면 아래와 같은 화면을 볼 수 있습니다.

Step 2. 아래 이미지를 참고하여 [스타일 편집] 버튼을 눌러주세요.

2-2. 스타일 편집 메뉴 구성

3. 페이지 스타일 설정

3-1. 전체 > 공통

4. 머리글 스타일 설정

페이지와 메뉴 > 머리글과 바닥글 > 머리글 설정하기 안내서를 참고하세요.

5. 섹션별 스타일 편집

콘텐츠 구성 요소 > 섹션 안내서를 참고하세요.

6. 사용자 편집 섹션

사용자 편집 섹션은 사용자가 직접 각종 요소를 추가하여 만들 수 있는 사용자 정의 콘텐츠를 위한 섹션입니다. 아래 내용을 참조하여 사용자 편집 섹션의 공통 스타일을 설정하세요.

6-1. 제목글

[디자인 편집 > 메뉴와 스타일 편집(왼쪽 하단 ≡ 아이콘) > 스타일 편집 > 제목글]에서 제목글의 스타일 편집이 가능합니다.

6-2. 줄글

[디자인 편집 > 메뉴와 스타일 편집(왼쪽 하단 ≡ 아이콘) > 스타일 편집 > 줄글]에서 줄글의 스타일 편집이 가능합니다.

6-3. 보조글

[디자인 편집 > 메뉴와 스타일 편집(왼쪽 하단 ≡ 아이콘) > 스타일 편집 > 보조글]에서 보조글의 스타일 편집이 가능합니다.

6-4. 링크

[디자인 편집 > 메뉴와 스타일 편집(왼쪽 하단 ≡ 아이콘) > 스타일 편집 > 링크]에서 링크의 스타일 편집이 가능합니다.

6-5. 선

[디자인 편집 > 메뉴와 스타일 편집(왼쪽 하단 ≡ 아이콘) > 스타일 편집 > 선]에서 선의 스타일 편집이 가능합니다.

6-6. 버튼

[디자인 편집 > 좌측 하단 메뉴(≡) > 스타일 편집 > 버튼]에서 버튼 스타일 편집이 가능합니다.

6-7. 아이콘

[디자인 편집 > 메뉴와 스타일 편집(왼쪽 하단 ≡ 아이콘) > 스타일 편집 > 아이콘]에서 아이콘의 스타일 편집이 가능합니다.

6-8. 말풍

말풍선 메시지를 사용하려면 디자인 편집 페이지에서 머리글 영역을 더블 클릭하고 ’말풍선 넣기’를 [✔︎] 체크해 주시면 됩니다.

[디자인 편집 > 메뉴와 스타일 편집(왼쪽 하단 ≡ 아이콘) > 스타일 편집 > 말풍선]에서 말풍선의 스타일 편집이 가능합니다.

6-9. 쪽번호

[디자인 편집 > 메뉴와 스타일 편집(왼쪽 하단 ≡ 아이콘) > 스타일 편집 > 쪽번호]에서 쪽번호의 스타일 편집이 가능합니다.

6-10. 맨 위로 버튼

[디자인 편집 > 메뉴와 스타일 편집(왼쪽 하단 ≡ 아이콘) > 스타일 편집 > 맨 위로 버튼]에서 맨 위로 버튼의 스타일 편집이 가능합니다.

7. 바닥글 스타일 설정

페이지와 메뉴 > 머리글과 바닥글 > 바닥글 설정하기 안내서를 참고하세요.

8. 기본 제공 페이지 스타일 설정

8-1. 상품 상세

8-2. 장바구니

8-3. 로그인

8-4. 회원가입

9. 템플릿 변경하기

필요에 따라 현재 사용 중인 템플릿을 다른 템플릿으로 변경하고 싶을 경우가 있습니다. 이때 아래의 안내를 참조하여 진행해주세요.

템플릿 변경 후에는 이전 디자인으로 되돌릴 수 없는 점을 유의하여 진행해 주세요.

Step 1. 좌측 하단의 페이지 관리 메뉴 버튼을 눌러주세요 단축키: Tab

Step 2. 그 다음 스타일 편집 버튼을 눌러주세요.

Step 3. 스타일 편집 패널의 템플릿 변경하기 버튼을 눌러주세요.

Step 4. 변경할 템플릿을 선택합니다.

Step 5. 선택한 템플릿으로 변경하기 버튼을 클릭합니다.

Step 6. 기존 입력한 콘텐츠의 초기화 여부를 선택하세요.

  • 초기화하기: 모든 작업 내역이 삭제되고 템플릿이 변경됩니다.

  • 초기화 없이 변경하기: 작업 내용은 모두 유지하고 선택한 템플릿의 스타일 편집 설정 값으로 변경합니다.

Step 7. 이제 변경된 템플릿을 사용하실 수 있습니다.

10. 실험실

사용자 편의성을 위한 신규 기능을 실험실로 제공합니다.

실험실에서 제공하는 기능은 사전 안내 없이 사라질 수 있습니다.

Last updated