# 멤버십 테마 사용법

## 개요

이제 엄선된 테마를 사용하여 상품 페이지의 느낌을 맞춤화할 수 있습니다. 테마는 맞춤 브랜드 정체성과 경험을 구축하는 데 도움이 됩니다.

맞춤화 옵션을 통해 상품에 다양한 스타일을 추가할 수 있습니다. 멤버십 맞춤화에 대한 자세한 정보는 아래 도움말 문서를 확인하세요.

## 1단계: 상품 테마 선택

상품을 생성하면 기본적으로 클래식 테마가 선택되지만, 디지털 상품을 개인 브랜드와 가장 잘 맞도록 선택할 수 있는 다양한 시스템 테마를 제공합니다! 각 테마는 회원들에게 서로 다른 모양, 느낌, 전체적인 경험을 제공한다는 점을 기억하세요.

### 테마를 선택하는 방법

* 테마를 적용할 상품을 선택합니다
* 커스터마이징(Customize)을 클릭합니다

![테마 선택 화면](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/48191005712/original/e9uAdV5JSWNAnovGfRQJdxV32xGiYtckdA.png?1645031012)

![테마 갤러리](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/48191005790/original/75hPFK2cz-g23Uxz8bJuiEudySAtnwDe_Q.png?1645031031)

* 테마 갤러리는 이번 릴리스에 포함된 시스템 테마의 공간이며, 사용자가 생성한 테마(내 테마)는 후속 릴리스에서 제공될 예정입니다. 테마 갤러리를 통해 사용자는 테마를 적용하거나 기존 테마를 맞춤화할 수 있습니다.

## 2단계: 테마 맞춤화

테마의 상품 페이지를 맞춤화합니다

* 테마 갤러리에서 커스터마이징을 클릭하여 맞춤화 빌더를 엽니다
* 테마 설정을 맞춤화합니다
* 페이지 섹션을 맞춤화하려면 왼쪽 사이드바 편집기에서 편집하고자 하는 섹션을 클릭하기만 하면 됩니다. 섹션 안을 클릭하면 모든 다양한 맞춤화 옵션들이 나타납니다.

### 테마 설정(Theme Settings)에서 변경할 수 있는 속성들

1. 기본 색상 - 버튼, 상단 아이콘, 레슨 진행률, 강의 제목, 카테고리 제목, 레슨 제목, 강사 제목에 적용됩니다
2. 보조 색상 - 강사명, 강사 설명, 레슨 설명, 카테고리 설명, 버튼 텍스트에 적용됩니다
3. 기본 폰트 - 버튼, 상단 아이콘, 레슨 진행률, 강의 제목, 카테고리 제목, 레슨 제목, 강사 제목에 적용됩니다
4. 보조 폰트 - 강사명, 강사 소개, 레슨 설명, 카테고리 설명, 버튼 텍스트에 적용됩니다
5. 로고 배치 - 로고를 헤더에 배치할지 히어로 섹션에 배치할지 결정합니다

![테마 설정 화면](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/48191006243/original/wR9k1SGeptyjeLxxDn_norNQvVW52WoAwA.png?1645031098)

![커스터마이징 옵션](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/48189521763/original/VnOdZw_1Oms4ZeX6olQzg_ZPHbIeqvCunA.jpeg?1644600511)

### 상품 페이지의 섹션에서 변경할 수 있는 속성들

**헤더(Header):** 경로: Sites(사이트) → Membership(멤버십) → Products(상품) → Customize(커스터마이징) → Gallery → Customize → Sections → Header

* 배경: 배경 색상 선택기
* 정렬: 왼쪽, 오른쪽 또는 중앙

**히어로(Hero):** 경로: Sites(사이트) → Membership(멤버십) → Products(상품) → Customize(커스터마이징) → Gallery → Customize → Sections → Hero

