공지사항

최근본상품
TOP
DOWN

공지사항

게시판 목록에 무한스크롤 테마 패치

2015.06.23 15:13 2,094 1

본문

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;
}

- 이윰넷 - 회원등급 : 최고관리자
포인트 0
경험치 118,331
[레벨 34] - 진행률 91%
- 가입일 : 2014-10-12 14:04:12
- 서명 : 미입력
- 자기소개 : 미입력

댓글목록 1

미스코리아님의 댓글

확인.

축하합니다. 첫댓글 포인트 21포인트를 획득하였습니다.

전체 148 건 - 7 페이지
제목
이윰넷 2015.07.21 1,450
이윰넷 2015.07.13 1,286
이윰넷 2015.07.09 1,589
이윰넷 2015.07.08 1,632
이윰넷 2015.07.07 1,411
이윰넷 2015.07.06 1,150
이윰넷 2015.06.26 1,477
이윰넷 2015.06.25 1,201
이윰넷 2015.06.23 2,095
이윰넷 2015.06.22 1,142
이윰넷 2015.06.18 1,422
이윰넷 2015.06.12 1,224
이윰넷 2015.06.11 1,289
이윰넷 2015.06.08 2,242
이윰넷 2015.06.08 1,574