질문/조언팁/리소스 공유

이건 제가 방금 올린 https://xetown.com/lakepark/92029 이거랑 일부 연관이 되는 글입니다.

 

스케치북 게시판 모바일에서 댓글 수정할때 나오는 에디터는 "모바일 글쓰기 에디터"를 따라갑니다.

 

즉 모바일에서 글쓰기창에 textarea를 사용하기로 했을 경우 댓글 수정할때도 textarea를 불러옵니다.

 

근데 이게 문제가 있는데, 만약 그 댓글이 "에디터 모드"에서 작성된 댓글일 경우, P 태그 때문에 엄청난 띄어쓰기 테러가 일어나고, 만약 html태그가 걸려 있을 경우 태그관광이 발생합니다.

 

특히, 위 링크의 팁을 적용해서 모바일에서도 에디터로 댓글을 쓸 수 있게 해 놨을 경우 더욱 문제가 됩니다.

 

해결방법은 두가지가 있는데, 하나는 모바일 글쓰기 에디터를 웹 에디터로 (웹 에디터는 ckeditor 사용) 바꾸는 것이고

 

두번째는 지금 이 글을 적용하는 것입니다.

 

참고로 저는, 모바일에서 에디터 로딩속도 문제랑 기타 몇 가지 문제 때문에 textarea를 사용하고 있습니다. 따라서 이 글의 방법을 이용해서, 글쓰기 에디터와 별개로 댓글을 수정할때는 무조건 ckeditor를 불러오도록 해서 해결하고 있습니다.

 

 

 

 

comment_form.html 파일을 열고

 

내리다 보면 <!--// 댓글 수정화면 --> 라고 되어 있는 부분이 있는데 그 부분을 보면

 

 <div cond="!Mobile::isMobileCheckByAgent() || $mi->m_editor==3" class="get_editor">{$oComment->getEditor()}</div>

 

이런 부분이 있습니다. (뜻은, PC로 접속했거나 또는 모바일 글쓰기 에디터가 "웹 에디터"일 경우 웹 에디터를 불러오라는 것입니다.)

 

이 부분을, <div class="get_editor">{$oComment->getEditor()}</div> 이렇게 바꿔줍니다.

 

그리고 그 이하에 <div cond="Mobile::isMobileCheckByAgent() && $mi->m_editor!=3" class="m_editor"> 이 부분이 있는데

 

이 div 태그가 감싸고 있는 모든 구문을 과감하게 삭제합니다. (약 46줄 정도 됩니다.)

 

지워야 하는 코드를 옮겨 보면 다음과 같습니다. (클릭하면 열립니다.)
 

<div cond="Mobile::isMobileCheckByAgent() && $mi->m_editor!=3" class="m_editor">
<!-- Textarea -->
<block cond="$mi->m_editor==2">
<load target="../../../editor/tpl/js/editor_common.min.js" />
<load target="../../../editor/skins/xpresseditor/js/xe_textarea.min.js" />
<input type="hidden" name="use_html" value="Y" />
<input type="hidden" id="htm_1" value="n" />
<textarea id="editor_1" col="50" rows="8"></textarea>
<script>
editorStartTextarea(1,"content","document_srl");
</script>
</block>
<!-- WYSIWYG -->
<block cond="!$mi->m_editor">
<load target="css/m_editor.css" />
<load target="js/editor_wysiwyg.js" />
<load target="js/bootstrap-wysiwyg.js" />
<load target="js/jquery.hotkeys.js" />
<div id="alerts"></div>
<div class="btn-toolbar clear" data-role="editor-toolbar" data-target="#editor">
<div class="btn-group">
<a class="btn" data-edit="bold" title="Bold (Ctrl/Cmd+B)"><i class="fa fa-bold"></i></a>
<a class="btn" data-edit="underline" title="Underline (Ctrl/Cmd+U)"><i class="fa fa-underline"></i></a>
<a class="btn" data-edit="strikethrough" title="Strikethrough"><i class="fa fa-strikethrough"></i></a>
</div>
<div class="btn-group">
<a class="btn" data-edit="justifyleft" title="Align Left (Ctrl/Cmd+L)"><i class="fa fa-align-left"></i></a>
<a class="btn" data-edit="justifycenter" title="Center (Ctrl/Cmd+E)"><i class="fa fa-align-center"></i></a>
<!--//
<a class="btn" data-edit="justifyright" title="Align Right (Ctrl/Cmd+R)"><i class="fa fa-align-right"></i></a>
<a class="btn" data-edit="justifyfull" title="Justify (Ctrl/Cmd+J)"><i class="fa fa-align-justify"></i></a>
-->
</div>
<div class="btn-group hide_w320">
<a class="btn" data-edit="insertunorderedlist" title="Bullet list"><i class="fa fa-list-ul"></i></a>
<!--//<a class="btn" data-edit="insertorderedlist" title="Number list"><i class="fa fa-list-ol"></i></a>-->
</div>
<div class="btn-group fr">
<a class="btn" data-edit="undo" title="Undo (Ctrl/Cmd+Z)"><i class="fa fa-undo"></i></a>
<a class="btn" data-edit="redo" title="Redo (Ctrl/Cmd+Y)"><i class="fa fa-repeat"></i></a>
</div>
<div class="blind"><input type="text" data-edit="inserthtml" id="inserthtml" /></div>
</div>
<div id="editor"><p> </p></div>
</block>
</div>

 

 

 

