통합 매뉴얼 10.하단 디자인 코딩하기
2012-02-18 01:37:44
(dcweb) 조회수 1051

04 하단 디자인 코딩하기

1 하단 디자인 코딩하기

웹디모 기업의 하단부분은 회사관련 배너 또는 회사정보, 이용약관, 개인정보취급방침, Copyright 등을 표시하는 부분입니다. 아래와 같이“하단 기본 세팅이미지”를“하단에 사용할 디자인 및 솔루션”으로 변경해 보도록 하겠습니다.EMB000005e01ac5 src

하단 기본 세팅 이미지하단에 사용할 디자인 및 솔루션

EMB000005e01ac6 src

? 기본 정보에서 입력

? 기본 세팅 이미지에서 링크 복사해서 하이퍼링크 걸기

? 기본 정보에서 입력

(1) 하단 디자인 코딩하기

아래의 그림은 기본적인 하단디자인을 [디자인관리 》고급 디자인 관리 》메인 화면 디자인]의 하단디자인에 적용한 화면입니다. 웹디모 솔루션 구입시 설정된 하단 디자인 소스를 이용하여 회사소개, 이용약관 등의 버튼에 하이퍼링크를 걸고, 하단 로고는 미리 변환코드로 설정했습니다. 아래에 사용되는 변환코드는 하단디자인의 문자변환코드버튼을 클릭하여 쉽게 삽입할 수 있습니다.

EMB000005e01ac7 src

위의 하단 디자인을 수정한 소스입니다.

<table width="980" border="0" align="center" cellpadding="0" cellspacing="0">

<tr>

<td width="29"><img src="/img_up/shop_pds/uhome003/design/main/copy0.gif" width="29" height="83"></td>

<td background="/img_up/shop_pds/uhome003/design/main/copybg.gif" >

<table width="100%" border="0" cellspacing="0" cellpadding="0">

<tr>

<td width="100">{SHOP_LOGO2_HTML}</td>

<td width='2'><img src="/img_up/shop_pds/uhome003/design/main/bottom001.gif" width="2" ></td>

<td valign="top" style='padding:10 0 0 30'>

<table width="275" border="0" cellspacing="0" cellpadding="0">

<tr>

<td><a href="/shop_info/company.htm"><img src="/img_up/shop_pds/uhome003/design/main/bottom002.gif" width="61" height="14" border="0"/></a></td>

<td><a href="/shop_info/agree.htm"><img src="/img_up/shop_pds/uhome003/design/main/bottom003.gif" width="58" height="14" border="0"/></a></td>

<td><a href="/shop_info/privacy.htm"><img src="/img_up/shop_pds/uhome003/design/main/bottom004.gif" width="96" height="14" border="0"/></a></td>

<td><a href="/bbs_shop/list.htm?board_code=board"><img src="/img_up/shop_pds/uhome003/design/main/bottom005.gif" width="60" height="14" border="0"/></a></td>

</tr>

</table>

<div style='padding:10 0 0 0;'>

상호 : {COMPANY_NAME} / 대표 : {CEO_NAME} / 사업자 등록번호 : {REGNO} / 통신판매번호 : {COMREGNO} <br />

주소 : {ADDR1} {ADDR2}/ TEL : {HELP_TEL} / FAX : {FAX} / Email : {HELP_EMAIL}<br>

copyright(c) 2008 {SHOP_NAME}All Rights Reserved.

</div>

</td>

</tr>

</table>

</td>

<td align="left"><img src="/img_up/shop_pds/uhome003/design/main/copy1.gif" width="19" height="83"></td>

</tr>

</table>

하단 디자인에 사용된 변환코드

- 하단로고 : {SHOP_LOGO2_HTML}

- 상호 : {COMPANY_NAME}

- 대표 : {CEO_NAME}

- 사업자 등록번호 : {REGNO}

- 통신판매번호 : {COMREGNO}

- 주소 : {ADDR1} {ADDR2}

-전화번호 : {HELP_TEL}

- 팩스번호 : {FAX}

- 이메일 : {HELP_EMAIL}

(2) 하단로고 등록

EMB000005e01ac8 src

? [기본정보 》기본정보설정]의 사이트정보설정으로 이동합니다.

? 사이트 하단로고의 찾아보기 버튼을 클릭하여 하단 로고를 삽입합니다. 아래와 같이 메인화면에 로고가 삽입 되었습니다. 나중에 로고가 변경될 경우에는 위와 동일한 방법으로 수정할 수 있습니다.

EMB000005e01ac9 src

(3) 홈페이지 정보 출력하기

위의 변환코드를 사용하여 생성된 하단디자인에 실제로 내용이 출력되도록 만들어보겠습니다.

EMB000005e01aca src

관리자모드에서 [기본정보》기본정보설정]으로 이동합니다.

? 사업자 등록번호를 입력합니다.

? 회사명을 입력합니다.

? 대표자 이름을 입력합니다.

? 팩스번호를 입력합니다.

? 사업장 주소를 입력합니다.

? 통신판매신고번호를 입력합니다.

? 사이트 명을 입력합니다.

? 고객 상담전화를 입력합니다.

? 고객 상담이메일을 입력합니다.

적용버튼을 클릭하면 아래와 같이 입력된 정보들이 하단디자인에 출력됩니다.

EMB000005e01acb src