badge

매뉴얼  -  Manual 매뉴얼 위키가 제작되기 이전에 만들어진 스킨에 대한 기존 매뉴얼 게시판입니다.

15 Apr, 2009

PXE Dynamic Slide Layout

judgeWTA 조회 수 24215 추천 수 0 목록
headline_feature.gif

PXE Dynamic Slide는 Jquery 플러그인을 사용하여 다단으로 구성된 컨텐츠를 수평으로 슬라이딩 시키는 다이나믹한 레이아웃 입니다. 이 레이아웃은 초기 WTA 사이트에 사용되었으며 Metalic Glossary라는 이름의 프로토타입 레이아웃으로 무료 배포 했었던 레이아웃입니다. Metalic Glossary는 XE 1.2 버전에서 작동이 되지 않아 새로 PXE Dynamic Slide라는 프리미엄 레이아웃으로 재구성되어 배포하게 되었습니다.

이 레이아웃이 온라인에서 어떻게 구동하는지 살펴보려면 여기를 클릭하세요
  • 다단 구성된 컨텐츠부를 원할때마다 토글시켜 확장시키거나 축소 시킬 수 있어 방문자들의 주위환기에 크게 기여합니다
  • 게시판과 같이 넓은 단이 필요한 경우에는 컬러셋 기능을 이용하여 자동 펼치기 기능을 사용 할 수 있습니다
  • 회색의 WTA 스타일과 검은색의 PXE 스타일 두가지의 레이아웃이 하나의 패키지에 포함되어 있습니다
  • 3차 메뉴까지 메인메뉴에서 드롭다운으로 구성 할 수 있습니다




headline_colorset.gif

PXE Dynamic Slide 레이아웃은 연회색과 흑백색 글로시 스타일의 두가지 레이아웃으로 구성되어 있습니다. 각 레이아웃은 컬러셋에서 선택하지 않고 별도의 레이아웃 폴더로 구성되어 있으며, 각 레이아웃은 컬러셋에서 단 자동 펼침 기능을 사용할 수 있습니다. 또한 연회색의 기본 레이아웃과 흑백색 글로시 스타일의 확장 레이아웃은 서로 다른 메뉴 구성을 사용하고 있으므로 기호에 맞는 방식을 선택할 수 있습니다.




headline_install.gif

압축을 풀면 Source 폴더를 비롯해서 레이아웃, 위젯 폴더등이 나타납니다. Source 폴더를 제외한 나머지 폴더를 XE가 설치 된 폴더에 덮어씌우기 합니다. 그러면 레이아웃과 위젯들이 자리에 맞게 찾아가 복사가 됩니다

최근 댓글 위젯, 최근 게시물 위젯, 블로그 스타일 위젯 3가지는 premiumxe.com에서 사용 된 위젯들이므로 참고하셔서 사용하시기 바랍니다

XE 관리자 페이지로 접속하여 사이트 설정 > 레이아웃에서 생성 버튼을 눌러 PXE 다이나믹 슬라이드 레이아웃PXE 다이나믹 슬라이드 글로시가 있는지 확인합니다





headline_setting.gif

1. Jquery 플러그인 활성화 시키기
PXE Dynamic Slide 레이아웃은 슬라이딩 기능을 비롯해 웹 접근성등 위해 여러부분에서 Jquery 플러그인을 사용합니다. 특수효과, 슬라이딩시의 매끄러움 효과, 단 구성을 위한 자동 높이 조절등이 여기에 속합니다. 따라서 이러한 기능을 활성화 시키기 위해 관리자 페이지에 접속하여 몇줄의 활성화 코드를 넣어줘야 합니다. 관리자 페이지 접속 > 사이트 설정 > 레이아웃으로 이동하여 자신이 사용 할 PXE Dynamic Slide 레이아웃을 클릭하여 설정 화면으로 들어갑니다. 아래 그림과 같이 헤더 스크립트라는 공란이 있습니다

header.gif

이 공란에 아래의 코드를 추가하여 줍니다. 이 코드가 추가되면 해당 레이아웃에서는 Jquery 플러그인이 작동하게 됩니다. 이 코드들은 layout.html에 포함시킬 수도 있었으나 그 경우 XE의 Jquery 코드 처리에 자잘한 버그들이 발생하여 헤더 스크립트에 추가하게 되었습니다. 아래의 코드를 헤더 스크립트란에 넣어줍니다

<script type='text/javascript' src='./common/js/jquery.js'></script>
<script type='text/javascript' src='./layouts/PXE_dynamic_slide_glossy/js/jquery.easing.js'></script>
<script type='text/javascript' src='./layouts/PXE_dynamic_slide_glossy/js/page-scroller.js'></script>
<script type='text/javascript' src='./layouts/PXE_dynamic_slide_glossy/packages/pxe_droppy_menu/jquery.droppy.js'></script>


