썸네일 이미지 출력할 때 여백 없이 사용하기 - 그누보드팁

본문 바로가기
전체검색

그누보드팁

그누보드, 영카트 초보 제작자분들을 위한 다양한 스킨 제작 활용 팁을 공유합니다.

썸네일 이미지 출력할 때 여백 없이 사용하기

관리자 18-05-07 00:43

cd810ee165ff66db8e5d3e17fcc4025f_1525620246_3103.jpg

갤러리형 게시판이나 최신글 스킨 중 위 화면처럼 이미지에 여백이 있는 것들이 있습니다.
원본 비율을 유지하면서 잘리는 부분 없이 출력하고 싶을 때 주로 사용합니다.


cd810ee165ff66db8e5d3e17fcc4025f_1525620353_3074.jpg

이미지 일부가 잘리더라도 여백 없이 꽉 차게 출력하는 방법을 살펴보겠습니다.


여백이 있는 스킨들은 썸네일 생성 함수를 살펴보면 크롭 설정이 false로 되어 있을 겁니다.
lib/thumbnail.lib.php 파일을 살펴보면 $is_crop=false로 되어 있죠.

// 게시글리스트 썸네일 생성
function get_list_thumbnail($bo_table, $wr_id, $thumb_width, $thumb_height, $is_create=false, $is_crop=false, $crop_mode='center', $is_sharpen=false, $um_value='80/0.5/3')
{

저 부분을 $is_crop=true 로 변경하면 고정된 사이즈로 크롭 돼서 여백이 생기지 않습니다.
수정 후 반드시 관리자페이지 > 환경설정 > 썸네일파일 일괄삭제를 클릭해야 반영됩니다.

원본 파일을 손대지 않고 스킨에서 별도로 처리하는 방법도 있습니다.

게시판 스킨 : list.skin.php
최신글 스킨 : latest.skin.php

스킨 파일에서 썸네일 생성 코드가 있는데 게시판 스킨 기준으로 보통 이렇게 되어 있죠.

$thumb = get_list_thumbnail($board['bo_table'], $list[$i]['wr_id'], $board['bo_gallery_width'], $board['bo_gallery_height']);

최신글 스킨은 일부 차이가 있지만 여기서 중요한 부분은 가로 세로 설정 옵션까지만 있다는 겁니다.
저 부분에 크롭 설정 옵션까지 포함시키면 됩니다.

$thumb = get_list_thumbnail($board['bo_table'], $list[$i]['wr_id'], $board['bo_gallery_width'], $board['bo_gallery_height'], false, true);

마지막에 있는 true 가 크롭 설정입니다.
true 로 하면 여백 없이 출력되고 false 로 하면 여백이 생깁니다.
최신글 스킨도 현재 사용 중인 스킨에서 마지막 뒷부분 옵션 두 개만 추가하면 됩니다.
(위 예제는 게시판 기준이니 최신글 스킨은 기존에 있던 코드에서 마지막 부분만 추가하세요. ,false, true)

 

그누보드 5.3 버전부터 기본 갤러리 스킨은 위 내용들이 기본적으로 적용되어 있을 겁니다.

수정 후 반드시 관리자 페이지 > 환경설정 > 썸네일파일 일괄삭제 클릭! 



## 이미지를 크롭 할 때 기준점을 중간이 아닌 상단으로 변경하기 ##


썸네일 옵션 마지막 부분에 'top' 추가

변경 후 환경설정 > 썸네일파일 일괄삭제 클릭


$thumb = get_list_thumbnail($board['bo_table'], $list[$i]['wr_id'], $board['bo_gallery_width'], $board['bo_gallery_height'], false, true, 'top');




영카트 상품 이미지 썸네일 수정 방법
http://gnustudy.com/bbs/board.php?bo_table=yc_tip&wr_id=23 

로그인 후 댓글 작성 가능합니다.

로그인

로그인 후 글 작성 가능합니다.
그누스킨닷컴

그누스터디는 그누보드, 영카트를 이용하시는 초보 사용자를 위한 정보를 공유합니다.

E-MAIL : gnustudy@naver.com / 카카오톡 : gnustudy / 텔레그램 : gnustudy
제작 문의를 제외한 일반 문의는 QA 게시판을 이용해주세요.

Copyright gnustudy.com All rights reserved.