* 크기: 매우 작음, 작음, 중간, 큼
* 강의 제목: 폰트, 정렬
* 강의 설명: 폰트, 정렬
* 배경: 이미지 크기, 투명도, 색상 선택기
* 버튼: 내용, 폰트, 배경 색상, 정렬

**레슨 진행률(Lesson Progress):** 경로: Sites(사이트) → Membership(멤버십) → Products(상품) → Customize(커스터마이징) → Gallery → Customize → Sections → Lesson Progress

* 배경: 색상
* 폰트
* 진행률 색상: 색상

**강의 본문(Course Body):** 경로: Sites(사이트) → Membership(멤버십) → Products(상품) → Customize(커스터마이징) → Gallery → Customize → Sections → Course Body

* 카테고리 폰트: 유형, 크기, 색상
* 하위 카테고리 폰트: 유형, 색상, 크기
* 카테고리 설명 폰트: 유형, 색상, 크기
* 레슨 폰트: 유형, 색상, 크기
* 레슨 설명 폰트: 유형, 색상, 크기
* 배경: 이미지, 색상, 투명도

**강사(Instructor):** 경로: Sites(사이트) → Membership(멤버십) → Products(상품) → Customize(커스터마이징) → Gallery → Customize → Sections → Instructor

* 배경: 색상
* 제목 폰트: 색상, 유형, 크기
* 이름 폰트: 색상, 유형, 크기
* 직책 폰트: 색상, 유형, 크기
* 소개 폰트: 색상, 유형, 크기

### 레슨 페이지의 섹션에서 변경할 수 있는 속성들

![레슨 페이지 설정](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/48199325855/original/vboCa3UuBuwhwg0d1KFSQ9pJZ7mYoEYkTA.png?1646839987)

**1. 레슨 본문(Lesson Body):** 경로: Sites(사이트) → Membership(멤버십) → Products(상품) → Customize(커스터마이징) → Gallery → Customize → Lesson → Sections → Lesson Body

* 배경: 배경 색상
* 제목: 폰트 유형, 폰트 색상
* 설명: 폰트 유형, 폰트 색상
* 버튼: 내용, 색상, 폰트 유형, 폰트 색상
* 다음 레슨: 배경 색상, 제목(폰트, 색상), 다음 레슨 버튼(색상, 폰트 유형, 폰트 색상), 레슨 제목(폰트 색상)

**2. 강의 네비게이션(Course Navigation):**

* 배경 색상
* 카테고리: 폰트 유형, 폰트 색상
* 레슨: 폰트 유형, 폰트 색상
* 하이라이트: 색상, 폰트 색상
* 브레드크럼: 폰트 유형, 폰트 색상
* 다음 카테고리: 배경 색상, 폰트 유형, 폰트 색상

**3. 강사(Instructor):** 경로: Sites(사이트) → Membership(멤버십) → Products(상품) → Customize(커스터마이징) → Gallery → Customize → Sections → Instructor

* 배경: 색상
* 제목 폰트: 색상, 유형, 크기
* 이름 폰트: 색상, 유형, 크기
* 직책 폰트: 색상, 유형, 크기
* 소개 폰트: 색상, 유형, 크기

**참고사항:** 테마 설정에서 무언가를 맞춤화한 후 "변경 사항 저장" 버튼을 클릭하면 미리보기에 반영됩니다. "기본값으로 재설정"을 선택하면 모든 설정이 테마의 기본값으로 변경됩니다. 테마 설정이 변경된 후 섹션이 맞춤화되면, 섹션 맞춤화가 테마 설정 맞춤화보다 우선적용됩니다.

## 3단계: 테마 적용 또는 저장

상품에 테마를 선택하고 상품 페이지를 맞춤화했다면, 마지막 단계는 이를 적용하는 것입니다.

테마가 적용되면 회원들이 보고 상호작용할 최종 미리보기가 됩니다!

