CMS솔루션마켓, 이온디 - 워드프레스, 라이믹스, 카페24, 그누보드, 엑셀

스토어

콘텐츠 수 450

롤링 배너 위젯

  • 분류 위젯
  • 상품카테고리 위젯 
  • 상태 제품소개 
  • 소개 XE 타운 우측 하단에 보면 배너들이 움직이는 위젯 보이시죠? 그것과 비슷하게 만든 롤링배너 위젯입니다. XE타운에서 사용중인 롤링 배너 위젯은 CONORY님이 공개를 하지 않는다고 하신만큼 비슷하게 구현해 봤습니다. 
  • 설치경로 /widgets/rolling_banner 
  • 버전 0.1 
  • 라이센스 XPM 
  • 개발자 사과맛스타 
  • 구매 페이지 https://xetown.com/point_contents/539257?page=2 
XPM(재배포 금지) 라이선스는 XE타운 포인트마켓 전용 라이선스로 타사이트에서는 재배포가 금지되어있어 자료 소개 용도로 작성된 게시물입니다. 실제 다운로드는 XE타운에서 다운로드 가능합니다.
파일 이름 용량 잔여일 잔여횟수 상태 다운로드
rolling_banner_v0.1.zip 50KB - - - 다운로드

- 롤링 배너 위젯 -

 

XE 타운 우측 하단에 보면 배너들이 움직이는 위젯 보이시죠?

그것과 비슷하게 만든 롤링배너 위젯입니다. XE타운에서 사용중인 롤링 배너 위젯은 CONORY님이 공개를 하지 않는다고 하신만큼 비슷하게 구현해 봤습니다. 

 

 

 


<배너 이미지는 XE타운에 있는 배너 이미지를 무단으로 사용했습니다. 문제될 시 말씀해주세요. 삭제하겠습니다.>

 

여러 배너들을 효율적으로 보여주는데 도움이 됩니다.

제 비루한 실력으로 인해 오류들이 발생할 수 있습니다. 그리고 그 오류를 해결하는데에 상당히 긴 시간이 걸릴수도 있음을 먼저 알려드립니다.

 

 

- 특징

여러 배너 이미지를 효율적인 공간에 보여지도록 할 수 있습니다.

해당 배너를 클릭하면 지정한 사이트로 이동할 수 있습니다.

배너에 대한 제목과 설명을 추가할 수 있습니다.

보여질 배너의 수, 속도 등 상세하게 설정할 수 있습니다.

 

 

- 설정방법

 

먼저, 해당 배너들과 연결될 게시판을 하나 신설합니다.

 

 

1. 썸네일 생성 방법

크롭(crop)과 비율유지(ratio) 중에서 선택가능합니다.

 

2. 순서 섞기 :

"예"를 선택한 경우 위젯이 불러온 전체 배너 수에서 랜덤하게 표시를 합니다.

"아니오"를 선택한 경우 최근 글 부터 차례대로 보여집니다.

 

3. 마우스 오버시 스크롤 멈춤 / 이전, 다음버튼 보이기

배너의 이전, 다음 버튼을 보이게 하면 마우스를 오버해도 스크롤이 됩니다.

마우스 오버시에 스크롤이 멈추게 하면 배너의 이전, 다음 버튼이 보이지 않습니다.

 

4. 이미지 너비 / 높이

생성할 배너 이미지의 너비와 높이를 구합니다.

 

5. 한번에 보여질 배너 수

한 페이지에 보여질 배너 수를 결정합니다.

 

6. 총 배너 수

불러올 총 배너의 수를 결정합니다. 설정된 값보다 게시판에서 불러올 배너 이미지의 수가 적은 경우에는 설정된 값 만큼 다시 반복합니다.

 

예) 설정값 10 / 실제 게시글 수 7

배너가 7개는 정상적으로 보여지고 나머지 3개는 7개중 반복되어서 보여집니다.

 

7. 자동 스크롤 속도

가만히 놔두면 저절로 배너가 스크롤 되는데 몇 초후에 스크롤 될지 결정합니다. (단위 : 밀리초)

 

8. 스크롤 속도

다음 배너가 스크롤 될 때, 얼마나 빨리 스크롤 되는지 결정합니다.

 

