질문/조언질답게시판

이것 저것 해 보다가 우연히 검색에서 

 

if(isMyMobile==true)
{
        CKEDITOR.editorConfig = function( config ) {
                  config.enterMode = CKEDITOR.ENTER_BR;
        };
}

 

위와 같은 것을 발견했습니다. 그런데 이렇게 하니 모바일에서 엔터를 치면 br로 됩니다. 그런데 문제는 엔터를 치면 의도는 줄만 바꾸는 것인데 한칸이 벌어지고 한칸을 띄우려고 하면 2칸이 띄워 집니다.

 

다른 해결책이 있을까요....  이게 해결 되어야  모바일에 CK에디터를 적용해 보는데 지금 삽질하고 있습니ㅏ.

 

<p>모바일 줄바꿈<br />
<br />
처리가 어려워서<br />
<br />
<br />
<br />
적용하는게 어려워요<br />
<br />
 </p>

 

처음에는 엔터를 한번 친거구요. 

그다음 엔터 두번 

그다음 엔터 한번 입니다.

 

 

 

  • profile

    오! config.fillEmptyBlocks = false;
    이거로 되는듯 합니다.

     

    아닌듯.. 합니다. 등록을 하고 나면 2칸씩 간격이 벌어지네요.. ㅡㅡ;

  • ?
    이전 댓글에서도 말씀 드렸지만 줄바꿈 문자 때문이에요 ㅋㅋ
    모바일에서 작성한 글에는 nl2br 이 적용됩니다.
  • ? profile

    뭐 제가 할 수없다는 건가요? 모바일에 적용을 하신분들 계서서 저도 CK에디터의 사용성을 저희 사이트에서 모바일에서 확인해 보고 싶습니다.

     

    의뢰를 해서 해결을 하라는 말씀 이신가요?

  • ? profile
    <p>크롬에서는 어떤지</p>
    
    <p> </p>
    
    <p> </p>
    
    <p>한번</p>
    
    <p> </p>
    
    <p> </p>
    
    <p> </p>
    
    <p> </p>
    
    <p> </p>
    
    <p> </p>
    
    <p> </p>
    
    <p> </p>
    
    <p> </p>
    
    <p>두번</p>
    
    <p> </p>
    
    <p> </p>
    
    <p> </p>
    
    <p> </p>
    
    <p> </p>
    
    <p> </p>
    
    <p> </p>
    
    <p> </p>
    
    <p> </p>
    
    <p> </p>
    
    <p> </p>
    
    <p> </p>
    
    <p> </p>
    
    <p> </p>
    
    <p>세번</p>
    
    <p> </p>
    
    <p> </p>

     

    이건 BR을 설정에서 빼면 이렇게 되는 듯 합니다.

  • profile ?
    어떤 기본 게시판 스킨인지 알려주시면 수정할 곳 알려드리겠습니다.
  • ? profile

    도움 주셔서 감사합니다.

    플랫모바일이구요.

     

    비밀댓글 체크가 없어 공개 댓글로 작성합니다. 파일 첨부했어요. 해결되면 지울게요.

     

  • profile ?
    넵 집에 들어가서 곧 올리겠습니다.
  • profile ?

    1.  onsubmit="return procFilter(this, insert)" 이벤트를 삭제합니다.

    2. 텍스트 에어리어를

    <input type="hidden" class="write_content" name="content" value="<[email protected]($document_srl)-->{str_replace(array("\r\n","\n"),array('',''),$oDocument->getContentText())}<[email protected](!$document_srl && $mi->pre_inserted)-->{str_replace(array("\r\n","\n"),array('',''),$mi->pre_inserted)}<[email protected]>" />
    <input type="hidden" name="use_html" value="Y" />
    <input type="hidden" name="use_editor" value="Y" />
    <div class="write_editor">
        {$oDocument->getEditor()}
    </div>


    로 변경

    3. 전송시 onsubmit 이벤트 추가

    <script>
    /* 줄 바꿈에 br 태그를 넣어버리는 XE Core 회피를 위해서 line-break를 모두 지움 */
    jQuery(window).load(function($){
    jQuery("#ff").submit(function( event ) {
    var contents = jQuery("[name='content']",this).val().replace(/(\r\n|\n|\r)/gm,'');
    jQuery("[name='content']",this).val(contents);
    
    var params = [], data = jQuery(this).serializeArray();
    jQuery.each(data, function(i, field) {
    var v = jQuery.trim(field.value), n = field.name;
    if(!v || !n) return true;
    
    if(/\[\]$/.test(n)) n = n.replace(/\[\]$/, '');
    if(params[n]) {
    params[n] += '|@|'+v;
    } else {
    params[n] = field.value;
    }
    });
    var response_tags = ['error','message','mid','document_srl','category_srl'];
    
    exec_xml('board', 'procBoardInsertDocument', params, function(a) { completeDocumentInserted(a); }, response_tags, params);
    return false;
    });
    });
    </script>

     

    결과는 첨부파일(write_form.zip )을 참고하세요. (edit.js는 글 수정시에만 적용되기 때문에 적절한 파일이 아닌 것 같아서 HTML 파일에 직접 스크립트를 넣었습니다.

  • ? profile
    정말 감사합니다. 적용해 보겠습니다.
  • ? profile
    적용해주신거로 해보니 줄바꿈이 모무 없어지긴 하는데요. 줄바꿈을 하려고 엔터를 친부분까지 모두 사라지는데 이부분은 어떻게 해야 할까요???
  • profile ?
    에디터로 편집 해도 그런가요?-?
  • ? profile
    에디터로 편집이라는게 어떤거죠? 주신 파일로 업로드해서 CK에디터가 로드되어 거기서 글을 작성했는데요. 엔터가 하나도 안먹고 모두 붙어서 나와요.

    글자
    글자
    글자

    이런식이요.
  • profile ?
    글자
    글자
    글자 면 글자와 글자 사이에 엔터가 입력 된 것 같은데 아닌가요???
    글자

    글자 가 되어야 하는건가요???
  • profile ?
    어떤 의미신지 알기가 어려워서 포메 러브 가입해보는 중입니다... ㅎㅎ
  • ? profile
    아이고 죄송해요. 테스트계정 드려야 하는데요. 가입인사는 준회원도 작성 가능하세요.
  • ? profile
    엔터를 두번 치면 두번으로 줄이 한칸 간격이 발생해야 하는데 이게 안되요.
  • profile ?
    에디터에서는 <br /> 이 들어가고.. 이 부분은 건드리는 부분이 아닌데 이상하네요 ㅠㅠㅎㅎ
    혹시 사용하신 휴대폰 OS(버전까진 모르시더라도 안드로이드인지 아이폰인지), 브라우저 종류(아이폰 기본 사파리/안드로이드 기본 브라우저/안드로이드 크롬/파이어폭스 등등)을 알려주실 수 있나요?
  • ? profile
    안드로이드 5.0 크롬과 저희 웹뷰에서 테스트 했어요.
  • profile ?

    아.. 알았어요. http://pomelove.com/xe/free/699643 에서 보여주신 문제인데..

    <p></p> 로 <p> 안에 아무 내용이 없을 경우에 p 에 마진(CSS margin 속성)이 전혀 없고 안에 내용도 없기 때문에 발생하는 문제입니다.

    에디터는 정확하게 <p></p> 를 넣고 있어요.

  • ? profile
    안드로이드 기본브라우저는 괜찮고 크롬과 웹뷰에서 그러네요.
  • ?
    http://pomelove.com/xe/free/699666 는 어떤 방식으로 쓰신지 모르겠지만, 엔터가 정확하게 나타나고 있군요. 여기서는 <p></p> 가 아니라 공백이 하나 포함된 <p> </p> 이기 때문에 나타납니다.
  • ? profile
    이걸 PC에서 수정하면 괜찮아지고 안드로이드 크롬과 앱에서 이런현상이 있는데요. 왜그런가요? 기본브라우저에서 작성시는 괜찮네요.
  • ? profile
    거긴 기본브라우저로 작성했어요.
  • profile ?
    p 태그의 margin 속성을 0이 되지 않게 적당 값을 주면 해결됩니다. 하지만 모바일 게시판 스킨 자체에 .read-body .xe_content p img {margin: 0 !important;} 라고 선언되어 있기 때문에 에디터 스타일을 변경하시더라도 아마 안될 것 같습니다.
    에디터에서 엔터를 <p> 가 아닌 <br> 로 인식하도록 변경하는 것 까지 하셔야 할 것 같아요
  • ?
    common/js/plugins/ckeditor/ckeditor/config.js 를 생성하고

    아래 코드를 넣어보세요.
    그리고 저장합니다.


    CKEDITOR.editorConfig = function (config)
    {
    config.enterMode = CKEDITOR.ENTER_BR;
    };
  • profile ?
    PC 에서 수정하면, <p></p> 가 편집할 수 없는 형태니까. <p> </p> 로 바꾸어서 그래요.
  • ? profile

    감사합니다. 위 답변보고 적용할때 또 댓글까지 달아주셨네요. br로 바꾸니 줄바꿈이 잘 됩니다.

    감사합니다. 이 상태로 모바일에서 사용가능 할 것 같습니다.
    진심으로 감사드립니다. 후원계좌라도 열어주시면 나중에 감사표시를 드리겠습니다.

  • ? profile
    권장서식과 관련이 있을까요? 권장서식에는 P마진을 준것으로 아는데요. 뭐 저는 권장서식을 쓰고싶지는않지만 궁금해서 여쭤 보았습니다.
  • profile ?
    지금 사용하고 계신 모바일 게시판 스킨에서 p 태그에 마진(바깥여백)을 0으로 둔 다음 변경 불가 선언을 해서... 권장 서식을 사용하더라도 마진이 0 상태 그대로입니다. 그래서... 권장서식을 사용하시더라도 문제 해결이 안될 것 같았습니다.
    <br> 로 줄바꿈을 하게되면, 일단은 해결될 것이기 때문에 권해드렸습니다. 아마 CKEditor 속성이기 때문에 별 문제는 없을거에요.
  • ?
    저도 ckeditor에서 엔터시 br이 되도록 하니까 문제들이 생겨서 그냥 원상복귀 시켰네요
  • ? profile
    현 XE코어에서는 모바일에서 별도처리가 필요한 듯합니다. 미솔님께서 봐주신다고 하셨는데 제 스킨에 한정된 이야기라서...
  • profile
    혹시 pjax보드 사용중이신가요 ? 저도 같은 문제를 겪고있어서요
    혹시 해결 하셨나요 ? 전 처음에는 안나오는데 수정하고 저장할때마다 추가로 p태그가 계속 추가되네요 ㅎㅎ;;
  • profile
    http://sejin7940.co.kr/index.php?document_srl=105089&mid=xe_tips

    위의 팁을보고 수정했습니다 ^^ 혹시 몰라 남겨놓습니다 ~
  • profile profile
    감사합니다! 뒤늦게 검색해서 잘보고 가요