이렇게 하면, 모바일에서 글쓰기 에디터를 무엇으로 설정했든지 간에, 댓글을 수정할때는 무조건 웹 에디터를 불러옵니다.

  • ?
    와.. 이거 어떻게해야하나 했는데ㅠㅠ 꿀팁이네요 추천쾅[email protected]@ 바로 적용하러
  • ?
    엄청 유용합니다 꿀팁
  • ?
    ㅠㅠ감사합니다 드디어 해결입니다.
  • ?
    이렇게 수정해서 웹에디터를 불러와도 수정하면 태그가 붙네요 ㅠㅠ
  • ? ?
    그건 다른 문제인거 같네요. 전 안 일어나서 잘 모르겠는데 몇몇 분들의 경우 모바일에서 태그노출되는 문제를 겪고 질문 올리신 것들이 있습니다. xe타운에서 검색하면 나올테니 그거 찾아보세요
  • ?
    혹시 댓글수정창을 에디터가 아닌 기본 textarea로 바꿀수는 없나요?
  • ? ?
    이 팁을 적용 안하고 설정에서 textarea라고 하면 textarea입니다.
  • ?

    저도 글쓰기를 textarea 지정하고 본문 내용의 팁만 적용을 하면 
    댓글쓸때는 textarea 화면이 표시되고 댓글 작성 후 수정 화면에서는 팁대로 무조건 에디터가 보여지긴 합니다만 위의 아싸리 방가님 처럼 수정 후에는 태그가 노출되고 있습니다. ㅠ.ㅠ
     

  • ?

    https://github.com/xpressengine/xe-core/pull/1495 모바일에서 태그 노출되는 팁도 적용해봤는데 마찬가지입니다. ^^;;

  • ? ?
    모르겠네요... 전 태그노출 팁 적용 안해도 태그노출이 안됩니다

    뭔가 다른 원인 때문인거 같네요... 전 실력이 없어서 모르겠습니다. 고수분들이 도와주셔야 할거 같네요
  • ? ?
    답변 감사합니다.
    제가 한거라곤 https://xetown.com/square/121781 팁 적용을 한것 밖엔 없는데...
    이팁을 원래 대로 적용하지 않고 해봐도 댓글 수정 시 각종 태그가 노출되네요.
    천천히 시간을 두고 한번 다시 해볼게요.
  • ?
    댓글 수정하면 태그가 붙어서 불편했었는데 넘 감사해요!
  • ?
    저도 그대로 따라했는데도 안고쳐지네요...
  • ? ?
    아까 댓글다신거 보니 모바일에 파일첨부 찾으시는거 같은데 이건 "댓글 수정"할때 에디터 불러오는 겁니다. 댓글 쓸때 에디터 불러오려면 settings 파일 수정해야 합니다. 이것도 제가 올렸는지 다른분이 올렸는지 xe타운에 있으니 찾아보시면 나올겁니다
  • ? ?
    예 물론 다른 글 보고 에디터는 불러왔습니다. 제가 안된다고 한건 이 것을 적용했는데도 모바일 환경에서 수정시 글이 엉망이 되는 현상은 여전하다는 뜻이었습니다.
  • ? ?
    https://xetown.com/qna/402860

    이거 한번 해보세요. 정확하게 저게 원인인지는 모르겠습니다만
  • ? ?
    너무 복잡해서 일단 원상태로 죄다 되돌렸지만 추후 시도해보겠습니다.