# 🖼️ 메인 배너 섹션

페이지 상단에 배치되어 상점의 인기 상품, 진행 중인 이벤트를 강조하여 원하는 페이지로 접속을 유도할 수 있기  때문에 사이트 첫인상에 많은 영향을 끼칠 수 있어요.

## 메인 배너 섹션 추가하기

메인 배너 섹션 추가하기는 방법은 [<mark style="background-color:blue;">**여기**</mark>](/learn-sixshop/store-design/easy-design/design-edit.md#undefined) **👈**에서 확인해 주세요!\
메인 배너 섹션은 <mark style="background-color:blue;">**페이지당 하나만 추가**</mark>할 수 있어요.

<details>

<summary>✏️ 추가 방법 글자로 살펴보기</summary>

1. 식스샵 로그인 후 왼쪽 위의 ‘디자인 편집’ 클릭
2. 왼쪽 아래 ‘섹션 추가하기 +’ 클릭
3. 메인 배너 섹션 클릭

</details>

## 배너 이미지 추가하기

<figure><img src="/files/bb8R2JuYcF8iPmpcSyhf" alt=""><figcaption></figcaption></figure>

<details>

<summary>✏️ 추가 방법 글로 살펴보기</summary>

1. 식스샵 로그인 후 왼쪽 위의 ‘디자인 편집’ 클릭
2. 왼쪽 하단의 (≡)메뉴를 클릭
3. 메인 배너 섹션이 등록된 페이지 클릭
4. 메인 배너 섹션을 클릭하여 생긴 빨간 테두리 우측 상단의 연필 모양(개별 편집) 아이콘 클릭
5. 개별 편집 패널의 '이미지'탭 하단의 +버튼을 클릭하여 이미지 선택

🪄 이미지를 클릭한 상태로 드래그하면 이미지 위치를 변경할 수 있어요.

</details>

## 배너에 제목/설명/버튼 추가하기

<figure><img src="/files/pzY7xVaZ8ykfYbkMX0bd" alt=""><figcaption></figcaption></figure>

<details>

<summary>✏️ 추가 방법 글로 살펴보기</summary>

1. 메인 배너 섹션의 연필 모양(개별 편집) 아이콘 클릭 (또는 메인 배너 섹션 더블 클릭)
2. 등록된 이미지에 마우스를 대면 보이는 '설정'버튼 클릭
3. 제목, 설명, 버튼 설정

📢 제목, 설명, 버튼은 스타일편집에서 메인 배너 섹션 종류가 <mark style="background-color:blue;">**\[높이 고정]인 경우**</mark>에만 설정할 수 있어요.

</details>

## 공통 스타일 편집에서 설정하기

<figure><img src="/files/iylWJUZrxl8ntROuxgRp" alt=""><figcaption></figcaption></figure>

<details>

<summary>✏️ 공통 스타일 편집 설정 방법 글로 살펴보기</summary>

1. 식스샵 로그인 후 왼쪽 위의 ‘디자인 편집’ 클릭
2. 왼쪽 하단의 (≡)메뉴를 클릭하기
3. 메인 배너 섹션 클릭하기
4. 스타일 편집 해보기

🪄 메인 배너 섹션의 이미지 위 글자 입력은 <mark style="background-color:blue;">**\[높이 고정]에서만 가능**</mark>해요. \ <mark style="background-color:blue;">**\[v]머리글과 합치기**</mark>를 하면 상점 이름과 메뉴의 색상은 <mark style="background-color:blue;">**\[스타일]의 색상**</mark>을 따라갑니다!

</details>

#### 높이 고정

<figure><img src="/files/A97hF1gHTP0weZqFb3uf" alt=""><figcaption></figcaption></figure>

#### 비율 고정

<figure><img src="/files/XH1WnFxC0d4LvVxLnkz9" alt=""><figcaption></figcaption></figure>


---

# 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://help.sixshop.com/learn-sixshop/store-design/easy-design/main-banner-section.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.