크롬80버전 결제 이슈, 영카트5 주요패치 확인!

반응형 스마트 에디터 (스킨에서 JS 이용) > 그누보드5 팁자료실

컨텐츠몰 10% 할인 기간연장!
그누보드5
영카트5
매뉴얼
Q & A
제작의뢰
컨텐츠몰
부가서비스
소모임
커뮤니티

그누보드5 팁자료실

반응형 스마트 에디터 (스킨에서 JS 이용) 정보

반응형 스마트 에디터 (스킨에서 JS 이용)

본문

스마트 에디터를 반응형 테마에서 아래의 화면처럼 사용하기 위해서는 약간의 수정이 필요합니다.

 

2009992035_1581033331.5071.png

 

검색해보시면 이미 반응형으로 수정해서 올려놓으신 버전들과 팁이 있습니다만..

게시판 스킨의 write.skin.php 파일에 JS 를 추가해서 하는 방법을 소개합니다.

 

$(document).ready(function () {
    $('#wr_content').next('iframe').on('load', function () {
        let iframe = $('#wr_content').next('iframe').contents();
        // 좁은 화면에서 툴바의 아이콘들이 스택형태로 될 수 있도록 수정
        iframe.find('#smart_editor2').removeAttr('style');
        iframe.find('#smart_editor2 .se2_text_tool ul').css('margin-bottom', '5px');
        // 칼라픽커가 툴 아이콘 위에 오도록 수정
        iframe.find('#smart_editor2 .se2_text_tool li').css('z-index', 'unset');
        iframe.find('iframe').on('load', function() {
            let edit_area = iframe.find('iframe').contents();
            // 에디터에서 큰 이미지 업로드시 리사이즈를 위한 CSS
            // 신비언니님의 팁 https://sir.kr/g5_tip/12126 참고
            $("<style type='text/css'>.se2_inputarea img{max-width:100%; height:auto} </style>").appendTo(edit_area.find('head'));
        });
    });
});
추천10

댓글 전체

전체 1,639 |RSS
그누보드5 팁자료실 내용 검색

회원로그인

진행중 포인트경매

  1. 참여5 회 시작20.04.06 08:27 종료20.04.13 08:27
  2. 참여31 회 시작20.04.04 09:21 종료20.04.11 09:21

(주)에스아이알소프트 (06253) 서울특별시 강남구 도곡로1길 14, 6층 624호 (역삼동, 삼일프라자) 대표메일:admin@sir.kr
사업자등록번호:217-81-36347 대표:홍석명 통신판매업신고번호:2014-서울강남-02098호 개인정보보호책임자:이총

© SIRSOFT