게시판 목록에 무한스크롤 테마 패치
짧은주소
- - 짧은주소: http://v2.eyoom.net/bbs/?t=1iF 주소복사
본문
0624 12:48 추가사항
커뮤니티, 샵커뮤니티, 다이나믹테마 /skin_bs/board/보드명/write.skin.html 파일에서 > 가 빠진 부분이 있습니다.
수정전
<input type="hidden" name="wmode" id="wmode" value="{_wmode}" {_option_hidden} <div class="tbl_frm01 tbl_wrap">
수정후
<input type="hidden" name="wmode" id="wmode" value="{_wmode}"> {_option_hidden} <div class="tbl_frm01 tbl_wrap">
6월 24일 12시 50분 전에 해당 테마를 다운 및 패치하신 분들은 해당 테마를 수정하여 업로드를 했으니
다시 다운 받으셔서 패치 하시거나 직접수정 해 주시면 되겠습니다.
게시판 목록에 무한스크롤을 사용할 경우, modal 창으로 view페이지를 볼 수 있도록 기능 개선 됐습니다.
마이패치 및 테마 파일을 다운 받으셔서 패치해 주시거나 아래의 내용을 참고해 패치를 해 주신 후
관리자 - 이윰설정 - 게시판설정 - 상세설정 - 목록에서 무한스크롤 사용 체크 유뮤에 따라 사용 가능합니다.
샘플사이트(http://theme.eyoom.net/)에서 무한스크롤이 적용된 게시판을 확인하실 수 있습니다.
수정 내용은 아래와 같습니다.
1. 대상파일 : /eyoom/테마명/layout/head_bs(pc/mo).html
1) 소스추가
수정 후
add_stylesheet('<link rel="stylesheet" href="../css/custom.css" type="text/css" media="screen">',0); ?> <!--{? !_wmode }-->
2) 소스추가 - 맨 하단
수정 후
<!--{:}--> <div class="basic-bs-main col-md-12"> <!--{/}--> <!--{/}-->
커뮤니티, 샵커뮤니티, 다이나믹테마 추가 부분
상단 수정후
add_stylesheet('<link rel="stylesheet" href="../css/basic_bs.css" type="text/css" media="screen">',0); add_stylesheet('<link rel="stylesheet" href="../css/custom.css" type="text/css" media="screen">',0); if(!(defined('_WMODE_') && _WMODE_)) { add_stylesheet('<link rel="stylesheet" href="../css/colors/default.css" type="text/css" media="screen" id="eb_theme_color">',0); } ?> <!--[if lt IE 9]>
2. 대상파일 : /eyoom/테마명/layout/tail_bs(pc/mo).html
1) 소스추가
수정 후
<?php if (!defined('_GNUBOARD_')) exit; // 개별 페이지 접근 불가 ?> <!--{? !_wmode }-->
2) 소스추가
수정 후
</div> <!--{* End Footer *}--> </div> <!--{* wrapper *}--> <!--{/}-->
커뮤니티, 샵커뮤니티, 다이나믹테마 추가 부분
<!--{? !_wmode}--> jQuery(document).ready(function ($) { "use strict"; $('.contentHolder').perfectScrollbar(); }); ... 생략... function switcher_hide() { jQuery('.eb-switcher').hide(); } <!--{/}--> </script>
3. 대상파일 : /eyoom/테마명/skin_bs(pc/mo)/board/스킨명/list.skin.html
1) 소스수정
모든 a태그의 href="{.href}" 코드를 변경해야 함.
href="{.href}" {? wmode}onclick="eb_modal(this.href); return false;"{/}
2) 모달 코드 추가
수정 후
</div> <!--{? wmode }--> <div class="modal fade view-iframe-modal" tabindex="-1" role="dialog" aria-labelledby="boardlistModalLabel" aria-hidden="true"> <div class="modal-dialog modal-lg"> <div class="modal-content"> <div class="modal-header"> <button aria-hidden="true" data-dismiss="modal" class="close" type="button">×</button> <h4 id="myLargeModalLabel" class="modal-title"><strong><i class="fa fa-search"></i> View Details</strong></h4> </div> <div class="modal-body"> <iframe id="view-iframe" width="100%" frameborder="0"></iframe> </div> <div class="modal-footer"> <button data-dismiss="modal" class="btn-e btn-e-dark" type="button">닫기</button> </div> </div> </div> </div> <!--{/}--> <!--{* End Modal *}-->
3) 페이지 버튼 소스 수정
수정 후
<!--{* 페이지 버튼 *}--> <!--{? eyoom_board.bo_use_infinite_scroll != '1'}--> {=eb_paging('basic')} <!--{:}--> <div id="infinite_pagination"> <a class="next" href="{C.G5_BBS_URL}/board.php?bo_table={_bo_table}&page={page+1}"></a> </div> <!--{/}--> <div class="margin-bottom-30"></div>
4) 모달 자바스크립트 수정 - 웹진을 예로 든 것이며 갤러리와 블로그는 해당 소스를 참고 바랍니다.
수정 후
</style> <!--{? wmode }--> <script type="text/javascript" src="../../../plugins/masonry/jquery.masonry.min.js"></script> <script type="text/javascript" src="../../../plugins/infinite-scroll/jquery.infinitescroll.min.js"></script> <script> function eb_modal(href) { $('.view-iframe-modal').modal('show').on('hidden.bs.modal', function () { $("#view-iframe").attr("src", ""); }); $('.view-iframe-modal').modal('show').on('shown.bs.modal', function () { $("#view-iframe").attr("src", href); $('#view-iframe').height(parseInt($(window).height() * 0.7)); }); return false; } $(document).ready(function () { $(window).resize(function () { $('#view-iframe').height(parseInt($(window).height() * 0.7)); }); window.closeModal = function(wr_id){ $('.view-iframe-modal').modal('hide'); if(wr_id) { var w_id = wr_id.split('|'); for(var i=0;i<w_id.length;i++) { $("#list-item-"+w_id[i]).hide(); } } }; }); $(document).ready(function(){ var $container = $('.webzine-boxes'); $container.infinitescroll({ navSelector : "#infinite_pagination", nextSelector : "#infinite_pagination .next", itemSelector : ".webzine-boxes-in", loading: { finishedMsg: 'END', img: '../../../image/loading.gif' } }, function( newElements ) { var $newElems = $( newElements ).css({ opacity: 1 }); $newElems.imagesLoaded(function(){ $newElems.animate({ opacity: 1 }); $container.masonry( 'appended', $newElems, true ); }); }); }); </script> <!--{/}--> <!--{?_is_checkbox}--> <script>
5) id="list-item-{.wr_id}" 추가
<!--{@ list}--> <!--{? .is_notice}--> ... <!--{:}--> <div id="list-item-{.wr_id}" ...>
4. 대상파일 : /eyoom/테마명/skin_bs(pc/mo)/board/스킨명/view.skin.html
1) 소스수정
수정 후
<!--{? _search_href}--><li><a href="{_search_href}" class="btn btn-default" type="button">검색</a></li><!--{/}--> <li><a href="{_list_href}" {? _wmode}onclick="close_modal();return false;"{/} class="btn btn-default" type="button">목록</a></li> <!--{? _reply_href}--><li><a href="{_reply_href}" class="btn btn-default" type="button">답변</a></li><!--{/}-->
2) 소스추가
수정 후
<!--{/}--> function close_modal(wr_id) { window.parent.closeModal(wr_id); } function board_move(href) { window.open(href, "boardmove", "left=50, top=50, width=500, height=550, scrollbars=1"); } </script>
5. 대상파일 : /eyoom/테마명/skin_bs(pc/mo)/board/스킨명/view_comment.skin.html
1) 소스수정
수정 후
<input type="hidden" name="wr_1" value="{_wr_1}"> <input type="hidden" name="cmt_amt" value="{_cmt_amt}"> <input type="hidden" name="wmode" value="{_wmode}"> <header><i class="fa fa-pencil"></i> 댓글쓰기</header>
6. 대상파일 : /eyoom/테마명/skin_bs(pc/mo)/board/스킨명/write.skin.html
1) 소스수정
수정 후
<input type="hidden" name="wr_1" id="wr_1" value="{_wr_1}"> <input type="hidden" name="wmode" id="wmode" value="{_wmode}"> {_option_hidden} <div class="tbl_frm01 tbl_wrap">
<div class="text-center"> <input type="submit" value="작성완료" id="btn_submit" accesskey="s" class="btn-e"> <a href="{? _wmode}javascript:history.go(-1){:}./board.php?bo_table={_bo_table}{/}" class="btn-e btn-e-dark">취소</a> </div> </form>
7. 대상파일 : /eyoom/테마명/skin_bs(pc/mo)/board/스킨명/move.skin.html
1) 소스수정
수정 후
<input type="hidden" name="act" value="{_act}"> <input type="hidden" name="url" value="{_SERVER.HTTP_REFERER}"> <input type="hidden" name="wmode" value="{_wmode}"> <div class="headline"><h4><i class="fa fa-copy"></i> {g5.title}</h4></div>
8. 대상파일 : /eyoom/테마명/css/common.css
1) 소스수정 - body태그에 overflow-x: hidden; 추가
body { color: #333; font-size: 13px; line-height: 1.6; overflow-x: hidden; }
좋아요!
번호 | 제목 | 글쓴이 | 날짜 | 뷰 | 추천 |
---|---|---|---|---|---|
133 | 이윰넷 | 2017.07.17 | 2,246 | 2 | |
132 | 이윰넷 | 2017.07.07 | 10,165 | 0 | |
131 | 이윰넷 | 2017.03.14 | 9,372 | 0 | |
130 | 이윰넷 | 2017.01.12 | 8,715 | 0 | |
129 | 이윰넷 | 2017.01.02 | 9,102 | 0 | |
128 | 이윰넷 | 2016.11.22 | 2,650 | 0 | |
127 | 이윰넷 | 2016.09.05 | 8,680 | 1 | |
126 | 이윰넷 | 2016.09.02 | 8,880 | 0 | |
125 | 이윰넷 | 2016.08.26 | 8,805 | 0 | |
124 | 이윰넷 | 2016.08.02 | 8,868 | 0 | |
123 | 이윰넷 | 2016.06.20 | 10,534 | 1 | |
122 | 이윰넷 | 2016.06.20 | 3,040 | 2 | |
121 | 이윰넷 | 2016.06.15 | 8,504 | 0 | |
120 | 이윰넷 | 2016.06.13 | 1,999 | 2 | |
119 | 이윰넷 | 2016.06.13 | 8,136 | 2 | |
118 | 이윰넷 | 2016.04.08 | 8,426 | 0 | |
117 | 이윰넷 | 2016.03.30 | 9,568 | 0 | |
116 | 이윰넷 | 2016.03.29 | 8,319 | 0 | |
115 | 이윰넷 | 2016.03.24 | 11,743 | 0 | |
114 | 이윰넷 | 2016.03.22 | 2,641 | 0 |
댓글목록
등록된 댓글이 없습니다.