그누보드 스마트에디터 툴바 아이콘 삭제 시 레이아웃 오류 해결 방법

• 목록
• 스크랩

그누보드 스마트에디터 툴바 아이콘 삭제 시 레이아웃 오류 해결 방법

그누보드 운영 중 스마트에디터2의 불필요한 툴바 아이콘을 삭제할 때 발생하는 하단 여백 및 레이아웃 깨짐 현상을 해결하고 원본 파일을 안전하게 수정하는 방법을 알아봅니다.

스마트에디터 아이콘 삭제 시 수정해야 하는 파일 경로

스마트에디터2에서 사용하지 않는 툴바 아이콘을 삭제할 때는 자바스크립트 파일과의 연동 끊김 및 레이아웃 오류를 방지하기 위해 반드시 다음 두 파일을 함께 수정해야 합니다. 수정하기 전에 원본 파일을 반드시 백업하십시오.

• plugin/editor/smarteditor2/SmartEditor2Skin.html
• plugin/editor/smarteditor2/js/service/SE2BasicCreator.js

각 파일의 역할과 수정 방식은 다음과 같습니다.

1. SmartEditor2Skin.html: 파일 내에서 불필요한 아이콘 코드를 찾아 직접 삭제합니다. 모든 아이콘을 삭제하여 세로 배경이 잘리거나 레이아웃이 깨지는 경우에는 se2_text_tool 클래스를 가진 div 태그에 높이 값을 직접 지정하여 보정할 수 있습니다.

      <div class="se2_text_tool husky_seditor_text_tool" style="height:21px">

2. SE2BasicCreator.js: 글꼴, 크기, 색상 등 주요 기능 아이콘이나 더보기 아이콘 등을 삭제했을 때 해당 기능과 관련된 코드를 찾아 주석 처리하여 자바스크립트 연동 오류에 대응합니다.

수정 후 변경 사항이 즉시 반영되지 않으면 브라우저 캐시를 삭제한 뒤 게시판 글쓰기 화면에서 에디터가 정상적으로 로드되는지 확인하십시오.

스마트에디터 자바스크립트 대응 방법

글꼴, 크기, 색상 등의 주요 기능 아이콘을 삭제한 경우에는 plugin/editor/smarteditor2/js/service/SE2BasicCreator.js 파일에서 해당 기능과 관련된 코드를 찾아 주석 처리해야 합니다. 더보기 아이콘 등도 이 파일에서 제어됩니다. 수정 전 반드시 원본 파일을 백업하십시오.

레이아웃 보정 방법

모든 아이콘을 삭제하여 세로 배경이 잘리거나 레이아웃이 깨지는 경우, plugin/editor/smarteditor2/SmartEditor2Skin.html 파일 내 se2_text_tool 클래스를 가진 div 태그에 높이 값을 직접 지정하여 해결할 수 있습니다.

적용 코드 예시

<div class="se2_text_tool husky_seditor_text_tool" style="height:21px">

적용 후 확인 및 주의사항

• 수정 후 변경 사항이 즉시 반영되지 않는다면 브라우저 캐시를 삭제한 뒤 확인하시기 바랍니다.
• 스마트에디터의 세부 버전에 따라 코드 구조가 다를 수 있으므로, 수정 후 에디터가 정상적으로 로드되는지 반드시 게시판 글쓰기 화면에서 확인하십시오.

함께 보면 좋은 글

• 그누보드 스마트에디터 사진 업로드 용량 제한 설정 방법
• 그누보드 게시판 본문 및 스마트에디터 폰트 크기·줄 간격 변경 방법
• 그누보드 스마트에디터 이미지 경로를 상대 경로로 변경하는 방법

참고자료

기타 참고자료

• mercury-seed.com — 스마트에디터 툴바 아이콘 삭제 및 레이아웃 오류 해결 방법