그누보드 게시판 에디터 입력창 높이 조절 방법

• 목록
• 스크랩

그누보드 게시판 에디터 입력창 높이 조절 방법

그누보드에서 사용하는 SmartEditor2, CKEditor4, Cheditor5의 기본 입력창 높이를 사용자가 원하는 크기로 변경하는 방법을 안내합니다.

그누보드 게시판 에디터 높이 조절 방법

게시판 에디터의 입력창 높이를 조절하려면 각 에디터별 설정 파일을 수정해야 합니다. 수정 전 반드시 원본 파일을 백업하시기 바라며, 수정 후에는 브라우저 캐시로 인해 변경 사항이 즉시 보이지 않을 수 있으므로 새로고침(Ctrl+F5)을 통해 확인하십시오.

1. SmartEditor2

• 기본 높이 수정: /plugin/editor/smarteditor2/editor.lib.php 파일을 열어 <textarea> 태그의 style 속성 내 height 값을 원하는 값(예: 300px)으로 수정합니다.
• 최소 높이 제한: 205px 이하로 설정하려면 /plugin/editor/smarteditor2/js/service/SE2BasicCreator.js 파일 내 nMinHeight:205 값을 원하는 높이로 함께 수정해야 합니다.

2. CKEditor4

CKEditor4는 설정 파일에서 PC와 모바일 환경을 구분하여 높이를 지정할 수 있습니다.

• 수정 파일: /plugin/editor/ckeditor4/config.js
• 수정 방법: config.height 값을 찾습니다. if(g5_is_mobile) 조건문을 통해 모바일과 PC 환경의 높이를 각각 다르게 설정할 수 있습니다.

3. Cheditor5

Cheditor5는 라이브러리 파일 내 변수를 수정합니다.

• 수정 파일: /plugin/editor/cheditor5/editor.lib.php
• 수정 방법: $height 변수 값을 원하는 크기(예: "300px")로 수정합니다.

주의사항: 최신 버전의 에디터나 커스텀 스킨을 사용하는 경우 파일 구조가 다를 수 있습니다. 수정 후에도 변경되지 않는다면 서버 캐시나 브라우저 캐시를 비우고 다시 확인하십시오.

CKEditor4 환경별 높이 설정 방법

CKEditor4는 접속 환경(PC/모바일)에 따라 에디터 높이를 다르게 설정할 수 있습니다. 설정 파일인 /plugin/editor/ckeditor4/config.js를 수정하여 적용합니다.

설정 방법

/plugin/editor/ckeditor4/config.js 파일에서 config.height 설정 부분을 찾아 아래와 같이 g5_is_mobile 변수를 사용하여 환경별 높이를 지정합니다.

// 에디터 높이 설정
if(g5_is_mobile) {
 // 모바일 환경 높이
 config.height = '200px';
} else {
 // PC 환경 높이
 config.height = '300px';
}

주의사항 및 확인

• 백업 필수: 수정 전 반드시 config.js 파일을 복사하여 원본을 백업하십시오.
• 캐시 초기화: 수정 후 게시글 작성 페이지에서 변경 사항이 보이지 않는다면, 브라우저 캐시 문제일 수 있으므로 새로고침(Ctrl+F5)을 수행하여 확인하십시오.
• 적용 범위: 위 설정은 클래식 에디터 방식에 적용됩니다. 인라인 에디터 등 다른 환경에서는 해당 설정이 무시될 수 있습니다.

Cheditor5 에디터 높이 수정 방법

Cheditor5의 입력창 높이는 에디터 설정 파일 내의 변수 값을 직접 수정하여 조절할 수 있습니다.

수정 절차

1. 파일 경로 확인: 서버 내 /plugin/editor/cheditor5/editor.lib.php 파일을 엽니다.
2. 변수 수정: 파일 내에서 $height 변수가 설정된 부분을 찾습니다.
   • 기존 코드 예시: $height = isset($editor_height)? $editor_height: "250px";
   • 수정 방법: 위 코드의 "250px" 부분을 원하는 높이값(예: "300px")으로 변경합니다.
3. 적용 확인: 수정 후 게시글 작성 페이지를 새로고침(Ctrl+F5)하여 변경된 높이가 적용되었는지 확인합니다.

주의사항

• 백업 필수: 파일을 수정하기 전, 반드시 원본 파일을 별도로 백업해 두시기 바랍니다.
• 캐시 문제: 수정 후에도 높이가 변하지 않는다면 브라우저 캐시나 서버 캐시가 남아있을 수 있으므로, 강력 새로고침을 수행하거나 캐시를 삭제한 후 다시 확인하십시오.
• 버전 차이: 사용 중인 그누보드 버전이나 에디터 스킨의 구조에 따라 파일 경로가 다를 수 있습니다.

에디터 설정 수정 후 높이 미적용 시 조치 방법

