CMS매뉴얼 11.xml연동 갤러리 사용하기
2012-02-25 19:48:24

11. xml연동 갤러리 사용하기

웹디모 솔루션에서는 작업의 효율성을 높이기 위해 XML플래시를 공개하고 있습니다. xml플래시는 웹디모 공식솔루션 홈페이지(http://www.yestop.co.kr)에서 회원가입 후 웹디모 플래시를 무료로 다운로드 받을 수 있습니다.

EMB00001490357c src

(1) 웹디모 공식 XML연동 갤러리 사용설명

웹디모 공식 솔루션 홈페이지(http://www.yestop.co.kr)에서 [웹디모 공식 XML연동 쇼핑몰상품출력 사용설명 - 1]을 다운로드 한 후 visual.fla파일을 수정하고 솔루션에 적용하는 방법에 대해서 살펴보겠습니다.

EMB00001490357d src

? 웹디모 공식 솔루션 홈페이지에서 [웹디모 공식 XML연동 갤러리 사용설명 - 2]를 다운로드 한 후 visual.fla 파일을 열고 AS_VISUAL레이어의 액션스크립트 소스를 F9를 클릭하여 확인합니다.

? 소스를 아래와 같이 변경합니다.

EMB00001490357e src

? AS_VISUAL레이어의 액션스크립트를 수정하면 다음과 같습니다.

_root.main_size= "801,736" //w, h, 메인의 크기

_root.list_pos= "690,25//x, y 리스트 위치

위와 같이 AS_VISUAL레이어의 액션스크립트를 수정한 후 저장하고 Ctrl+Enter를 눌러 visual.swf파일을

생성합니다.

? [디자인관리》고급 디자인 관리》웹디자인 FTP]로 이동하여 swf폴더를 만들고 visual.swf파일을 업로드 합니다.

? 아래 그림에서 빨강 테두리가 visual.swf파일이 출력되어야 하는 부분입니다. 플래시 파일을 출력하기 위해 솔루션에서 XML파일을 생성해 보도록 하겠습니다.

EMB00001490357f src

? [디자인관리》디자인 마법사 설정》맞춤 XML 파일생성]에서“맞춤형 XML 데이터관리”메뉴 사용여부에 사용함을 체크한 다음 저장합니다.

EMB000014903580 src

? [디자인관리 》디자인 마법사 설정 》맞춤 XML 파일생성]의 메뉴 추가 버튼을 클릭합니다.

EMB000014903581 src

? XML고유 코드에 visual, 제목에 메인 비주얼 이미지, 이미지 파일첨부1 항목명에 이미지 명, 설명에 이미지 파일첨부 라고 입력한 후 확인버튼을 클릭합니다.

EMB000014903582 src

EMB000014903583 src

? 데이터관리 버튼을 클릭해 이미지를 업로드 합니다.

XML 유형2 URL버튼을 클릭하여 URL주소를 복사합니다.

? [디자인관리 》고급 디자인 관리 》메인 화면 디자인]의 상단디자인에서 웹디모 샵의 상단디자인 소스를 드림위버로 가져와서 삽입될 위치의 <td>~</td>에 플래시 소스를 입력하고 에서 복사된 URL주소를 삽입합니다.

아래는 웹디모 솔루션에 XML플래시를 삽입하는 소스입니다.

<script>

flash('플래시경로',가로크기,세로크기,'','','xml_path=XML경로');

</script>

EMB000014903541 src

? [디자인관리》고급 디자인 관리》메인 화면 디자인]의 메인 중앙 디자인에 드림위버에서 수정된 소스를 입력한 후 적용된 화면은 아래와 같습니다. 적용 후에 데이터 관리는 간편 디자인에“맞춤 XML 데이타 관리”에서 쉽게 관리할 수 있습니다.

EMB000014903542 src

(2) 웹디모 공식 XML연동 쇼핑몰상품출력 사용설명 - 1

웹디모 공식 솔루션 홈페이지(http://www.yestop.co.kr)에서 [웹디모 공식 XML연동 쇼핑몰상품출력 사용설명 - 2]를 다운로드 받은 후 webdimo_pro.fla 파일을 수정하고 솔루션에 적용하는 방법에 대해서 살펴보도록 하겠습니다.

아래의 그림에서 빨간 박스부분이 XML연동 쇼핑몰상품이 출력되는 곳입니다.

EMB000014903584 src

새로운 XML을 만들기 위해서는 상품추출코드를 미리 생성해야 합니다. 상품추출코드를 생성하기 위해서는 [상품관리 》상품관리 》메인상품관리]의 “메인화면 데이타 출력 관리”에서 “메인출력그룹관리”를 클릭하고 새로운 코드를 생성합니다. 생성된 코드에는 상품을 추가해야 결과를 확인할 수 있습니다.

EMB000014903585 src

? [디자인관리》디자인 마법사 설정》기본 XML 파일생성]의 쇼핑몰 상품정보 XML파일관리에서 XML파일 생성버튼을 클릭합니다.

EMB000014903586 src

? 고유 CODE설정을 입력합니다.

? 카테고리 분류를 선택 합니다.

? 메인추출 코드별을 지정합니다.

? 이미지크기를 입력합니다.

? 출력수를 입력합니다.

? 등록 버튼을 클릭하면 아래 그림과 같이 pro라는 이름의 XML파일이 자동으로 생성됩니다.

EMB000014903587 src

? webdimo_pro.fla 파일을 열어 F9를 클릭하여 액션스크립트 창을 열고, 이미지와 텍스트가 출력되는 항목을 확인합니다. 아래의 그림과 같이 이미지, 텍스트1, 텍스트2의 대괄호 안에 있는 숫자와 생성된 XML파일의 출력항목 숫자가 일치해야 합니다.

XML소스(일반형)에서 각각 img_url는 상품이미지, goods_name은 상품명, price_str는 가격을 의미하며, 플래시의 액션스크립트에 출력항목 위치를 숫자로 입력해야 합니다. 예를 들어, 한 가지 제품에 대한 내용을 가지고 있는 <row> </row>사이에서 <idx>부분이 0번째(배열로 저장되기 때문)로 시작하면, 상품명에 해당하는 <goods_name> 6번째에 해당되므로 출력항목의 숫자를 6으로 설정합니다. (상품이미지 2번째, 상품명 6번째, 가격 24번째)

※ 출력항목의 변동이 없을 경우에는 플래시 파일을 수정하지 않고 사용하셔도 무방합니다.

EMB000014903588 src

? [디자인관리》디자인 마법사 설정》기본 XML 파일생성] pro XML소스 보기를 클릭해서 출력항목을 확인합니다. 출력항목의 위치가 변동이 없으므로 플래시파일 수정 없이 FTP에 추가합니다.

EMB000014903589 src

[디자인관리》디자인 마법사 설정》기본 XML 파일 생성] 쇼핑몰상품정보 XML파일 관리의 pro항목의 클립보드저장을 클릭합니다.

EMB00001490358a src

? [디자인관리》고급 디자인 관리》메인 화면 디자인》메인 중앙디자인] 소스를 드림위버로 불러 XML연동 쇼핑몰상품이 출력되는 위치의 <td>~</td>에 아래와 같이 플래시 소스를 입력합니다. 에서 복사된 클립보드는 xml_path의 뒤에 삽입합니다.

<td style="padding:12 0 18 31">

<script>

flash('/img_up/shop_pds/ushop009/design/swf/webdimo_pro.swf',770,143,'','','xml_path=/xml_center/shop_goods.xml.php?xml_code=pro');

</script>

</td>

EMB00001490358b src

? [디자인관리》고급 디자인 관리》메인 화면 디자인] 메인 중앙 디자인을 드림위버에서 수정한 상단 소스로 입력한 후 적용된 화면은 다음과 같습니다.

EMB00001490358c src