편집기 한눈에 보기

Payly 편집기의 상단 바, 블록 패널, 캔버스, 설정 패널과 저장, 실행 취소, 키보드 단축키가 작동하는 방식을 소개합니다.

편집기는 스토어의 페이지를 만드는 곳입니다. 방문자에게 보이는 모습 그대로 각 페이지를 보면서, 요소를 선택하고 끌어 옮기고 설정을 입력해 페이지를 바꿉니다. 게시하기 전까지는 여기서 한 작업이 방문자에게 보이지 않습니다.

편집기 열기

  1. 사이트 대시보드를 엽니다.
  2. 왼쪽 메뉴 맨 위의 사이트 편집을 클릭합니다.

새 사이트는 디자인을 고르자마자 편집기가 저절로 열립니다. 첫 사이트 만들기를 참고하세요.

네 개의 영역

편집기에는 맨 위를 가로지르는 바가 있고, 그 아래에 세 개의 열이 있습니다. 왼쪽에는 블록 패널, 가운데에는 내 페이지(캔버스), 오른쪽에는 설정 패널이 있습니다.

상단 바, 왼쪽의 블록 패널, 가운데의 홈 페이지, 오른쪽의 페이지 설정이 보이는 편집기

상단 바

상단 바에는 왼쪽부터 다음과 같은 컨트롤이 있습니다.

상단 바의 왼쪽 절반. Payly 로고, 대시보드 버튼, 저장 상태, 사이트 이름, 페이지 선택기
  • 대시보드를 클릭하면 사이트 대시보드로 돌아갑니다.
  • 저장 상태는 작업이 어디까지 진행되었는지 알려 줍니다. 저장됨, 게시 안 됨은 변경 내용이 초안에 저장되었지만 실제 스토어에는 아직 표시되지 않는다는 뜻입니다. 저장 및 게시됨은 실제 스토어가 지금 보고 있는 화면과 같다는 뜻입니다. 변경할 때마다 잠시 저장하는 중…이 표시되고, 저장에 실패하면 저장되지 않음이 표시됩니다.
  • 사이트 이름 상자에는 스토어 이름이 표시됩니다. 클릭하면 사이트 이름을 바꿀 수 있습니다.
  • 페이지 선택기(지금 보고 있는 페이지의 이름, 예를 들어 홈이 표시됩니다)에는 내 페이지 목록이 나옵니다. 페이지를 선택하면 편집할 수 있습니다. 목록 맨 아래의 페이지 관리를 클릭하면 페이지 관리 화면이 열립니다. 페이지 추가 및 관리를 참고하세요.
상단 바의 오른쪽 절반. 데스크톱, 태블릿, 모바일 버튼, 백업, 실행 취소, 다시 실행, 실제 사이트 보기 아이콘, 미리보기와 게시 버튼
  • 데스크톱, 태블릿, 모바일은 디자인 중인 화면 크기를 바꿉니다. 휴대폰과 태블릿에서 사이트 보기 좋게 만들기를 참고하세요.
  • 시계 아이콘(백업)은 저장된 백업을 엽니다. 변경 취소 및 이전 버전 복원을 참고하세요.
  • 화살표 두 개는 실행 취소와 다시 실행입니다.
  • 상자에서 나가는 화살표 아이콘(실제 사이트 보기)은 실제 스토어를 새 탭에서 엽니다. 게시한 뒤에 나타납니다.
  • 미리보기는 링크가 작동하는 전체 사이트를 새 탭에서 보여 줍니다. 게시 전에 사이트 미리 보기를 참고하세요.
  • 게시는 변경 내용을 실제 스토어에 반영합니다. 첫 사이트 게시를 참고하세요.
  • 맨 오른쪽의 계정 메뉴에는 Payly 자체의 테마와 언어(스토어에는 영향이 없습니다), 그리고 설정, Payly 홈, 로그아웃이 있습니다.

블록 패널

왼쪽 열은 블록으로 시작합니다. 블록은 페이지에 추가할 수 있는 구성 요소이며 기본, 미디어, 레이아웃, 스토어, 마케팅, 메뉴 및 폼 그룹으로 나뉘어 있습니다. 블록을 페이지로 끌어 놓거나, 클릭해서 현재 섹션의 맨 끝에 추가하세요. 블록 추가, 이동, 크기 조절을 참고하세요.

같은 열에서 아래로 스크롤하면 구조가 있습니다. 헤더, 현재 페이지의 섹션들, 푸터가 나열되어 있으며 섹션 추가 버튼이 있습니다. 섹션 사용하기를 참고하세요.

캔버스

화면 가운데가 내 페이지입니다. 실제 스토어를 그리는 코드와 같은 코드로 그려지므로 보이는 모습이 방문자가 보는 모습과 같습니다. 블록이나 섹션을 클릭하면 선택됩니다. 선택한 블록에는 파란색 윤곽선, 크기 조절 핸들, 복제, 회전, 삭제 버튼이 있는 작은 도구 모음이 나타납니다. 캔버스의 링크는 클릭해도 열리지 않습니다.

설정 패널

오른쪽 열에는 탭이 두 개 있습니다.

  • 선택 항목에는 선택한 대상의 설정이 표시됩니다. 아무것도 선택하지 않으면 페이지 자체의 설정이 표시됩니다. 브라우저 제목, 검색 설명, 이 페이지를 쇼핑 페이지로 사용 스위치가 있습니다. 블록을 선택하면 그 블록의 설정이 일반, 타이포그래피, 크기와 위치, 관리 같은 제목 아래에 묶여 표시됩니다. 제목을 클릭하면 열립니다. 페이지 설정으로 돌아가려면 패널 맨 위의 페이지 설정을 클릭하거나, Esc를 누르거나, 페이지 옆의 회색 영역을 클릭하세요.
  • 사이트 디자인에는 모든 페이지에 적용되는 색상, 글꼴, 레이아웃 설정이 있습니다. 색상, 글꼴, 레이아웃 설정을 참고하세요.
메인 제목이 선택되어 페이지에 도구 모음이 표시되고 오른쪽에 일반 설정이 열려 있는 편집기

저장되는 방식

편집기는 자동으로 저장합니다. 무언가를 바꾸다가 멈추면 잠시 뒤 초안이 저장되고 상단 바의 상태가 저장됨, 게시 안 됨으로 돌아갑니다. 저장 버튼은 따로 없습니다.

저장된 변경 내용이 곧바로 실제 스토어에 반영되는 것은 아닙니다. 게시를 클릭하기 전까지 방문자에게는 마지막으로 게시한 버전이 계속 보입니다.

실행 취소와 다시 실행

실행 취소를 클릭하면 마지막 변경이 취소되고, 다시 실행을 클릭하면 되돌립니다. 편집기를 연 뒤에 한 변경만 기억합니다. 편집기를 닫거나 새로 고치면 이 기록은 저장된 버전에서 다시 시작됩니다.

키보드 단축키

Mac에서는 Ctrl 대신 Cmd를 사용하세요.

키동작
Ctrl + Z마지막 변경 실행 취소
Ctrl + Shift + Z다시 실행
Ctrl + D선택한 블록 복제
Delete 또는 Backspace선택한 블록 삭제
Esc선택 해제
방향키선택한 블록을 1픽셀씩 이동(Shift를 누르면 10픽셀)
Ctrl + 방향키선택한 블록을 격자 한 칸씩 이동
Ctrl + Shift + 방향키선택한 블록을 한 칸 넓게, 좁게, 높게, 낮게 조절

관련 도움말

Last updated 2026-10-03