에디터 설정 파일의 height 값을 수정했음에도 불구하고 게시글 작성 화면에 변경 사항이 즉시 반영되지 않는다면, 주로 브라우저 캐시나 서버 캐시 문제일 가능성이 높습니다. 다음 단계를 순서대로 확인해 보시기 바랍니다.

1. 브라우저 캐시 새로고침

웹 브라우저는 성능 향상을 위해 이전 설정 파일을 기억하고 있을 수 있습니다. 게시글 작성 페이지에서 다음 단축키를 사용하여 강제 새로고침을 수행하세요.

• Windows/Linux: Ctrl + F5
• macOS: Cmd + Shift + R

2. 서버 캐시 및 임시 파일 확인

그누보드 환경에 따라 서버 측에서 생성된 캐시 파일이 수정된 설정을 덮어쓰고 있을 수 있습니다.

• 캐시 폴더 삭제: 그누보드 설치 경로 내 data/cache/ 폴더에 있는 파일들을 삭제하여 캐시를 초기화합니다.
• 파일 권한 확인: 수정된 설정 파일(editor.lib.php, config.js 등)이 서버에 정상적으로 저장되었는지, 파일 권한(Permission)이 읽기 가능 상태인지 확인합니다.

3. 설정 파일 재확인

수정한 파일이 현재 게시판에서 실제로 사용 중인 에디터의 경로와 일치하는지 다시 확인합니다.

• SmartEditor2: /plugin/editor/smarteditor2/editor.lib.php 및 /plugin/editor/smarteditor2/js/service/SE2BasicCreator.js (최소 높이 제한 확인)
• CKEditor4: /plugin/editor/ckeditor4/config.js (PC/모바일 분기 처리 확인)
• Cheditor5: /plugin/editor/cheditor5/editor.lib.php

4. 추가 점검 사항

• 백업 복구: 만약 수정 후 에디터가 아예 나타나지 않는다면, 수정 전 백업해둔 원본 파일을 덮어씌워 정상 작동 여부를 먼저 확인하십시오.
• 요소 검사: 브라우저의 '개발자 도구(F12)'를 열어 '요소 검사(Inspect)' 기능을 통해 현재 적용된 CSS 속성(height)이 무엇인지 확인하면, 어떤 파일이 우선순위를 가지고 있는지 파악할 수 있습니다.

에디터 높이 조절 상황별 대응

상황	선택 기준	다음 행동
SmartEditor2	205px 이하로 설정 시	editor.lib.php의 height 수정 후 SE2BasicCreator.js의 nMinHeight 값 변경
CKEditor4	PC/모바일 환경 구분 필요 시	config.js 내 if(g5_is_mobile) 조건문 안의 config.height 값 수정
Cheditor5	기본 높이 변경 시	editor.lib.php 내 $height 변수값 수정
수정 후 미적용	캐시 잔존 여부 확인	브라우저 강제 새로고침(Ctrl+F5) 및 data/cache/ 폴더 내 캐시 파일 삭제

실전 FAQ

Q: 설정 파일을 수정했는데도 높이가 변하지 않습니다.

• 브라우저가 이전 설정 파일을 기억하고 있을 수 있습니다. 게시글 작성 페이지에서 Ctrl+F5(강제 새로고침)를 수행하십시오. 그래도 해결되지 않으면 서버의 data/cache/ 폴더 내 파일을 삭제하여 캐시를 초기화하십시오.

Q: SmartEditor2에서 높이를 205px 이하로 줄이고 싶습니다.

• editor.lib.php의 height 값만 수정하면 최소 높이 제한(205px)에 걸려 적용되지 않습니다. 반드시 /plugin/editor/smarteditor2/js/service/SE2BasicCreator.js 파일 내 nMinHeight 값을 원하는 높이로 함께 수정해야 합니다.

Q: CKEditor4에서 모바일과 PC 높이를 다르게 설정할 수 있나요?

• 네, /plugin/editor/ckeditor4/config.js 파일 내 if(g5_is_mobile) 조건문을 활용하십시오. if 블록 안에는 모바일용 높이를, else 블록 안에는 PC용 높이를 각각 지정할 수 있습니다.

함께 보면 좋은 글

• 그누보드 스마트에디터(SmartEditor2) 글쓰기 영역 높이 조절하기

참고자료

기타 참고자료

• sir.kr — 그누보드 에디터 높이 설정관리자 > 환경설정 - 에디터 높이 - SIR - 개발자 커뮤니티
• sir.kr — 스마트에디터 높이 조정은 어디서해야하나요!? - SIR - 개발자 커뮤니티
• gnustudy.com — 에디터 입력화면 세로 높이 수정 smarteditor2, ckeditor4, cheditor5 - 그누보드팁
• junesker.tistory.com — CKEditor4 편집기 크기 조정 — ? 배워서 남주자