[메뉴얼] BlueSky Layout

조회 수 1162 추천 수 0 2010.04.21 13:11:00
[레벨:17]touchmine *.187.91.115
Files
  • Layout
    • touch_BlueSky.zip (메인화면 레이아웃)
    • touch_BlueSky_sub.zip (서브화면 레이아웃)
    • widgets
      • appleBanner.zip (슬라이드 베너 위젯)
    • widget_skin
      • login_info : bsLogin.zip (로그인 스킨)
      • navigator : bsHoriNavigator.zip(네이게이션 스킨)
      • newest_comment : bsComment.zip (최근 댓글 스킨)
      • newest_document : bs_skin.zip(최근글 스킨)
      • webzine : bs_left_widget.zip , bs)notice_style.zip(공지사항)
    • BlueSkyIcons.zip (해당레이아웃을 꾸미기 위한 아이콘 세트)

      •  

       

      레이아웃을 다운 받으신후 위의 파일리스트의 내용들이 정확히 포함되어 있는지

      먼저 확인해 주시기 바랍니다

 

Setup
  1. 파일 업로드
  2. 모든 파일은 각각의 폴더에 압축을 미리 풀어놓는다
  3. ftp를 통하여 설치하고자 하는 웹 사이트에 접속을 한다.
  4. 레이아웃 업로드 : touch_BlueSky, touch_BlueSky_sub파일을 xe->layouts폴더에 업로드한다
  5. 위젯 업로드 : appleBanner위젯을 xe->widgets 폴더에 업로드 한다
  6. 위젯스킨 업로드 : 각각의 위젯의 스킨 폴더에 업로드 한다. ex) xe->wedgets->newest_document->skin 에 bs_skin 을 업로드 한다
  7. 관리자페이지 > 사이트설정 > 레이아웃 > 다운로드목록 을 보면 레이아웃이 2개가 새로 생성된 것을 확인할 수 있다.
  8. 레이아웃 설정
    • 구성선택 : 컨텐츠 화면을 왼쪽이나 오른쪽으로 배치할 수 있는 옵션
    • 배너표시 : 페이지마나 나오는 배너를 표시할 것인지의 여부
    • 배너위젯 사용 : 배너를 위젯사용 or 배너를 일반 이미지를 사용
    • 배너사용 이미지 : 배너를 이미지로 사용하게될 때 이미지를 선택
    • 공지사항 표시 : 공지사항 표시여부
    • 퀵메뉴 표시 : 퀵메뉴의 표시여부 (IE7, IE8,파이어폭스계열 에서만 작동합니다)
    • 중단네비게이션 메뉴표시 : 중단의 네비게이션 표시여부를 선택합니다
    • 로고이미지 : 상단의 로고이미지
    • 하단로고이미지 : 하단의 로고 이미지
    • 홈페이지 URL : 로고클릭시 이동할 페이지
    • 배경이미지 : 배경으로 사용될 이미지 ( 전체배경으로 사용되는 이미지이므로 신중하게 선택해주세요)
    • 사이트 너비 : 사이트의 너비
    • 위젯너비 : 위젯의 너비
    • 상단메뉴 : 최상단 표시메뉴
    • 오른쪽 상단 바로가기 메뉴 : 오른쪽 최상단 바로가기 메뉴
    • 퀵메뉴 : 퀵메뉴에 표시될 메뉴
    • 하단 메뉴 : 하단에 표시되는 메뉴
  9. 페이지 설정
    1. 관리자페이지>사이트설정>레이아웃>레이아웃설정>레이아웃편집
    2. 배너 생성 : <!--@if($layout_info->layout_banner=='yes')--> 바로 아래에 AppleStyle Banner를 생성한다
    3. 위젯이 정확하게 설치가 되어있다면 아래에 버튼으로 AppleStyle Banner라는 항목이 생성이 된다
    4. 해당 버튼을 클릭하여 원하는 배너 이미지와 아이콘을 선택하고 주소를 입력한뒤 코드 생성을 누르게 되면 <img class="zbxe 로 시작하는 코드가 생성이 되게 된다.
    5. 기존의 코드를 삭제하고 새로 생성된 코드만 남겨둔다.
    6. 공지사항 : <div id="lineNotice">와 바로 다음</div> 사이에 공지사항을 넣게 된다
    7. <div id="lineNotice"> 바로다음에 웹진 형태 최근 문서출력을 선택하여 스킨(bs_skin)을 선택하고 게시판을 선택한후 코드생성을 한다
    8. 기존의 코드를 삭제하고 새로 생성된 코드만 남겨둔다
    9. 중앙 네비게이션 : <div id="nav">와 다음 </div>사이에서 네비게이션을 넣게 된다.
    10. <div id="nav">다음에 메뉴출력기의 코드를 생성한다. bsHoriNavigator스킨을 선택하고 해당 레이아웃의 메뉴를 선택하여 코드생성을 한다
    11. 기존의 코드를 삭제하고 새로 생성된 코드만 남겨둔다
    12. 좌측위젯 : 모든 위젯내용은 <div id="wContentC">에 포함되게 된다. 해당 위치에 원하는 위젯의 코드를 생성하여 준다. 최근글, 최근 코멘트, 웹진형태 최근문서출력등에서 BlueSky전용 스킨을 사용하면 최적화된 사이트를 만들 수 있습니다

 

Layout Details
  • 레이아웃 : BlueSky
  • 제작환경 : XE Ver 1.4.0.10
  • 디자인 : Designed by Touchmind
  • 호환성 : IE6, IE7, IE8, Firefox, Opera, Chrom

 

이 게시물을...
엮인글 :
http://www.touchmind.co.kr/index.php?document_srl=1726&act=trackback&key=e16
목록
List of Articles
번호 제목 글쓴이 날짜 조회 수
» [메뉴얼] BlueSky Layout [레벨:17]touchmine 2010-04-21 1162
목록
쓰기
XE Login