요즘 스마트폰 대중화로 인해 플래시 사용이 많이 줄긴 했지만 그래도 플래시의 매력을 아는 고객층이 많기 때문에

기본적인 사용방법은 꼭 알고 넘어가셔야 합니다.

 

그리고 본 솔루션은 PC버젼과 모바일버젼 홈페이지가 따로 따로 있기때문에 PC버젼에서만 플래시를 자유롭게 사용하시면 됩니다.

 

그럼 미션을 시작하겠습니다. ^^

 

플래시 할 줄 모른다고 겁부터 내시는 분들이 많은신데 전혀 겁낼 필요 없습니다. 그냥 따라하세요 ㅎㅎㅎ

 

 

 

 

 

 

 아람스쿨 홈페이지에서 [커뮤니티 > 만들기 TIP > 소스공개] 메뉴가 있습니다.

 여기서 "메인 중앙 비쥬얼 플래시" 파일이 있습니다.

 찾기 귀찮으신분들 위해 링크 걸어 둡니다.

 

http://aramschool.co.kr/bbs_shop/read.htm?board_code=data&idx=1064

 

여기서 플래시 사용방법을 꼭~~~~ 읽어 보신 후에 플래시소스를 다운 받으시기 바랍니다.

 

압축을 푸시고 visual.swf을 실행 하시면 이미지가 자연스럽게 바뀌는 플래시를 볼수 있습니다.

 

우리는 이번 미션을 통해 솔루션의 DB와 연동하여 더욱 멋진 플래시로 재탄생(?) 시켜봅시다. ^^

 

 

 

 

visual.fla 파일을 CS3 Flash로 열어 보시기 바랍니다. (CS3 이하 버젼에서는 에러 날수 있으니 꼭 CS3 이상에서 작업 하시기 바랍니다.)

 

 

그럼 위 화면과 같이 2개의 액션프레임이 보이나요?

두번째 레이어의 액션프레임을 선택하고 F9를 누르시면 아래와 같은 화면이 나타납니다.

 

 

필자는 메인 사이즈를 700*300으로 수정하였으며  번호표시되는 좌표값을 10,10으로 수정했습니다.

여러분은 각자 취향에 맞게 수정하시기 바랍니다.

수정을 다 하셨으면  Ctrl + Enter 키를 누르시면 완성된 화면을 볼 수 있습니다.

 

 

 

 

 

[디자인관리 》 전문가 환경설정 》 맞춤 XML 파일생성 ]으로 이동합니다.

   - [메뉴추가]버튼을 클릭 합니다.

   - "xml 고유코드" 입력란에 "main" 이라고 입력하고 제목에는 "메인중앙비쥬얼" 이라고 입력합니다.

   - "이미지 파일 첨부1"에 "메인 이미지"라고 입력하고 이미지 사이즈를 700 x 300 으로 입력합니다.

   - 밑 부분에 [확인]버튼을 클릭 합니다.

 

 

 

 

 

 

아래와 같은 화면이 나오면 정상적으로  xml 파일이 생성된 것 입니다.

 
 

여기서 [데이타관리] 버튼을 클릭하세요.

그러면 새창으로  xml데이타를 관리하는 페이지가 나타납니다. 여기서 [데이타 추가]버튼을 클릭 후 이미지 파일을 첨부해주세요. (아무거나 ^^)

아래는 필자가 임의로 사진을 첨부한 화면입니다.

 

 

사진등록을 다 하셨다면 창을 닫으시고 "맞춤형 XML관리"화면에서 "XML유형2"의 [복사]버튼이 있습니다. 클릭하시면 자동으로 클립보드에 XML경로가 저장됩니다.(보안 경고창이 뜨면 [엑세스허용]버튼을 클릭하시기 바랍니다.)

[시작 > 프로그램 > 보조프로그램 > 메모장]을 열어서 붙여넣기 해보세요. (또는 Ctrl + V로 붙여넣기)

그럼 아래 그림과 같이 XML경로를 확인 할 수 있습니다.

 

 

 

 

 

 

 [디자인관리 》 고급 디자인 관리 》 웹디자인 FTP] 으로 이동 하신 다음 파일선택 버튼을 클릭하여 위에서 다운 받은

 

 visual.swf 파일을 찾아서 업로드 합니다.  (swf 파일만 업로드 해주세요)

 

업로드 하고 난 뒤 visual.swf 을 클릭 하면 좌측에 파일경로를 볼수 있습니다. 이경로를 따로 메모 해두시기 바랍니다.

 

주의! 필자의 경우는 visual.swf 파일의 경로가 /img_up/shop_pds/uhkr20/design/visual.swf 이지만 여러분은 파일경로가 다르므로 절대 필자와 똑같이 적으시면 안됩니다. 솔루션의 모든 계정은 서로 파일경로가 다 틀립니다.

 

 

 

 

 

 

 

 

 [디자인관리 》 고급 디자인 관리 》 메인 화면 디자인]으로 이동 하신 다음 "Body디자인"을 클릭합니다.

아래와 같이 소스를 입력 하시기 바랍니다.

 

※ 추가된 HTML <script> flash('/img_up/shop_pds/계정ID/design/visual.swf',700,300,'','','xml_path=/xml_center/my_xml2.php?xml_code=main'); </script>

 

 

 

 

위 flash()함수는 솔루션 내장 함수 입니다.

첫번째 인자는 swf 파일 경로 이며 이전 단계에서 FTP에 파일 업로드하였을때 파일경로를 넣으시면 됩니다.

두번째,세번째 인자는 플래시 영역 크기 입니다.

다섯번째 인자는 xml_path를 알려주는 변수 이며 좀전에 메모장에 붙여넣었던 것을 여기에 다시 붙여 넣으시면 됩니다.

 

 

 

이제 관리자 모드에서 [디자인 관리 > 간편디자인 > 플래시 이미지관리]에서 파일만 업로드 하시면 자동으로 플래시가

변경됩니다.

 

 

 

수고하셨습니다.

 

완성 화면 : http://uhkr20.aramschool.co.kr

 

 

 

재미있었나요? ^^

 

다음 미션은 더욱 재미있는 네비게이션 플래시가 기다리고 있으니 10분 쉬었다가 바로 진행합시다. ^^