2. 컬러셋과 구성 선택하기

PXE Dynamic Slide 레이아웃을 하나의 레이아웃에서 컬러셋을 통해 연회색과 흑백색을 선택 할 수 있으면 좋겠지만 실상은 그렇지 못합니다. 이 레이아웃은 컬러셋 기능을 통해 색상이 아닌 단 구성 자체를 선택하게 합니다. 물론 하나의 레이아웃에서 단 구성과 컬러 두가지 모두를 통제하게 할 수도 있지만 그렇게 되면 layout.html 파일의 코드가 무척 복잡해져서 실제로 커스터마이징 하는 유저들의 입장에서 무척 피곤하리라 생각했습니다

따라서 각 레이아웃을 색상별로 두개의 레이아웃으로 분리시켰으며 각 레이아웃은 컬러셋을 통해 단 구성을 선택하게 됩니다. 아래 이미지에서와 같이 기본을 선택하게 되면 레이아웃은 3개의 단을 거의 동일한 크기로 나눕니다. 본문부 자동 넓히기를 선택하게 되면 페이지가 열릴 때 가장 왼쪽단이 자동으로 넓어지게 됩니다. 따라서 게시판이나 갤러리와 같이 본문부가 큰 페이지의 경우 본문부 자동 넓히기를 선택하면 좋습니다

colorset.gif





headline_alert.gif
  • 이 레이아웃은 XE의 모든 버전에서 작동합니다
  • 이 레이아웃은 IE6/7, 가장 최신의 FireFox, Opera에서 테스트 되었습니다. 하지만 IE6에서는 Form에 관련된 몇가지 요소들이 다단 레이어를 뚫고 올라오는 현상이 있으므로 실질적으로 IE6는 대응하지 않는 것으로 합니다
  • 윈도용, 맥용 Safari에서는 min-height CSS값이 해석되지 않으므로 하단부가 잘리는 현상이 있으므로 사실상 대응하지 않는 것으로 합니다
  • 최근 댓글등의 위젯에서 URL을 타고 들어간 경우에는 DIV단의 슬라이딩 기능을 사용 할 수 없습니다. 이 부분은 현재 수정중에 있습니다




headline_buy.gif

  • 비영리 라이센스 : 40,000원
  • 영리 라이센스 : 150,000원
라이센스 구입을 원하시는 분께서는 아래의 계좌로 비용을 입금 하신 후, clubnb2@naver.com으로 입금확인 메일을 보내주세요. 메일에는 본인 아이디, 입금자명, 스킨명, 라이센스 형태 4가지를 꼭 기재해 주셔야 합니다. 비용 지불이 확인되면 다음날 오후 5시 이전 아이디가 갱신되어 본 사이트의 [다운로드] 코너에서 해당 스킨의 온라인 다운로드가 가능하게 됩니다.

PayPal을 이용해 결제를 원하시는 해외 이용자분께서는 위의 4가지 항목에 추가로 자신의 PayPal 이메일 주소를 함께 기입하시면 Request Money로 청구메일이 가게 됩니다. 입금이 확인되면 마찬가지로 다음날 오후 5시 이전 아이디가 갱신되어 본 사이트의 [다운로드] 코너에서 해당 스킨의 온라인 다운로드가 가능하게 됩니다.

위 이메일 주소로는 일체 문의내용을 받지 않습니다. 별도의 문의사항이 있으신 경우에는 문의사항 코너를 이용해 주시기 바랍니다.

 국민은행 036102-04-168370 정현화

profile

찬영이

June 24, 2009

입금했습니다.
발송해 주세요~~
profile

청화지기

July 23, 2009

입금했어요 발송해주세요~
profile

딸꾹이

August 15, 2009

저두용... ^^*
profile

YO-DA

August 21, 2009

입금 완료 후 글 쓰다...
발송... 언젠가 되겠죠^^
profile

월배

September 03, 2009

board pro2 하고 함께 구매... 입금완료 하고 메일 보냈습니다.
발송해주세요
profile

후아

October 28, 2009

입금했어요 발송 부탁드려요 ^^
List of Articles
PXE Dynamic Slide Layout [6] judgeWTA 2009-04-15 24215
PXE Member Pro [6] judgePremiumXE 2009-04-07 266892
PXE Board Pro [8] judgeWTA 2009-03-23 21855
PXE Candy Shop [44] judgePremiumXE 2009-03-23 26193
PXE Gallery Widget [4] judge정현화 2009-03-22 16156
PXE Broadband Browser 기본 메뉴얼 judgeWTA 2008-12-14 9126
PXE Snow Plate [32] judgePremiumXE 2008-12-13 24419
WTA Blog Style Recent Entry [3] judgeWTA 2008-11-17 11964
WTA Archive Skin judgeWTA 2008-10-25 11757
WTA Mini Blog [5] judgeWTA 2008-10-25 12744