# 상점 디자인하기

{% embed url="<https://www.youtube.com/watch?v=nm2ChLLdWbc>" %}

## 에디터란?

에디터는 웹 사이트 제작 목적에 맞춰, 레이아웃을 구성하고 상품 진열 및 페이지 디자인을 위한 편집 도구 입니다.\
코드를 사용하지 않아도 쉽고 빠르게 목적에 맞는 사이트 디자인을 해 나갈 수 있습니다.

이 가이드에서는 에디터의 구조와 각각의 기능들에 대해 설명하고 있습니다\
보다 자세한 내용은 이어지는 에디터 세부 가이드를 참고 해주세요.

{% hint style="warning" %}
&#x20;에디터 사용은 PC버전에서만 가능합니다. 모바일이시면 PC를 이용해 주세요.
{% endhint %}

## 에디터 접속하기

에디터는 두 가지 방법으로 접속이 가능합니다.

<details>

<summary>방법1 : 마이사이트를 통해 접속하기</summary>

1. &#x20;[큐샵 홈페이지](https://qshop.ai/)에 로그인을 합니다.&#x20;
2. 사이트 오른쪽 \[에디터 바로가기]버튼을 클릭합니다.<br>

   <figure><img src="https://641624378-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fqwj5uwp8v68jk4VznncE%2Fuploads%2F0nDXiT3m5E0QUCy3HXdi%2F1_%EB%A7%88%EC%9D%B4%EC%82%AC%EC%9D%B4%ED%8A%B8%20%EC%A0%91%EC%86%8D.png?alt=media&#x26;token=69848d22-c2aa-4cec-9608-fccb4e2fe662" alt=""><figcaption></figcaption></figure>

</details>

<details>

<summary>방법2: 관리자 페이지를 통해 접속하기</summary>

1. [큐샵 홈페이지](https://qshop.ai/)에 로그인을 합니다.
2. 오른쪽 위 마이사이트를 들어갑니다.
3. 관리를 진행할 사이트 오른쪽 **\[관리자 바로가기]** 버튼을 클릭합니다.<br>

   <figure><img src="https://641624378-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fqwj5uwp8v68jk4VznncE%2Fuploads%2FaBdKyQupkLwu1OlUrYHG%2F2_%EA%B4%80%EB%A6%AC%EC%9E%90%EB%B0%94%EB%A1%9C%EA%B0%80%EA%B8%B0.png?alt=media&#x26;token=86f356ef-5f6c-4a0c-aafd-be9146e8a6fc" alt=""><figcaption></figcaption></figure>
4. 관리자 페이지 오른쪽 위 **\[에디터 바로가기]**&#xB97C; 클릭합니다.<br>

   <figure><img src="https://641624378-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fqwj5uwp8v68jk4VznncE%2Fuploads%2FMJJJ4ROhUCtfzuAm2DkI%2F3_AD%EC%A0%91%EC%86%8D.png?alt=media&#x26;token=bf1b3ea6-3138-4a74-b949-1214b4c39e6a" alt=""><figcaption></figcaption></figure>

</details>

## 🙋사이트 디자인 하기 FAQ

<details>

<summary>Q. 이미지를 올렸는데 색상이 달라졌어요</summary>

에디터에 추가한 이미지의 색상이 원본과 다르게 보여진다면 이미지 색상 설정 확인이 필요합니다.

이미지의 색상이 다르게 보이는 현상은 보통 이미지 저장시 색상 설정을 인쇄용(CMYK)으로 지정한 경우 발생할 수 있습니다.&#x20;

일반적으로 디지털 기기에 출력을 하시는 이미지는 **sRGB 형식**을 권장 드리며, sRGB 모드로 전환하여 에디터에 업로드시 선명하고 동일한 색상의 이미지를 확인할 수 있습니다.

</details>