동하아빠

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

· 2020-02-07 (금) 08:55:59 · 7700 · 7

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

 

2009992035_1581033331.5071.png

 

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

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

 

[code]

$(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'));
        });
    });
});

[/code]

|

댓글 7개

2020-02-07 (금) 10:55:40
이런게 정말 팁이네요...감사합니다..
감사합니다.
오 감사합니다.
멋지네요~
감사합니다. 시도해봐야겠네요
감사합니다.
감사합니다. 복잡하지 않고 좋아보여요!
댓글을 작성하시려면 로그인이 필요합니다.

그누보드5 팁자료실

2,788건
+
제목 글쓴이 날짜 조회
20-03-11 조회 7,392
20-03-09 조회 7,768
20-03-09 조회 5,882
20-03-05 조회 5,487
20-03-05 조회 6,321
20-03-03 조회 9,664
20-03-02 조회 6,486
20-03-02 조회 7,462
20-03-01 조회 2.9만
20-02-28 조회 6,012
20-02-26 조회 6,364
20-02-26 조회 6,095
20-02-24 조회 6,921
20-02-23 조회 5,665
20-02-20 조회 6,795
20-02-18 조회 7,021
20-02-18 조회 5,845
20-02-12 조회 6,613
20-02-11 조회 9,447
20-02-10 조회 7,601
20-02-09 조회 6,086
20-02-09 조회 9,112
20-02-08 조회 5,595
20-02-08 조회 7,352
20-02-08 조회 7,722
20-02-07 조회 7,701
20-02-06 조회 6,592
20-02-05 조회 5,957
20-02-04 조회 6,838
20-02-03 조회 1.9만