통합 매뉴얼 디자인관리 》 고급 디자인 관리 》 세부 화면 디자인
2010-10-21 14:10:57

세부화면 디자인 [디자인관리 》 고급 디자인 관리 》 세부 화면 디자인]

솔루션에서 기본적으로 제공하는 디자인으로 세부페이지를 생성하며 확장자가 HTM파일로 생성됩니다.

홈페이지계정을 만들 때 유형을 쇼핑몰을 선택해서 계정을 만들었다면 상품목록, 장바구니, 주문하기, 마이페이지 등 쇼핑몰에 필요한 모든 페이지가 자동으로 생성됩니다. 생성된 페이지는 좌측 사이트화면에서 확인 할 수 있으며, 우측 디자인선택 및 설정에서 각 페이지 마다 디자인 추가 및 수정이 가능하도록 되어 있습니다.

솔루션에서 제공되는 모든 페이지는 [디자인관리》고급 디자인 관리》메인 화면 디자인]에서 생성한 상단/왼쪽/하단디자인을 불러올 수 있도록 되어 있습니다. 이것은 메인 화면 디자인에서 상단/왼쪽/하단디자인을 필요한 만큼의 개수를 만들어서 세부화면 디자인을 할 때, 필요한 디자인을 선택하는 것만으로 간편하게 디자인 작업을 할 수 있도록 되어 있습니다.

세부화면 디자인에는 다양한 디자인을 선택하고 설정할 수 있으며 모두 동일한 방법으로 디자인을 설정합니다. 여기서는 회원 가입폼의 디자인을 바꾸어 보도록 하겠습니다.

사이트화면에서 '회원 가입 폼'을 클릭합니다.

메인 화면 디자인에서 생성한 상단디자인, 왼쪽디자인, 하단디자인을 선택합니다.

세부화면 디자인에는 각 디자인마다 기본 템플릿이 포함되어 있습니다. 현재 기본 템플릿은 '회원 가입 폼A'와 '회원 가입 폼B'가 있으며, 하나씩 체크하고 미리보기버튼을 클릭하여 회원 가입 폼의 디자인을 확인한 후 선택합니다. 여기서는 '회원가입 폼B'를 선택합니다.


기본템플릿은 바로 사용할 수도 있지만 디자인 퀄리티가 많이 떨어지기 때문에 되도록 직접 사용하는 것보다 디자인을 수정해서 사용하시기 바랍니다.

'나만의 디자인으로 복사'버튼을 클릭하면 자동으로 기본 템플릿의 디자인소스가 새로운 페이지로 디자인이 삽입됩니다.

새로운 디자인의 제목을 입력합니다.

어디든지 접근이 가능한 경로인 강제접근코드를 입력합니다. (선택사항)

회원가입 폼, 상품 목록, 장바구니 등 모든 세부화면 디자인은 1가지 디자인을 선택할 수 있도록 되어 있습니다. 그러나 상황에 따라서는 2가지 이상의 디자인이 필요로 할 경우가 있습니다. 이때 강제 접근 코드를 이용하여 다른 디자인이 출력되도록 할 수 있습니다.

예를 들어, 회원 가입폼에서 기업 회원가입폼,  일반 회원가입폼, VIP 회원가입폼 등의 3가지로 나누고 각각 디자인이 다른 경우에는 강제접근 코드를 사용하여 해당 디자인을 불러올 수 있습니다. 자세한 내용은 전문가스텝 3에서 상세하게 다루도록 하겠습니다.

필요한 디자인 소스를 수정한 후 저장 버튼을 클릭하면 새로운 나만의 디자인 템플릿이 추가됩니다.

나만의 디자인에 '[REG]회원가입폼 수정'이란 디자인이 추가되었습니다. 추가된 디자인을 선택하고 적용버튼을 클릭하여 홈페이지에 현재 디자인을 적용시킵니다.


[설정 전 출력화면]


[설정 후 출력화면]

 

<출처> 예성출판 - "홈페이지빌더 2.0"  일부 발취