Studio 에디터: 가이드 투어
4 분 분량
페이지 메뉴
- 캔버스
- 상단 바
- 왼쪽 패널
- 속성 패널
- 추가 패널
에이전시 및 기업이 뛰어난 사이트를 제작할 수 있는 직관적인 고급 플랫폼인 Studio 에디터에 오신 것을 환영합니다.
이 도움말에서는 Studio 에디터의 모든 부분, 즉 정의, 제어 기능, 보다 효율적으로 작업하는 데 도움이 되는 방법 등에 대해 알아봅니다.
Wix Studio 아카데미로 이동해 추가 Wix Studio 웨비나, 튜토리얼 및 강좌를 확인하세요.
캔버스
캔버스는 에디터의 중앙에 있는 디자인 중인 페이지를 가리킵니다.
작업할 기본 캔버스 크기를 설정하고 측면 핸들을 끌어 크기 조정 시 페이지가 어떻게 표시되는지 확인할 수 있습니다.
![캔버스의 위치를 표시하는 Studio 에디터의 전체 화면 스크린샷](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/8696077d-830a-4b1e-bd86-9df98f89994a/2023/07/07/e19c71c5-dd46-4ba9-94ce-cbe547352209/c1603d37-93f4-4512-b557-c6857761b5b5.png)
요소를 클릭해 선택하면 옵션 툴바가 열립니다. 이러한 옵션은 특정 요소에 따라 다르며, 필요에 맞게 사용자 지정하는 데 도움이 됩니다.
![캔버스에서 요소 클릭 시 열리는 툴바를 보여주는 스크린샷](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/8696077d-830a-4b1e-bd86-9df98f89994a/2023/07/07/703f6a29-f07b-4e2e-b1e1-092a89217f9c/46424235-1f12-4c93-a8b8-624a981778db.png)
요소 라벨에 마우스오버해 상위 요소 중 하나를 대신 선택할 수 있습니다.
![요소 라벨에 마우스오버 시 열리는 사이트 경로 및 상위 요소를 보여주는 GIF](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/8696077d-830a-4b1e-bd86-9df98f89994a/2023/07/07/ec076832-1407-40f2-ab7a-1faf9b7f9041/1875ba37-2f43-44d7-b71e-d5dbdf1742c4.gif)
상단 바
상단 바에는 사이트와 캔버스 보기를 제어하는 데 유용한 여러 도구가 포함되어 있습니다.
Wix Studio 로고에 마우스오버하면 사이트 작업, 보기 옵션, 계정의 다른 부분에 대한 바로가기가 포함된 메뉴가 열립니다.
![Wix Studio 로고에 마우스오버 시 열리는 메뉴를 보여주는 스크린샷](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/8696077d-830a-4b1e-bd86-9df98f89994a/2023/07/07/daa9ff94-78d8-4cbc-b1e9-4f91145e26f7/7af6cef3-76fa-463e-9273-03fc94dd57af.png)
페이지 드롭다운을 사용해 사이트 페이지를 빠르게 탐색하세요. 목록은 페이지 유형별(예: 쇼핑몰 페이지, 회원 페이지)로 구성되어, 필요한 페이지를 빠르게 찾을 수 있습니다.
![Studio 에디터 상단의 페이지 드롭다운 스크린샷](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/8696077d-830a-4b1e-bd86-9df98f89994a/2023/07/07/9dcb1c1b-8f20-43ff-b1c8-2d722a446625/863d6aba-d253-4965-ba2a-219832bb2bf8.png)
상단 바 중앙에서는 중단점 및 캔버스 크기와 관련된 모든 것을 찾아볼 수 있습니다. 중단점 아이콘을 클릭해 다양한 화면 크기에서 페이지를 확인 및 조정하세요.
표시되는 화면 크기는 캔버스의 현재 크기입니다. 또한, 이는 현재 사용 중인 중단점의 기본 편집 크기이기도 합니다. 각 중단점에는 사용자에게 편한 크기로 설정할 수 있는 고유한 기본 크기가 있습니다.
![기본 크기를 설정할 수 있는 화면 크기에 마우스오버 시 열리는 패널을 보여주는 스크린샷](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/8696077d-830a-4b1e-bd86-9df98f89994a/2023/07/07/d5eb8b61-1280-43b5-ba61-32043ef93703/903667a8-bcd2-46e4-a7bd-e7104299c24a.png)
오른쪽에서는 현재 사이트에서 작업 중인 사용자를 확인할 수 있습니다. 또한, 사이트 알림 확인, 작업 실행 취소 또는 재실행, 미리보기 및 게시 등의 작업을 수행할 수 있습니다.
![상단바 오른쪽의 스크린샷](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/8696077d-830a-4b1e-bd86-9df98f89994a/2023/07/07/be44f7a9-dccc-499a-a80b-b0b887544935/7a5787f0-c941-4e60-bbad-b2c438be30ac.png)
왼쪽 패널
Studio 에디터의 왼쪽에서는 작업할 기본 패널을 확인할 수 있습니다.
- 요소 추가: 디자인 요소이든, 온라인 쇼핑몰과 같은 비즈니스 앱이든 관계없이 사이트에 추가할 수 있는 수백 가지 요소를 찾을 수 있습니다.탭을 사용해 다른 카테고리를 탐색하세요.
- 레이어: 페이지의 레이어 및 요소를 위에서 아래로 계층 구조로 표시합니다. 상위 요소(예: 섹션, 컨테이너)를 선택할 경우, 패널에서 내부의 모든 요소를 확인하고, 순서 변경, 비공개 설정 등을 할 수 있습니다.
- 페이지: 새 페이지를 추가하고, 각 페이지의 설정을 편집, 또는 더 이상 필요하지 않은 페이지를 삭제합니다.
- 글로벌 섹션: 이 패널에는 여러 페이지에 표시되도록 설정한 모든 글로벌 섹션이 표시됩니다. 표시되지 않는 페이지에 글로벌 섹션을 추가하거나, 섹션 이름 변경, 복제 또는 삭제 등의 작업을 수행할 수 있습니다.
- 사이트 스타일: 사이트의 시각적 언어를 확인하고 조정합니다. 여기에서 설정한 글꼴 스타일, 색상 및 페이지 전환은 전체 사이트에 적용됩니다.
- 앱 마켓: Wix 앱 마켓에서는 수백 개의 앱을 탐색하고 필요에 맞는 앱을 찾을 수 있습니다.
- CMS (콘텐츠 관리 시스템): 사이트 콘텐츠, 컬렉션 및 동적 페이지를 관리합니다.
![다양한 왼쪽 패널을 한눈에 표시하는 GIF](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/8696077d-830a-4b1e-bd86-9df98f89994a/2023/07/07/48861cac-1381-4e06-9d4b-086e01896ae8/ea42fc7d-551a-4625-8632-8fb8cdc3d306.gif)
속성 패널
속성 패널은 각 요소에 대한 " 제어 센터"입니다.
캔버스에서 요소를 선택하면 속성 패널에서 요소의 크기, 위치 및 디자인을 설정할 수 있습니다. 요소에 애니메이션을 적용하거나 앵커를 추가해 직접 연결할 수도 있습니다.
![속성 패널의 다양한 섹션과 탭을 보여주는 GIF](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/8696077d-830a-4b1e-bd86-9df98f89994a/2023/07/07/e37b55a5-73fe-4cc6-a4c6-0264c14e03fe/e31f57f9-4097-4b3d-bc1c-f3c6a7ee7bdc.gif)
추가 패널
마지막으로, 에디터의 왼쪽 하단에는 알아야 할 여러 패널이 있습니다.
- 사이트 진단 도구
: 이 도구를 사용해 사이트 전반에 걸쳐 수정이 권장되는 문제를 확인함으로서 방문자의 경험을 이상적으로 만들 수 있습니다.
- Velo 개발자 모드
: 개발자 모드를 활성화해 사이트에 나만의 코드를 추가합니다.
- 댓글
: 사이트에서 작업하는 팀원과 Studio 에디터에서 직접 소통할 수 있습니다.모든 페이지에는 다른 사용자를 위한 피드백을 남기고 질문을 할 수 있는 별도의 댓글 게시판이 있습니다.
- 도움말
: 리소스를 둘러보거나 Studio 에디터에 대한 피드백을 공유하고, 고객지원 팀에 문의할 수 있습니다.