에디터

✅ 에디터는 쇼핑몰 디자인 스킨 소스 코드를 수정 및 편집할 수 있는 기능입니다.

<스킨 에디터>

① 메뉴트리 스킨을 구성하고 있는 html 파일과 css 파일을 메뉴별로 확인할 수 있습니다. 특정 메뉴의 폴더를 클릭하면 오른쪽 편집영역에 해당 메뉴를 구성하는 소스 코드가 확인돼요.

② 히스토리 보기 [히스토리 보기] 버튼을 클릭하면, 소스 코드 수정을 진행한 일자가 리스트로 노출됩니다. 해당 일자를 클릭하면 소스 코드 수정 내역을 확인할 수 있는 '히스토리 코드' 화면과, 현재 수정이 가능한 '편집 코드' 화면으로 분할되어 나타나요.

<히스토리 보기>

③ 미리보기 [미리보기] 버튼을 클릭하면 수정한 소스 코드가 반영된 해당 메뉴의 쇼핑몰 미리보기 페이지로 이동됩니다. 📍 [미리보기] 버튼은 html 파일 편집 영역에만 노출돼요.

④ 저장 소스 코드 수정을 완료하고, 반드시 [저장] 버튼을 클릭해야 수정한 소스 코드가 스킨에 최종 반영돼요.

<페이지추가>

⑤ 페이지 추가 스킨에 새로운 페이지를 생성하여 쇼핑몰 컨텐츠를 추가할 수 있습니다. [페이지 추가] 버튼을 클릭하면 나타나는 '페이지 추가' 창에서 새로운 페이지 이름인 파일명을 입력하고, [저장] 버튼을 클릭합니다. 📍새로운 페이지는 '기타' 폴더 내에 생성되는 점을 참고해 주세요.

<페이지 추가 소스코드 입력>

⑦ '기타' 폴더 내에 새롭게 추가한 페이지의 html 파일이 확인됩니다.

새로운 컨텐츠 추가를 위한 소스 코드는 <main> 과 </main> 사이에 입력합니다. "여기에 소스코드를 입력해 주세요."를 삭제하고 입력해 주세요.

<모듈추가>

⑨ 모듈추가

• 모듈명을 클릭하면, 모듈을 구성하고 있는 소스 코드가 자동으로 복사돼요.

• 메뉴트리로 이동해 주세요.

• 복사한 모듈을 추가하고 싶은 메뉴의 페이지와 해당 위치에 붙여넣기 하여 활용할 수 있어요.

모듈이란, 스킨을 구성하고 있는 여러 기능을 구분한 최소한의 단위를 의미해요.

🤚 에디터 제공 모듈

• 상단 레이아웃(헤더) / 하단 레이아웃(푸터) 해당 모듈의 복사가 가능합니다.

• 상품 진열 모듈 전시관리 > 상품 진열 관리 > 상품 진열 등록 메뉴에서 신규 등록한 상품 진열 모듈을 검색해 복사하여 활용할 수 있습니다.

• 배너 모듈 전시관리 > 스킨 배너 관리 > 스킨 배너 등록 메뉴에서 신규 등록한 배너 모듈을 검색해 복사하여 활용할 수 있습니다.