> 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/gnb.md).

# 상단 메뉴바

## 상단 메뉴바란?

에디터 위쪽에 위치한 상단 메뉴바는 페이지를 디자인 하는 과정에 필요한 실행 취소, 미리보기, 페이지 저장 등을 통해 보다 편하게 디자인을 해 나갈 수 있습니다. \
또한, 모바일 뷰포트 변경을 통해 모바일 별도 디자인을 하여 PC와 모바일에 최적화 된 각각의 디자인을 할 수 있습니다.

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

각 요소의 자세한 내용은 아래 표를 참고해주세요.

<table><thead><tr><th width="168">항목</th><th>설명</th></tr></thead><tbody><tr><td><img src="/files/kwa1kEMb1CS1KW2smeC0" alt=""></td><td><strong>패널 닫기</strong>
<br>추가패널과 속성패널을 숨김처리합니다.</td></tr><tr><td><img src="/files/XaAJnap8P4GMVuaWdivy" alt=""></td><td><strong>PC로 보기</strong><br>디자인 에디터 뷰포트를 PC로 변경합니다.</td></tr><tr><td><img src="/files/Dfdqpc94MrvpY9bZ170k" alt=""></td><td><strong>모바일로 보기</strong><br>디자인 에디터를 모바일 뷰포트로 변경합니다.</td></tr><tr><td><img src="/files/eem3aXETIEcctPfyIVri" alt=""></td><td><strong>고정 콘텐츠</strong>
<br>고정 된 콘텐츠를 확인하고 레이아웃을 수정할 수 있습니다.
<br>자세한 방법은 [블록 고정하기] 가이드를 참고 해주세요.</td></tr><tr><td><img src="/files/paPMSXgIX1tSQIRhAJrq" alt=""></td><td><strong>비율조정</strong><br>뷰포트의 비율을 확대/축소할 수 있습니다.</td></tr><tr><td><img src="/files/7xr7et4hExTqzM6K0mc8" alt=""></td><td><p><strong>페이지 이름</strong><br>현재 작업 중인 페이지의 이름을 표시합니다.</p><ul><li>더블클릭 후 페이지 이름 변경 가능</li></ul></td></tr><tr><td><img src="/files/eAqzgw3WvsykPXNxWeyK" alt=""></td><td><strong>크레딧</strong>
<br>현재 보유하고 있는 크레딧이 표시 됩니다.
<br>크레딧에 대한 자세한 내용은 [마이베네핏] 가이드를 참고해주세요.</td></tr><tr><td><img src="/files/hwb8VUTTeyOY9gG8lhoq" alt=""></td><td><strong>가이드 바로가기</strong>
<br>큐샵의 가이드를 확인할 수 있습니다.</td></tr><tr><td><img src="/files/21BgwwAfv3Ay6DvmHmJ7" alt=""></td><td><strong>실시간 채팅 바로가기</strong>
<br>에디터 내에서 실시간 채팅 상담을 열 수 있습니다.</td></tr><tr><td><img src="/files/y1U23xUYfPp6QJN4PCpB" alt=""></td><td><strong>실행취소</strong><br>이전 디자인 내 용로 돌아갑니다.</td></tr><tr><td><img src="/files/jzKz4yhBqhBiYXCoeZpB" alt=""></td><td><strong>저장 및 게시내역</strong><br>저장/게시 히스토리가 페이지 별로 각각 기록 됩니다.</td></tr><tr><td><img src="/files/b5lrjALFDXWpvT3tmrji" alt=""></td><td><strong>재실행</strong><br>실행 취소 이전로 돌아갑니다.</td></tr><tr><td><img src="/files/7BOqMUDgaWIJRuv1zn1n" alt=""></td><td><strong>사이트 전체 설정</strong>
<br>사이트에 공통으로 적용되는 색상, 폰트, 섹션의 너비와 간격 등을 설정할 수 있습니다.
<br>자세한 내용은 [속성 패널] 가이드를 참고해주세요.</td></tr><tr><td><img src="/files/M8UCIN94NGuqSKdtiGcK" alt=""></td><td><strong>저장하기</strong><br>현재 페이지 디자인을 저장합니다.<br>방문자는 편집중인 페이지를 볼 수 없으며, 게시하기를 눌러야 실제 홈페이지에 반영됩니다.</td></tr><tr><td><img src="/files/ZwFtnef0S2L1LKnOLxgt" alt=""></td><td><strong>사이트 미리보기</strong><br>현재 디자인 된 페이지를 새 탭을 통해 확인합니다.</td></tr><tr><td><img src="/files/kjcFMXH71KONchg6kyr9" alt=""></td><td><strong>게시하기</strong><br>디자인을 한 내용을 실제 방문자가 볼 수 있도록 사이트에 반영합니다.</td></tr></tbody></table>


---

# 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/gnb.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.