게시판 갤러리 스킨(skin/board/gallery)이나 
최신글 갤러리 스킨(skin/latest/pic_block)에서 
업로드한 이미지가 없을 때 
wr_content의 외부이미지를 찾아보고 출력해주는 방법입니다.

실제로 썸네일을 만들지는 않고

사이즈만 줄여서 보여주는 것이라 

용량이 큰 외부이미지는 로딩에 영향이 있을 수 있습니다. 

소스는 현재 최신 버전인 5.4.5.1과 테마 파일을 기준으로 하겠습니다.

----------

먼저, 5.4.2.9에서 추가된 HOOK을 이용하는 방법입니다.
https://github.com/gnuboard/gnuboard5/commit/2f9bb483424db9dfc8ad4a2e565d17941ca3f613

extend 폴더에 적당한 파일을 하나 생성한 후 코드를 작성합니다. 
예) extend/user.extend.thumb.php

[code]
<?php
if (!defined('_GNUBOARD_')) exit; // 개별 페이지 접근 불가

add_replace('thumb_image_tag', '_thumb_image_tag', 10, 5);
function _thumb_image_tag($img_content, $thumb, $wr_content='') {
    // fallback
    $return = $img_content;

    // 썸네일이 없을 때 외부이미지가 있으면 출력합니다
    if ((!isset($thumb['src']) || empty($thumb['src'])) && !empty($wr_content)) {
        if ( $matches = get_editor_image($wr_content, false) ){
            $k = count($matches[1]) - 1 < 1 ? 0 : mt_rand(0, count($matches[1]) - 1);
            if (isset($matches[1][$k])) {
                $return = '<span style="display: block; overflow: hidden; background: url('.$matches[1][$k].') center center no-repeat; background-size: cover;"><span style="display: block; visibility: hidden;">'.$img_content.'</span></span>';
            }
        }
    }

    return $return;
}
[/code]

여기까지만 하면 HOOK은 작동하나 
실제로는 아무것도 하지 않기 때문에 변함이 없습니다. 
thumb_image_tag HOOK에는 인자가 2개 있는데요. 
wr_content에서 외부이미지를 찾아야하므로 인수를 추가해줘야 합니다. 

1. 게시판 갤러리 스킨
https://github.com/gnuboard/gnuboard5/blob/5.4.5.1/theme/basic/skin/board/gallery/list.skin.php#L124

[code]
// 원래 코드
echo run_replace('thumb_image_tag', $img_content, $thumb);
// 인수 추가 $list[$i]['wr_content']
echo run_replace('thumb_image_tag', $img_content, $thumb, $list[$i]['wr_content']);
[/code]

2. 최신글 갤러리 스킨
https://github.com/gnuboard/gnuboard5/blob/5.4.5.1/theme/basic/skin/latest/pic_block/latest.skin.php#L29

[code]
// 원래 코드
<?php echo run_replace('thumb_image_tag', $img_content, $thumb); ?>
// 인수 추가 $list[$i]['wr_content']
<?php echo run_replace('thumb_image_tag', $img_content, $thumb, $list[$i]['wr_content']); ?>
[/code]

----------

두번째로, 스킨에서 처리하는 방법입니다.
(extend 폴더에 따로 파일을 작성하지 않습니다!!!)

1. 게시판 갤러리 스킨
https://github.com/gnuboard/gnuboard5/blob/master/theme/basic/skin/board/gallery/list.skin.php#L124
$img_content 를 출력하는 바로 위쪽에 삽입합니다. 

[code]
// 내부 이미지 파일이 없을 때 외부 이미지가 있으면 출력합니다
if (!isset($thumb['src']) || empty($thumb['src'])) {
    if ( $matches = get_editor_image($list[$i]['wr_content'], false) ){
        $k = count($matches[1]) - 1 < 1 ? 0 : mt_rand(0, count($matches[1]) - 1);
        if (isset($matches[1][$k])) {
            // NO_IMAGE로 사이즈를 설정할 때
            $img_content = '<span style="display: block; overflow: hidden; background: url('.$matches[1][$k].') center center no-repeat; background-size: cover;"><span style="display: block; visibility: hidden;">'.$img_content.'</span>';
            // 썸네일 width/height 비율로 사이즈를 설정할 때
            //$img_content = '<span style="display: block; overflow: hidden; width: 100%; padding-top: '.(round(($board['bo_gallery_height'] / $board['bo_gallery_width']) * 100, 2)).'%; background: url('.$matches[1][$k].') center center no-repeat; background-size: cover;"></span>';
        }
    }
}

echo run_replace('thumb_image_tag', $img_content, $thumb);
[/code]

2. 최신글 갤러리 스킨 
https://github.com/gnuboard/gnuboard5/blob/5.4.5.1/theme/basic/skin/latest/pic_block/latest.skin.php#L25
$img_content 변수 할당 다음에 코드를 삽입합니다.

[code]
$img_content = '<img src="'.$img.'" alt="'.$thumb['alt'].'" >';
// 내부 이미지 파일이 없을 때 외부 이미지가 있으면 출력합니다
if (!isset($thumb['src']) || empty($thumb['src'])) {
    if ( $matches = get_editor_image($list[$i]['wr_content'], false) ){
        $k = count($matches[1]) - 1 < 1 ? 0 : mt_rand(0, count($matches[1]) - 1);
        if (isset($matches[1][$k])) {
            // NO_IMAGE로 사이즈를 설정할 때
            $img_content = '<span style="display: block; overflow: hidden; background: url('.$matches[1][$k].') center center no-repeat; background-size: cover;"><span style="display: block; visibility: hidden;">'.$img_content.'</span></span>';
            // 썸네일 width/height 비율로 사이즈를 설정할 때
            //$img_content = '<span style="display: block; overflow: hidden; width: 100%; padding-top: '.(round(($thumb_height / $thumb_width) * 100, 2)).'%; background: url('.$matches[1][$k].') center center no-repeat; background-size: cover;"></span>';
        }
    }
}
[/code]
 

(게시판에 사용된 이미지는 네이버뉴스 기사 이미지)

게시판

최신글