[이윰] 전체검색 리스트 페이지에서 동영상 썸네일 이미지도 사용하기

페이지 정보

yadolee 루루아빠 2,928 2018.05.04 02:52:37

본문

전체검색 리스트 페이지에서 동영상 썸네일 이미지도 사용하기
이윰빌더 1.3.10 패치로 전체검색 리스트 페이지에서 썸네일 이미지 사용하기 기능이 추가되었으며 동영상 썸네일 이미지도 사용하도록 하자.

1. 그누보드5/eyoom/core/search/search.skin.php를 열어 이미지 사용일 경우를 검색한다.

수정 전{code:php}
        
        if($eyoom['use_search_image'] == 'y') {
            unset($data['img_content'], $data['img_src']);
            $thumb = get_list_thumbnail($loop1[$idx]['bo_table'], $list[$idx][$i]['wr_id'],$eyoom['search_image_width'], $eyoom['search_image_height']);
            if($tpl_name == 'bs') {
                if($thumb['src']) {
                    $data['img_content'] = '<img class="img-responsive" src="'.$thumb['src'].'" alt="'.$thumb['alt'].'">';
                    $data['img_src'] = $thumb['src'];
                }
            } else {
                if($thumb['src']) {
                    $data['img_content'] = '<img src="'.$thumb['src'].'" alt="'.$thumb['alt'].'" width="'.$board['bo_gallery_width'].'" height="'.$board['bo_gallery_height'].'">';
                    $data['img_src'] = $thumb['src'];
                }
            }
        }
        
        $loop2[$i] = $data;
    }
{/code}수정 후{code:php}
        
        if($eyoom['use_search_image'] == 'y') {
            unset($data['img_content'], $data['img_src']);
            $thumb = get_list_thumbnail($loop1[$idx]['bo_table'], $list[$idx][$i]['wr_id'],$eyoom['search_image_width'], $eyoom['search_image_height']);
            if($tpl_name == 'bs') {
                if($thumb['src']) {
                    $data['img_content'] = '<img class="img-responsive" src="'.$thumb['src'].'" alt="'.$thumb['alt'].'">';
                    $data['img_src'] = $thumb['src'];
                }
            } else {
                if($thumb['src']) {
                    $data['img_content'] = '<img src="'.$thumb['src'].'" alt="'.$thumb['alt'].'" width="'.$board['bo_gallery_width'].'" height="'.$board['bo_gallery_height'].'">';
                    $data['img_src'] = $thumb['src'];
                }
            }

            $wr_4 = unserialize($list[$idx][$i]['wr_4']);        //추가 시작 - 외부동영상도 썸네일 표시
            if(!$wr_4) $wr_4 = array();

            if($list[$idx][$i]['wr_4'] && !$thumb['src']) {
                $thumb['src'] = $wr_4['thumb_src'];
                if($thumb['src']) {
                    if($tpl_name == 'bs') {
                        if($thumb['src']) {
                            $data['img_content'] = '<img class="img-responsive" src="'.$thumb['src'].'">';
                            $data['img_src'] = $thumb['src'];
                        } else {
                            $data['img_content'] = '<span style="width:100%;">no image</span>';
                        }
                    } else {
                        if($thumb['src']) {
                            $data['img_content'] = '<img src="'.$thumb['src'].'" alt="'.$thumb['alt'].'" width="'.$board['bo_gallery_width'].'" height="'.$board['bo_gallery_height'].'">';
                            $data['img_src'] = $thumb['src'];
                        } else {
                            $data['img_content'] = '<span style="width:'.$board['bo_gallery_width'].'px;height:'.$board['bo_gallery_height'].'px">no image</span>';
                        }
                    }
                }
            }
            // 게시물에 동영상이 있는지 결정
            $data['is_video'] = $wr_4['is_video'];        //추가 끝

        }

        $loop2[$i] = $data;
    }
{/code}
2. 그누보드5/eyoom/설치된 테마/skin_bs/search/basic/search.skin.html을 열어 <!--{? ..img_content}-->를 검색하여 다음과 같이 수정한다.
수정 전{code:php}
                    <!--{? ..img_content}-->
                    <div class="result-list-image">
                        <a class="search-result-image">
                            {..img_content}
                        </a>
                    </div>
                    <!--{/}-->
{/code}수정 후{code:php}
                    <!--{? ..img_content}-->
                    <div class="result-list-image">
                        <!--{? ..is_video}--><span class="video-icon"><i class="far fa-play-circle"></i></span><!--{/}-->        <!-- 동영상 폰트어썸 표시 -->
                        <div class="search-result-image">
                            {..img_content}
                        </div>
                    </div>
                    <!--{/}-->
{/code}동영상 아이콘(폰트어썸)을 위해 상단 스타일 정의 .search-result-list .result-list .result-list-image 아래에 다음과 같은 스타일을 적용한다.
{code:css}
.search-result-list .result-list .video-icon{position:absolute;top:5px;left:5px;color:#fff;font-size:15px;line-height:15px;z-index:1}
{/code}
추천인
  • 추천해 주세요
yadolee
6
루루아빠 - 회원등급 : 최고관리자 - 포인트 : 1,352,689
레벨 101
경험치 1,535,152

Progress Bar 66.51%

- 가입일 : 2015-03-04 03:24:54
- 서명 : KNOW YOUR LIMITS BUT NEVER STOP TRYING TO EXCEED THEM !!
- 자기소개 : 루루의 자랑 루루아빠랍니다~~

댓글

첫 번째 댓글을 남겨 주세요

Total 7691126 페이지

제목 글쓴이 날짜 조회 추천
그누•영카트  🏆 영카트 5.1.12 패치 루루아빠 2016.01.31 3.3k 0
그누•영카트  🏆 Re: 첨부된 이미지 링크 없애기 루루아빠 2015.04.07 3.4k 0
그누•영카트  🏆 익스11에서 사운드클라우드와 Jwplayer가 올바르게 재생되지 않을 때 루루아빠 2016.02.02 3.1k 0
그누•영카트  🏆 Re: Re: 첨부된 이미지 링크 없애기 루루아빠 2015.04.07 3.5k 0
jQuery  댓글+2🏆 사이드바를 고정하기 위한 Theia Sticky Sidebar 소개 및 적용법 루루아빠 2016.02.10 4.0k 0
그누•영카트  🏆 그누보드 5.3.2.6 shadow2fox 2019.02.15 2.5k 0
기타  🏆 내용이 포함된 box의 넓이와 높이 조정하는 법 루루아빠 2015.04.08 3.7k 0
그누•영카트  🏆 영카트 5.3.2.6 shadow2fox 2019.02.15 2.3k 0
이윰  댓글+1🏆 이윰 메뉴 설정에서 출력 순서로 인한 오류 발생시 루루아빠 2015.04.09 4.1k 0
이윰  🏆 Eyoom Builder 1.2.1 패치 루루아빠 2016.02.15 4.9k 0
그누•영카트  🏆 그누보드 5.3.2.7 shadow2fox 2019.03.05 2.1k 0
CSS  🏆 gifplayer 플레이시 gifplayer-wrapper 아래 모든 div가 아래로 밀리는 현상 해결하기 루루아빠 2016.02.16 3.3k 0
그누•영카트  🏆 영카트 5.3.2.7 shadow2fox 2019.03.05 2.3k 0
기타  🏆 "syntaxhighlighter"로 적힌 소스 쉽게 복사하기 루루아빠 2015.04.09 3.6k 0
이윰  🏆 블로그 스킨(blog skin) 갤러리 목록에서 box 이미지 높이 줄이기 루루아빠 2016.02.17 3.0k 0
이윰  🏆 게시판 basic 스킨 목록 보기에서 가운데로 정렬하기 루루아빠 2015.04.10 3.6k 0
이윰  🏆 Eyoom Builder 1.2.2 패치 루루아빠 2016.02.18 3.5k 0
기타  댓글+3🏆 아이프레임에 포함된 플래쉬(White flash방지) 로딩 완벽 해결법 루루아빠 2015.04.11 4.0k 0
그누•영카트  🏆 그누보드 5.1.13 패치 루루아빠 2016.02.24 3.0k 0
그누•영카트  🏆 그누보드(영카트) 5.4.7 shadow2fox 2021.06.18 2.4k 0
그누•영카트  🏆 영카트 5.1.13 패치 루루아빠 2016.02.24 4.5k 0
그누•영카트  🏆 그누보드(영카트) 5.4.8 shadow2fox 2021.06.18 1.4k 0
그누•영카트  🏆 썸네일 화질 설정법 루루아빠 2015.04.11 3.5k 0
이윰  🏆 최신글 카테고리 추출 옵션 루루아빠 2016.02.25 2.9k 0
에디터  🏆 smarteditor2를 이용하여 이미지 업로드시 이미지 위에 타이틀 팝업창 없애기 루루아빠 2015.04.11 3.9k 0
서버  🏆 config.php 관련 nginx 403 에러 - 사용 권한 없음: 액세스가 거부되었습니다. 루루아빠 2016.02.25 4.0k 0
에디터  댓글+1🏆 smarteditor2 사진 첨부시 절대경로를 상대경로로 변경하기 루루아빠 2015.04.18 4.9k 0
이윰  🏆 이윰빌더 태그 입력시 작은 따옴표(apostrophe)가 포함되면 삭제 안되는 문제 루루아빠 2016.02.26 3.4k 0
이윰  댓글+2🏆 게시판 카테고리 탭 형식으로 만들기 루루아빠 2015.04.21 3.8k 0
이윰  🏆 부트스트랩(bootstrap)의 반응형 테이블(table-responsive) 사용시 모바일에서 나타나는 border 없애기 루루아빠 2016.03.04 4.1k 0