> For the complete documentation index, see [llms.txt](https://help.qshop.ai/customer_support/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.qshop.ai/customer_support/guide/design/editor/contents/munu.md).

# 메뉴

## 메뉴란?

사이트 헤더 영역에 노출이 되는 페이지 메뉴, 로그인 장바구니 등의 블록을 사용 할 수 있습니다.

주로 헤더 영역에 적용하여 사용하지만, 바디 푸터 영역에도 적용이 가능합니다.

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

### 블록 설정 방법

1. 사용하려는 블록을 추가합니다.
2. 퀵 메뉴의 상세설정을 클릭합니다.
3. 아래 상세 설정을 참고하여, 설정을 변경합니다.

{% hint style="info" %}
블록을 더블 클릭하여 상세 설정창을 열 수 있습니다.
{% endhint %}

## 1. 공통 메뉴

헤더 섹션에 사용이 되는 로그인/회원가입, 장바구니의 요소를 추가합니다. \
회원가입 및 쇼핑 기능이 필요한 경우 사용합니다.

#### 공통 메뉴 블록\_설정 항목

{% tabs %}
{% tab title="기본 설정" %}

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

| 설정 항목                                                                                                                                                                                                                              |
| ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| <p><strong>리스트</strong><br><strong>유형</strong> : 공통 메뉴의 표시 형태를 선택합니다<br><strong>간격</strong> : 공통 메뉴 사이의 간격을 설정합니다.</p>                                                                                                             |
| <p><strong>활성화 메뉴</strong><br><strong>검색</strong> : 쇼핑 검색 기능을 활성화 합니다.<br><strong>로그인/회원가입</strong> : 로그인/회원가입 기능을 활성화 합니다.</p><ul><li>로그인 시, 마이페이지/로그아웃으로 바꿔 표시됩니다.</li></ul><p><strong>장바구니</strong> : 장바구니 기능을 활성화 합니다.<br></p> |
| {% endtab %}                                                                                                                                                                                                                       |

{% tab title="스타일 설정" %}

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

| 설정 항목                                                           |
| --------------------------------------------------------------- |
| <p><strong>내용</strong><br>공통 메뉴의 서체, 크기, 색상, 두께를 설정합니다.<br></p> |
| {% endtab %}                                                    |
| {% endtabs %}                                                   |

## 2. 페이지메뉴

구조패널을 통해 생성한 메뉴를 노출하기 위해 사용합니다.\
메뉴에 마우스를 올릴 시 하위메뉴가 드롭다운 되어 나타나게 됩니다.

#### 페이지 메뉴 블록\_설정 항목

{% tabs %}
{% tab title="기본 설정" %}

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

| 설정 항목                                                                                                                                                                                                                                                                         |
| ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| <p>유형<br>페이지 메뉴의 표시 형태를 텍스 또는 아이콘으로 선택합니다.</p>                                                                                                                                                                                                                                |
| <p><strong>텍스트</strong><br><br><strong>넘칠 시 표시</strong><br>콘텐츠의 너보다 메뉴의 수가 넘어갈 경우 표시 방식을 선택합니다.</p><ul><li><strong>기본</strong><br>메뉴 전체가 그대로 표시</li><li><strong>줄바꿈</strong><br>콘텐츠 너비에 맞춰 다음줄로 줄바꿈이 되어 표시</li><li><strong>슬라이드</strong><br>실제 사이트 화면에서 좌우 스크롤하여 이동</li></ul> |
| <p><strong>아이콘</strong><br><br><strong>색상</strong><br>아이콘의 색상 및 투명도를 설정합니다.<br><strong>두께</strong><br>아이콘의 두께를 설정합니다.</p>                                                                                                                                                     |
| {% endtab %}                                                                                                                                                                                                                                                                  |

{% tab title="페이지 설정" %}

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

| 설정 항목                                                                                                                                                                                                                                                                                                                                                        |
| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| <p><strong>내용</strong><br>메인 메뉴와 서브메뉴를 개별 설정할 수 있습니다.</p><ul><li><strong>서체</strong><br>메뉴의 서체를 선택합니다.</li><li><strong>크기</strong><br>서체의 크기를 선택합니다.</li><li><strong>간격</strong><br>페이지 메뉴 사이의 간격을 설정합니다.</li><li><p><strong>배경</strong><br>배경 색상 및 투명도를 설정합니다.</p><ul><li>텍스트 유형 선택 시 서브 메뉴 배경 설정 가능</li><li>아이콘 유형 선택 시 메인 메뉴 배경 설정 가능</li></ul></li></ul> |
| <p><strong>활성화 상태</strong><br>활성화 상태 설정은 메인 / 서브 에 공통 적용이 됩니다.</p><ul><li><strong>표시</strong><br>모두 / 메인 / 서브 중 활성화 적용이 될 위치를 선택합니다.</li><li><strong>유형</strong><br>활성화 상태의 표시 형식을 선택합니다.</li><li><strong>색상</strong><br>활성 메뉴의 색상 및 투명도를 설정합니다.</li></ul>                                                                                                   |
| {% endtab %}                                                                                                                                                                                                                                                                                                                                                 |
| {% endtabs %}                                                                                                                                                                                                                                                                                                                                                |


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## 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, and the optional `goal` query parameter:

```
GET https://help.qshop.ai/customer_support/guide/design/editor/contents/munu.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

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.