9. 배너 상하 여백

배너의 간격을 결정합니다. 위, 아래에 동시에 적용되므로 실제 적용시 간격이 설정값에 두배가 된다고 생각해야 합니다.

 

10. 마우스 휠로 스크롤

위젯 위에 마우스를 오버한 후 마우스 휠을 돌리면 다음 배너가 보여집니다. 단, 휠을 어느방향으로 돌려도 다음 배너만 보여집니다.

 

11. 링크사용

배너를 클릭시 이동하도록 할지 결정합니다.

 

12. 링크 주소가 있는 사용자 정의 이름

게시판에서 사용자 정의로 등록할 때, 링크 주소가 쓰여질 사용자 정의 이름(첫글자 영문)을 입력하면 됩니다. 기본값은 url 입니다. 형식은 한줄 입력칸형태로 괜찮으나, http:// 나 https:// 가 들어가야 하므로 URL형식을 추천합니다.

 

13. 배너 제목 사용자 정의 이름

img 태그에 title로 사용될 이름이 들어갈 사용자 정의 이름 입니다. 기본값은 title 입니다. 형식은 한줄 입력칸 형태로 해주세요.

 

14. 배너 설명 사용자 정의 이름

img 태그에 img 태그에 title로 사용될 설명이 들어갈 사용자 정의 이름 입니다. 기본값은 desc 입니다. 형식은 한줄 입력칸 형태로 해주세요.

 

13, 14번 예제 

15. 배너 태두리 두께

숫자만 입력하세요. 단위는 px 입니다.

 

 

간편 사용방법

1. 새 게시판 하나 신설합니다.

2. 사용자 정의에서 3가지를 추가하고, 사용자 정의 이름을 다음과 같이 합니다.

url (링크 주소 사용)

title (img 태그에서 title 표시)

desc (img 태그 title에 들어갈 보조 내용)

3. 게시판에 글을 등록합니다.

    단, 배너는 각 게시글에 직접 그림 파일을 업로드 해야 정상적으로 작동합니다.

 

 

 

- 미리보기

사용 전 테스트용 미리보기 입니다. 

http://test.studyforus.com/index.php?mid=page_wIQO39

 

게시판에 별도로 이미지를 올려서 테스트 해보세요. (비회원 업로드 가능)

그리고, 미리보기 사이트는 예고없이 작동이 안될 수도 있습니다.

 

 

- 버전

V 0.1 - 초기 버전

 

옵션 검색
List of Articles
번호 분류 제목 평점 포인트
공지 상품 커스터마이징 건에 대해서
공지 이온디샵에서 개발자/디자이너 여러분의 컨텐츠를 판매하세요.
공지 포인트샵 오픈마켓입니다. 구매를 원할 경우 포인트를 충전해주세요.
20 애드온 유튜브 iframe 삽입시 사이즈 자동조절 무료
19 애드온 자동 랜덤댓글 애드온 v1.0.4 무료
18 애드온 주소줄로 받은 값을 회원가입 폼에 자동으로 입력 무료
17 위젯 프로필 위젯 무료
16 스킨 윤삼님의 프로필 위젯의 스킨 무료
15 애드온 베스트 댓글 검색 추가 애드온 판매종료 무료
14 레이아웃 [V0.1.3] 부트스트랩 기반 Gentelella 레이아웃 무료
13 애드온 최근 게시글 조회수 증가 애드온 v1.1 무료
12 위젯 사용자 배너 위젯 V0.1 50P
11 애드온 댓글 첨부파일 제한 무료
10 애드온 Nprogress 애드온 무료
9 모듈 이미지프로세스 무료
8 애드온 게시판 활동 알림 1.1.1 (텔레그램 푸쉬 알림) 무료
7 애드온 멀티팝업 + 설날팝업 디자인 무료
» 위젯 롤링 배너 위젯 100P
5 기타/플러그인 XE Migration Tool v 0.7 - UnOfficial 무료
4 애드온 XNS SNS 공유버튼 삽입 애드온 무료
3 회원상품 PMember Lite 회원모듈 스킨 무료
2 애드온 코멘트 1,2,3등 추가 포인트 애드온 v0.4 100P
1 레이아웃 게임 홈페이지 레이아웃 100P