* 상품을 선택합니다
* 커스터마이징(Customize)을 클릭합니다
* 테마 갤러리를 둘러보고 적용하고 싶은 테마의 적용(Apply)을 클릭합니다
* 또는 테마를 맞춤화한 후 오른쪽 상단의 적용(Apply)을 클릭하여 적용할 수도 있습니다

### 테마 저장 버튼

"테마 저장" 버튼을 사용하여 로케이션에서 전역으로 사용할 수 있도록 테마를 저장하세요. "변경 사항 저장"을 클릭하면 변경 사항이 해당 테마에만 저장되고 전역 사용은 불가능합니다.

사용자가 "테마 저장" 버튼을 클릭하면 해당 테마를 로케이션에서 전역으로 사용할 수 있습니다.

![테마 저장 화면](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/48189521761/original/twN4pepJLbV4zVRbZgiwrAkt30o-zMUcGQ.jpeg?1644600511)

**참고사항:** "테마 저장"은 변경 사항 저장을 클릭한 후 저장된 최신 변경 사항만 저장합니다. 모든 "저장되지 않은 변경 사항"은 반영되지 않습니다. 템플릿이 맞춤화되고 전역 사용을 위해 저장되어도 이미 동일한 테마를 사용하고 있는 다른 모든 상품에는 영향을 미치지 않습니다. 사용자가 상품에 테마를 다시 적용하면 새로운 변경 사항이 반영되기 시작합니다.

### 테마 적용하기

특정 상품에 테마 적용

![테마 적용 화면](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/48189521748/original/SJJlGJSJmMXVEoK-XqmUyJ9BVPCy3evUWQ.jpeg?1644600507)

테마 갤러리에서 "적용(Apply)"을 클릭하면 테마가 상품에 직접 적용됩니다.

![테마 적용 완료](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/48189521757/original/vNNY5B5GSGrHn2tVGbiQOLqIJnjPeKEsyA.jpeg?1644600511)

테마를 맞춤화한 후 변경 사항 저장을 클릭하고 적용 버튼을 클릭하여 특정 상품에 테마를 적용할 수 있습니다. 적용 버튼은 적용됨으로 변경됩니다.

**참고사항:** 적용 버튼을 사용하여 테마를 적용하면 선택된 상품에만 적용되며, 맞춤화 설정은 로케이션에서 전역적으로 사용할 수 없습니다.

### 변경 사항 저장

상품 수준에서 테마의 초안을 맞춤화하고 저장합니다. 시스템에서 생성된 테마를 맞춤화하고 어떤 상품에도 적용하지 않은 채 초안으로 저장할 수 있습니다.

"변경 사항 저장"을 클릭하면 변경 사항이 테마의 초안으로 저장됩니다.

초안 테마(변경 사항 포함)는 나중에 상품에 적용할 수 있습니다. 초안 테마는 전역적이지 않으며 모든 로케이션에서 사용할 수 없습니다.

![변경사항 저장](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/48189521759/original/20ndfHek6SAKB1HkrK1bsjYoNg9zA-5h-A.jpeg?1644600511)

**참고사항:** 상품에 적용되지 않은 테마에서 "변경 사항 저장"을 클릭하면, 해당 테마가 변경 사항으로 업데이트되고 나중에 동일한 상품에서 사용할 수 있습니다. 테마 속성을 전역적으로 변경하지는 않습니다.

## 강사 세부사항, 파비콘, 로고

* 상품 세부사항으로 이동합니다
* 커스터마이징(Customizations)을 클릭합니다
* 강사 세부사항, 파비콘, 로고를 업데이트합니다

![강사 정보 설정](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/48189521764/original/qYMBN-r32zSmQyBEWQ7zGvbK2Vk9rXyRng.jpeg?1644600511)

***

*원문 최종 수정: Wed, 9 Mar, 2022 at 10:06 AM* *Hyperclass 사용 가이드 — hyperclass.ai*


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://hyperclass.gitbook.io/hyperclass-docs/and-memberships/how-to-use-community-tagging-feature/how-to-use-membership-themes.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
