에디터 cheditor5 에 관하여..
본문
안녕하세요.
에디터를 불러서 내용을 입력하려고 cheditor5를 사용하는데,
에디터 내부에 사진을 불러오면 원본사이즈가 아닌 최대 800px로 잡혀진 썸네일 크기로 출력이 되는데
크기조정 란에서 800이 아닌 1200으로 바꿔봐도 아무런 변화가 없습니다.
/plugin/editor/cheditor.js 의
.
.
.
imgJpegQuality : 0.92, // JPEG 사진의 퀄리티 값, 최대값 1
imgMaxWidth : 1440, // 사진 최대 가로 크기, 이 크기 보다 크면 리사이징 처리
imgResizeMinLimit : 32, // 사진 리사이징의 사용자 직접 입력 값이 이 값 보다 작으면, 이 값으로 설정
imgResizeSelected : 1200, // 사진 리사이징의 선택 입력 폼의 기본 선택 값
imgResizeValue : [120, 240, 320, 640, 800, 1200, 1440, -1], // -1 = 사용자 직접 입력
imgSetAttrAlt : true,
imgSetAttrWidth : 1, // -1 = (width="100%"; height="auto"), 0 = 설정 안함, 1 = 기본값
imgUploadNumber : 12,
imgUploadSortName : false,
imgWaterMarkAlpha : 1, // 워터마크 불투명도 (최대값 1)
이 부분을 변경해봐도 아무런 변화가 없습니다.
에디터에 입력된 사진을 원본 크기나 1200px , 1440px 정도까지 출력할 방법은 없나요?
고수님들의 조언 바랍니다.
답변 3
css에 영향을 받지 않나 살펴 보세요.
아미나빌드의 Movie-Board 를 변형해서 사용해 보려는데,
view-wrap 는 모두 width:100% 로 바꿔봐도 변화가 없습니다.
에디터 내부에 사진을 올리면 썸네일로 저장되는 것 같아서요..
/* View */
.view-wrap { width:100%; overflow:hidden; }
.view-wrap.view-modal { padding:5px; margin:0px; }
.view-wrap h2 { letter-spacing:-1px; padding:0px; margin:20px 0px; }
.is-mobile .view-wrap h2 { font-size:20px }
.view-wrap .view-video .apms-autowrap { width:100% !important; max-width:100% !important; }
.view-wrap .div-title-underbar span { padding-bottom:0px !important; }
/*.view-wrap .view-content { margin:15px 0px 30px; line-height:160%; } */
.view-wrap .view-content { margin:0px 0px 0px; line-height:100%;}
.view-wrap .view-content img { width:100%; height:auto; max-width:100%; }
.view-wrap .view-content p { padding:0; margin:0; line-height:160%; }
.view-wrap .view-info { margin:0px; padding:0px; padding-left:15px; line-height:20px; }
.view-wrap .view-director { list-style:none; margin:15px 0px 20px; padding:0px; line-height:20px; }
.view-wrap .view-stillcut { overflow:hidden; position:relative; }
.view-wrap .view-poster { margin-bottom:15px; }
.view-wrap .view-poster img { width:100%; max-width:100%; }
.view-wrap .view-scrap { margin:15px 0px 20px; }
.view-wrap .img-resize img { /* View */
.view-wrap { width:100%; overflow:hidden; }
.view-wrap.view-modal { padding:5px; margin:0px; }
.view-wrap h2 { letter-spacing:-1px; padding:0px; margin:20px 0px; }
.is-mobile .view-wrap h2 { font-size:20px }
.view-wrap .view-video .apms-autowrap { width:100% !important; max-width:100% !important; }
.view-wrap .div-title-underbar span { padding-bottom:0px !important; }
/*.view-wrap .view-content { margin:15px 0px 30px; line-height:160%; } */
.view-wrap .view-content { margin:0px 0px 0px; line-height:100%;}
.view-wrap .view-content img { width:100%; height:auto; max-width:100%; }
.view-wrap .view-content p { padding:0; margin:0; line-height:160%; }
.view-wrap .view-info { margin:0px; padding:0px; padding-left:15px; line-height:20px; }
.view-wrap .view-director { list-style:none; margin:15px 0px 20px; padding:0px; line-height:20px; }
.view-wrap .view-stillcut { overflow:hidden; position:relative; }
.view-wrap .view-poster { margin-bottom:15px; }
.view-wrap .view-poster img { width:100%; max-width:100%; }
.view-wrap .view-scrap { margin:15px 0px 20px; }
.view-wrap .img-resize img { width:100%; max-width:100%; height:auto; }
.view-wrap .no-attach { border-bottom:0px; }
.view-wrap .view-cnt { letter-spacing:0; }
.view-wrap .view-tag { margin:15px 0px 20px; color:#888; }
.view-wrap .view-icon { margin-bottom:20px; }
.view-wrap .view-icon img { width:34px; border-radius:50%; margin-bottom:5px; }
스타일시트의 view 부분이 이렇게 되어있습니다.
800으로 나오는 페이지 주소 올려 주시면 확인이 가능할거 같습니다.
어떤 스타일이 영향을 주고 있는지 확인을 해야 하는데...
브라우저에서 지원하는 기능들이 있습니다.
IE라면 이미지 위에 마우스 올리고 우클릭 메뉴에서 요소 검사로 확인이 가능합니다.
크롬에선 우클릭 메뉴에서 검사구요.
<?php
if (!defined("_GNUBOARD_")) exit; // 개별 페이지 접근 불가
// add_stylesheet('css 구문', 출력순서); 숫자가 작을 수록 먼저 출력됨
add_stylesheet('<link rel="stylesheet" href="'.$board_skin_url.'/style.css" media="screen">', 0);
// 값정리
$boset['video'] = (isset($boset['video']) && $boset['video']) ? $boset['video'] : '';
// 모달 타켓
$modal_target = (APMS_PIM) ? ' target="_parent"' : '';
$modal_query = (APMS_PIM) ? '&pim=1' : '';
// 별점출력
$vstar = apms_post_star($view, $vstar_color);
// 스틸컷
$stillcut = array();
$j=0;
for ($i=2; $i<=count($view['file']); $i++) {
if ($view['file'][$i]['view']) {
$stillcut[$j] = G5_DATA_URL.'/file/'.$bo_table.'/'.$view['file'][$i]['file'];
$j++;
}
}
$stillcut_cnt = count($stillcut);
if($stillcut_cnt) {
// 라이트박스
apms_script('lightbox');
// Owl Carousel
apms_script('owlcarousel');
$vthumb_w = (isset($wset['vthumb_w']) && $wset['vthumb_w'] > 0) ? $wset['vthumb_w'] : 400;
$vthumb_h = (isset($wset['vthumb_h']) && $wset['vthumb_h'] > 0) ? $wset['vthumb_h'] : 225;
$vimg_h = apms_img_height($vthumb_w, $vthumb_h, '56.25');
// 간격
$vgap = (isset($wset['vgap']) && ($wset['vgap'] > 0 || $wset['vgap'] == "0")) ? (int)$wset['vgap'] : 15;
$vminus = ($vgap > 0) ? '-'.$vgap : 0;
// 가로수
$vitem = (isset($wset['vitem']) && $wset['vitem'] > 0) ? (int)$wset['vitem'] : 4;
// 반응형
if(_RESPONSIVE_) {
$vlg = (isset($wset['vlg']) && $wset['vlg'] > 0) ? (int)$wset['vlg'] : 3;
$vmd = (isset($wset['vmd']) && $wset['vmd'] > 0) ? (int)$wset['vmd'] : 3;
$vsm = (isset($wset['vsm']) && $wset['vsm'] > 0) ? (int)$wset['vsm'] : 3;
$vxs = (isset($wset['vxs']) && $wset['vxs'] > 0) ? (int)$wset['vxs'] : 2;
}
?>
<style>
.view-stillcut .owl-container { margin-right:<?php echo $vminus;?>px;}
.view-stillcut .owl-next { right:<?php echo $vgap;?>px !important; }
.view-stillcut .item { margin-right:<?php echo $vgap;?>px; }
.view-stillcut .img-wrap { padding-bottom:<?php echo $vimg_h;?>%; }
.view-stillcut .owl-hide { margin-right:<?php echo ($vitem > 1) ? ($vgap * ($vitem - 1)) : $vgap;?>px; }
.view-stillcut .owl-hide .item { width:<?php echo apms_img_width($vitem);?>%; }
<?php if(_RESPONSIVE_) { //반응형일 때만 작동 ?>
@media (max-width:1199px) {
.responsive .view-stillcut .owl-hide { margin-right:<?php echo ($vlg > 1) ? ($vgap * ($vlg - 1)) : $vgap;?>px; }
.responsive .view-stillcut .owl-hide .item { width:<?php echo apms_img_width($vlg);?>%; }
}
@media (max-width:991px) {
.responsive .view-stillcut .owl-hide { margin-right:<?php echo ($vmd > 1) ? ($vgap * ($vmd - 1)) : $vgap;?>px; }
.responsive .view-stillcut .owl-hide .item { width:<?php echo apms_img_width($vmd);?>%; }
}
@media (max-width:767px) {
.responsive .view-stillcut { margin-bottom:15px; }
.responsive .view-stillcut .owl-hide { margin-right:<?php echo ($vsm > 1) ? ($vgap * ($vsm - 1)) : $vgap;?>px; }
.responsive .view-stillcut .owl-hide .item { width:<?php echo apms_img_width($vsm);?>%; }
}
@media (max-width:480px) {
.responsive .view-stillcut .owl-hide { margin-right:<?php echo ($vxs > 1) ? ($vgap * ($vxs - 1)) : $vgap;?>px; }
.responsive .view-stillcut .owl-hide .item { width:<?php echo apms_img_width($vxs);?>%; }
}
<?php } ?>
</style>
<?php } ?>
<script src="<?php echo G5_JS_URL; ?>/viewimageresize.js"></script>
<div class="view-wrap<?php echo (G5_IS_MOBILE) ? ' view-mobile font-14' : '';?><?php echo (APMS_PIM) ? ' view-modal' : '';?>">
<div class="row">
<div class="col-md-12" style="float:center;">
<?php if($wr_data['content']) { // 메인 컨텐츠 ?>
<div class="view-content">
<?php echo get_view_thumbnail(apms_content(conv_content($wr_data['content'], 2)));?>
</div>
<?php } ?>
<?php if($wr_data['intention']) { ?>
<div class="view-content">
<?php echo get_view_thumbnail(apms_content(conv_content($wr_data['intention'], 2)));?>
</div>
<?php } ?>
</div>
</div>
</div>
