컨텐츠 바로가기


사용자 가이드 상세

레이아웃이란?


스마트디자인에서는, 쇼핑몰의 화면에서 공통으로 사용 되는 로고, 카테고리, 하단 회사 정보 등을

편리하게 관리 할 수 있도록 처리 할 수 있도록 "레이아웃" 형태를 제공합니다.






레이아웃 적용하기



1) 레이아웃 불러오기


레이아웃은 모든 페이지에서 HTML 최상단에 아래 이미지와 같이 <!--@layout(/layout.html)--> 의 형태로 불러옵니다.

해당 레이아웃을 불러오는 페이지는 이 layout.html에서 변경한 내역이 모두 반영되기 때문에 페이지 관리가 용이합니다.

각각의 페이지에서 레이아웃 디자인을 다르게 사용하고 싶은 경우, 각각 다른 레이아웃 페이지를 만들어서 해당 페이지에 불러오기만 하면 됩니다.





2) 레이아웃의 소스 구조


레이아웃에는 문서의 타입을 정의하는 <!DOCTYPE>과 html의 기본 구조인 <html>, <head>, <body> 로 구성되어 있으며, 이 4가지는 필수 구성 요소 입니다.

필요에 따라 CSS와 javascript 파일을 불러올수 있으며, 스마트디자인에는 제이쿼리 1.4.4 버전이 내장되어 있어서 추가로 제이쿼리를 호출하면 충돌이 생길 수 있습니다.

레이아웃의 디자인은 <body></body> 태그 안에 작성합니다. 아래에 이미지와 같이 <head></head> 안에 내용은 그대로 두는 것을 권장합니다.





3) 컨텐츠 영역과 레이아웃 연결하기

컨텐츠영역은 레이아웃 페이지 내에서 <!--@contents--> 로 불러옵니다.
레이아웃 페이지를 제작할때 컨텐츠를 불러오고 싶은 위치에 해당 주석을 넣어주면 컨텐츠와 레이아웃을 연결할 수 있습니다.

TOP

목록 게시안함 삭제 수정