디자인관리
디자인 스킨설정
|
로고/배너 관리
|
로고배너편집기
|
WebFTP 이미지 관리
|
알FTP 사용법
|
디자인 에디터
|
메인페이지 디자인
|
서브페이지 디자인
|
새로운 페이지 추가하기
|
스타일시트 관리
|
인트로/공사중 설정
|
메인팝업창 관리
|
움직이는 배너
|
배경음악설정
|
쇼핑카트탭 설정
|
인기상품 노출 설정
|
웹폰트 선택/신청
|
웹폰트 설정
|
웹폰트 신청내역/연장하기
디자인 에디터
<p> </p> <h1 class="head">디자인 에디터 기능이 "업그레이드" 되었습니다.</h1> <p> </p> <p><strong>1. 디자인소스 수정/작업 내역 보기 기능 추가</strong><br> 최근 수정/작업 되었던 디자인 소스를 확인 할 수 있습니다. 가장 최근 작업한 내역을 기준으로 5개 까지 저장됩니다.</p> <p> </p> <p><strong>2. 디자인 에디터 종류 추가</strong><br> - 타입 1(줄번호 출력) : 작업 화면에 라인 번호가 출력 됩니다. 라인 위치를 확인 하면서 소스 편집이 가능합니다.<br> - 타입 2(소스 비교) : codemirror 에디터 형식으로, 기존에 작업되었던 소스와 현재 작업중인 소스를 비교하며 작업할 수 있습니다.</p> <p> </p> <p><strong>3. 편집소스 화면보기 기능 추가</strong><br> 현재 작업중인 디자인 소스가 저장되지 않은 상태에서 적용 예정 화면을 미리 확인 할 수 있습니다.<br> 화면보기 상태에서 세부 영역별 소스 확인이 가능하여 실시간으로 디자인이 반영될 화면을 확인과 동시에 편집 작업이 가능합니다.</p> <p> </p> <p><img onLoad='miniSelfResize(contents_21,this)' width="718" height="681" src="http://guide.godo.co.kr/season4/data/editor/1381124750.jpg"></p> <p> </p> <p> </p> <p> </p> <h1 class="head">디자인 에디터 추가기능 "자세히 살펴보기"</h1> <p><strong></strong> </p> <p><strong>1. 디자인 소스 수정/작업 내역보기</strong></p> <p> </p> <p> 1) 최근 작업된 디자인 내용을 5개까지 확인 및 재 수정이 가능합니다.</p> <p> 2) 리스트 선택 후 [확인] 버튼을 클릭하면, 선택된 디자인 작업 내용이 에디터 편집 화면에 반영 됩니다.</p> <p> </p> <p> <img onLoad='miniSelfResize(contents_21,this)' width="707" height="268" src="http://guide.godo.co.kr/season4/data/editor/1381125796.jpg"></p> <p> </p> <p> </p> <p><strong>2. 디자인 에디터 종류 </strong></p> <p> </p> <p> 1) 기본 : 기존에 제공되었던 에디터 형식으로 기본 베이직 화면이 제공됩니다.</p> <p> </p> <p> 2) 타입 1(줄번호 출력) </p> <p> - 작업 화면에 라인 번호가 출력 됩니다. 라인 위치를 확인 하면서 소스 편집이 가능합니다.</p> <p> - 줄번호만 출력되어 속도가 빠르기 때문에 소스가 긴 디자인 편집 작업에 편리합니다. </p> <p><strong> <img onLoad='miniSelfResize(contents_21,this)' width="702" height="246" src="http://guide.godo.co.kr/season4/data/editor/1381126780.jpg"></strong></p> <p> </p> <p> 3) 타입 2(소스 비교) </p> <p> - codemirror 에디터 형식으로, 기존에 작업되었던 소스와 현재 작업중인 소스를 비교하며 작업할 수 있습니다.</p> <p> - 에디터 페이지 하단에 [소스비교] 텍스트 클릭후, 비교할 디자인 내역을 선택하시면 왼쪽엔 작업소스 화면이, </p> <p> 오른쪽엔 비교대상 소스 화면이 보여 집니다.</p> <p> - 비교내용 구분 : 라인별로 내용이 다른 디자인 소스 부분에는 노란색 배경으로 표기 됩니다.</p> <p> - 디자인 소스 형태별 색상 표시가 되어 한눈에 내용을 파악하고 편집하기가 편리합니다.</p> <p> 예) 이미지 링크연결 소스내용 : <font color="#000000"><font color="#008000"><div><a</font> <font color="#0000ff">href</font>=<font color="#ff0000">"../goods/goods_grp_03.php"</font><font color="#008000">></font><font color="#008000"><img</font> <font color="#0000ff">src</font>=</font><font color="#ff0000">"../img/main/main_best_tit.jpg"</font><font color="#008000">></a></div></font></p> <p> <img onLoad='miniSelfResize(contents_21,this)' width="704" height="548" src="http://guide.godo.co.kr/season4/data/editor/1381126870.jpg"></p> <p> ※ 소스 내용이 많을 경우엔 속도가 느릴수 있습니다.<br> ※ 타입2 에디터는, 인터넷 익스플로러 8 이하는 지원 되지 않습니다. (사용가능 브라우저 : IE9 이상, 크롬, 파이어폭스, 사파리, 오페라)</p> <p> </p> <p> </p> <p><strong>3. 편집소스 화면보기</strong></p> <p> </p> <p> 1) 디자인 에디터 화면 하단에 [ 편집소스 화면보기 ] 버튼을 클릭하시면, 현재 작업중인 디자인 화면을 확인 할 수 있습니다.</p> <p> 저장되지 않은 상태의 편집중인 디자인 화면을 제공 합니다.</p> <p> ※ 저장되어 실제 운영쇼핑몰에 적용중인 디자인 보기는 [ + 화면보기 ] 기능으로 제공됩니다.</p> <p> <img onLoad='miniSelfResize(contents_21,this)' width="688" height="39" src="http://guide.godo.co.kr/season4/data/editor/1381130837.jpg"></p> <p> </p> <p> 2) 편집소스 화면보기 페이지</p> <p> - 하단에 "소스(html) 보기" 텝 버튼을 클릭하여 소스보기 레이어를 열어주세요.</p> <p> - 현재 작업중이었던 영역 or 연결하여 확인하고자 하는 영역을 화면에서 클릭하시면, 해당 영역의 디자인 소스를 하단 "소스(html)보기"</p> <p> 에서 확인 할 수 있습니다.</p> <p> - 디자인 영역 잡기 : 특정 영역을 화면에서 클릭한 상태에서 마우스 휠을 돌리시면 클릭한 디자인이 포함된 상위 영역이 자동으로 잡힙니다.</p> <p> - 선택 디자인 편집하기 : 하단 "소스(html)보기" 에서 [ 디자인하기 ] 버튼을 클릭하면 해당 디자인 편집 페이지로 연결됩니다.</p> <p> </p> <p> <img onLoad='miniSelfResize(contents_21,this)' width="709" height="576" src="http://guide.godo.co.kr/season4/data/editor/1381129354.jpg"></p> <p> </p> <p> </p> <p> </p>