> For the complete documentation index, see [llms.txt](https://help.makeshop.co.kr/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.makeshop.co.kr/guide/undefined-7.md).

# 디자인 수정 가이드

### #디자인 스킨 샘플 이미지 변경하는 방법

### 1. 샘플 이미지 사이즈 확인 방법

<figure><img src="/files/7koR1deHqlgk8QVzh6Ra" alt=""><figcaption></figcaption></figure>

1. 마우스 커서 위치를 변경할 이미지 영역으로 이동시켜 주세요.
2. 마우스 오른쪽 클릭하여 ‘새 탭에서 이미지 열기’ 메뉴를 클릭해 주세요.

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

1. &#x20;브라우저 새 창으로 이미지를 확인할 수 있어요.
2. 이미지 파일명과 함께 이미지 사이즈 확인이 가능해요.
3. 이미지 호스팅에 업로드된 이미지 주소를 확인할 수 있어요.

* 확인한 이미지 사이즈로 내 쇼핑몰 로고와 메인 배너 이미지를 제작해 주세요.

{% hint style="info" %}
**Q. 샘플 이미지와 동일한 사이즈로만 제작해야 하나요?**\
**A.** 원하는 사이즈로 작업해도 되지만 사이즈가 많이 차이나면 다른 디자인 영역에 영향을 끼칠 수 있어요.\
쇼핑몰 로고 이미지의 경우 **상하좌우 공백 없이 png 파일의 투명 배경**으로 작업하시길 추천드려요.
{% endhint %}

#### 📲 PC에서 모바일 샵 확인할 수 있어요!

#### 관리자 메뉴 위치

`디자인` > `디자인 스킨 관리` > `디자인 스킨 관리`

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

* 내 모바일샵 열기 버튼 클릭으로 PC에서 모바일샵 확인 및 이미지 사이즈 확인 할 수 있어요.
* 관리자 페이지 오른쪽 상단 내 쇼핑몰 버튼 클릭하면 PC/MOBILE 버전별로 쇼핑몰 확인할 수 있어요.

***

### 2. 웹FTP에 이미지 업로드하는 방법

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

작업 페이지 : **디자인 > 디자인 스킨관리 왼쪽 상단 FTP \[웹FTP] 메뉴**

1. FTP \[웹FTP] 열기 버튼 클릭하면 웹FTP 팝업창이 띄워져요.
2. \[파일 선택] 버튼 클릭한 후 업로드할 이미지 파일을 선택해 주세요.
3. ️\[파일 업로드] 버튼 클릭해서 선택한 이미지를 웹FTP에 업로드해 주세요.
4. 업로드된 이미지 파일명을 클릭해 주세요.
5. 확인된 이미지 경로를 복사해 주세요.

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

***

### 3. 이미지 경로 수정하는 방법

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

1. **작업 페이지**: 개별 디자인 > 디자인 스킨 관리 > 디자인 편집하기 > 상단 > 기본 상단&#x20;
2. 개별 디자인 편집 페이지에서 Ctrl+F 클릭하여 붙여넣기 해 주세요.

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

3. 확인된 영역에 웹FTP에 업로드한 이미지 경로로 수정해 주세요.

{% hint style="info" %}
**\[이미지 경로 수정하는 방법]**&#x20;

img src="[//skin.makeshop.co.kr/skin/supermarket/img/logo.png](https://skin.makeshop.co.kr/skin/supermarket/img/logo.png)"

→ img src="웹FTP에 업로드한 이미지 경로 복사한 후 입력"
{% endhint %}

예) 이미지 경로 수정 후 적용된 이미지

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

<figure><img src="/files/6ptvahcyJYQXd25LllDj" alt=""><figcaption></figcaption></figure>

안내된 방법으로 샘플 로고, 배너 이미지 등 운영자님이 직접 수정할 수 있어요.

***

### 4. 스킨 디자인 영역 구분 TIP

쇼핑몰 메인 디자인 수정할 때 어느 영역에서 수정해야 할지 모르실 때 참고하세요.

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

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

#### 📢 메이크샵 고객센터

✔️ 1:1 문의 게시판 - 메이크샵 개별 디자인 수정 문의는 1:1 문의 게시판을 이용해 주세요.

메이크샵 1:1 문의 ↓(배너클릭)

{% embed url="<https://www.makeshop.co.kr/newmakeshop/home/mlogin.html?action_mode=write&return_url=contact>" %}

#### 🤓 미리캔버스를 통해 쇼핑몰 이미지 만들어보기!

#### 쇼핑몰    메인  배너 이렇게 쉽게 작업한다고? ↓(링크클릭)

[<kbd>https://blog.naver.com/makeshop\_official/223039395794</kbd>](https://blog.naver.com/makeshop_official/223039395794)

#### 📹 쇼핑몰 로고/배너 이미지 교체방법 동영상 ⬇️

[\[쇼핑몰 만들기\] 쇼핑몰 로고/배너 이미지 교체방법](https://www.youtube.com/watch?v=SgDQUhGPhOc)

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

#### 😅 로고/배너 교체가 어려워요\~!

이미지 제작 후 ‘메이크샵 신규 창업팀’ 플러스친구 채팅방에 전달해 주시면 이미지 교체 진행해 드려요.

#### 👨🏻‍💻 로고/매인배너 등 디자인 전문가 도움을 받고 싶어요\~!

디자인 제작 무료 상담 받아보실 수 있어요. ↓(배너클릭)

{% embed url="<https://www.makeshop.co.kr/newmakeshop/home/shop_custom.html>" %}