동하아빠

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

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

 

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개

이런게 정말 팁이네요...감사합니다..
오 감사합니다.
감사합니다. 시도해봐야겠네요
감사합니다. 복잡하지 않고 좋아보여요!
댓글을 작성하시려면 로그인이 필요합니다.
+
제목 글쓴이 날짜 조회
20-03-12 조회 7,479
20-03-12 조회 7,662
20-03-12 조회 8,209
20-03-12 조회 7,589
20-03-11 조회 8,877
20-03-09 조회 9,240
20-03-09 조회 7,252
20-03-05 조회 6,794
20-03-05 조회 7,530
20-03-03 조회 1.1만
20-03-02 조회 7,795
20-03-02 조회 8,745
20-03-01 조회 3만
20-02-28 조회 7,289
20-02-26 조회 7,646
20-02-26 조회 7,360
20-02-24 조회 8,136
20-02-23 조회 6,906
20-02-20 조회 8,037
20-02-18 조회 8,248
20-02-18 조회 7,046
20-02-12 조회 7,859
20-02-11 조회 1.1만
20-02-10 조회 8,844
20-02-09 조회 7,341
20-02-09 조회 1만
20-02-08 조회 6,833
20-02-08 조회 8,631
20-02-08 조회 9,014
20-02-07 조회 8,926