엘리멘터 편집화면 구조

엘리멘터 편집 화면은 크게 네 부분으로 나뉩니다.

1. 상단 메뉴 : 페이지 전반에 대한 설정 및 관리를 담당합니다.
2. 위젯 패널 : 엘리멘터는 다양한 레이아웃을 제공합니다. 
3. 네비게이션 : 페이지의 구조를 계층적으로 보여주는 트리 구조 탐색 도구입니다.
4. 컨텐츠영역 : 디자인이 적용되는 실시간 미리 보기 영역입니다.

1. 상단메뉴

1-1. 테마빌더

헤더 및 푸터, 아카이브, 404, 우커머스 페이지 같은 전체 웹사이트를 구성하는 반복되는 부분을 디자인하여 전체제어가 가능하여 사이트의 모든 부분을 맞춤설정할 수 있습니다.

 1-2. 히스토리

엘리멘터에서 작업 전 상태로 실행 취소 할 수 있습니다.

1-3. 사용자 기본 설정

1-4. 키보드 단축키

엘리멘터에서 자주 사용되는 단축키가 안내되어 있습니다.

1-5. 워드프레스로 나가기

워드프레스 글쓰기 편집기 창으로 나가게 됩니다.

1-6. 엘리멘터페이지표시

작업중인 페이지로 이동 및 새 페이지 추가가 가능합니다.

1-7. 게시물설정

페이지 제목, 상태(임시글, 검토대기중, 비공개, 발행함), CSS 등을 관리.  또한 엘리멘터로 모바일사이트를 만들 때 모바일, 테블릿, PC로 선택하여 작업할 수 있습니다.

1-8. 상단메뉴 – 우측

체크리스트, 알림메세지, 찾기, 도움말, 미리보기가 제공되어 엘리멘터로 페이지를 만드는 상황에서 도움을 받을 수 있습니다.

2. 위젯패널

제목(Heading): 텍스트를 삽입하고 스타일링할 수 있습니다.

텍스트 에디터(Text Editor): 서식 있는 텍스트를 추가할 때 사용합니다.

이미지(Image): 이미지를 삽입하고 크기, 정렬, 링크를 설정합니다.

버튼(Button): 클릭 가능한 버튼을 생성하며, 링크, 색상, 텍스트를 설정할 수 있습니다.

비디오(Video): YouTube, Vimeo 등에서 동영상을 삽입하고 설정합니다.

3. 네비게이션

제공 기능: 드래그 앤 드롭 방식으로 위젯을 캔버스에 추가.  선택한 요소의 콘텐츠(Content), 디자인(Style), 고급 설정(Advanced) 을 변경.  위젯 검색 기능을 사용해 원하는 위젯을 빠르게 찾기.

페이지 구조 보기: 모든 섹션, 컬럼, 위젯을 계층적으로 표시.

빠른 탐색: 특정 요소를 클릭해 직접 수정 가능.

드래그 앤 드롭: 요소를 이동하거나 순서를 재배치.

이름 지정: 섹션과 위젯에 이름을 붙여 작업을 체계적으로 관리.

요소 숨기기 및 표시: 특정 요소를 숨기거나 다시 활성화.

삭제 및 복사: 탐색기에서 바로 요소를 삭제하거나 복사 가능.

응답성 확인: 데스크톱, 태블릿, 모바일 화면에서 요소를 비활성화하거나 수정.

4. 컨텐츠영역

제공 기능: 섹션, 컬럼, 위젯을 추가하거나 삭제.  드래그 앤 드롭으로 레이아웃과 컨테이너 위치를 조정.  실시간으로 디자인을 확인하며 작업.

The post 엘리멘터 옵션 first appeared on 매뉴얼.