크롬 브라우저에서 에러를 확인해보니
이미지 업로드 후 이미지 하단의 "삽입" 버튼을 누를 때마다 나타납니다.
script.js?ver=5.3.5:67 Uncaught TypeError: Cannot read property 'execCommand' of null
at kboard_editor_insert_media (script.js?ver=5.3.5:67)
at kboard_media_insert (?action=kboard_media&board_id=1&media_group=5aab77e6b6cae&content_uid=:145)
at HTMLButtonElement.onclick (?action=kboard_media&board_id=1&media_group=5aab77e6b6cae&content_uid=:80)
이미지 업로드 후 상단 메뉴의 "+선택 삽입" 버튼을 누를 때마다 나타납니다.
Uncaught TypeError: Cannot read property 'execCommand' of null
at kboard_editor_insert_media (script.js?ver=5.3.5:67)
at HTMLInputElement.<anonymous> (?action=kboard_media&board_id=1&media_group=5aab77e6b6cae&content_uid=:133)
at Function.each (jquery-1.11.3.min.js:2)
at e.fn.init.each (jquery-1.11.3.min.js:2)
at kboard_selected_media_insert (?action=kboard_media&board_id=1&media_group=5aab77e6b6cae&content_uid=:130)
at HTMLAnchorElement.onclick (?action=kboard_media&board_id=1&media_group=5aab77e6b6cae&content_uid=:65)
플러그인은 케이보드만 빼고 모두 비활성화하고 했는데도 삽입이 안됩니다.
테마도 워드프레스 기본 테마로 해봤는데도 삽입이 안됩니다.
텍스트 모드에서 KBoard 미디어 추가는
FTP로 접속해서 /wp-content/plugins/kboard/template/js/script.js 파일에
아래의 코드를 찾아서
function kboard_editor_insert_media(url){
if(typeof tinyMCE != 'undefined'){
if(typeof tinyMCE.activeEditor != 'undefined'){
tinyMCE.activeEditor.execCommand('mceInsertRawHTML', false, "<img id=\"last_kboard_media_content\" src=\""+url+"\" alt=\"\">");
tinyMCE.activeEditor.focus();
tinyMCE.activeEditor.selection.select(tinyMCE.activeEditor.dom.select('#last_kboard_media_content')[0], true);
tinyMCE.activeEditor.selection.collapse(false);
tinyMCE.activeEditor.dom.setAttrib('last_kboard_media_content', 'id', '');
}
}
else if(jQuery('#kboard_content').length){
jQuery('#kboard_content').val(function(index, value){
return value + (!value?'':' ') + "<img src=\""+url+"\" alt=\"\">";
});
}
}
아래의 코드로 교체해보세요.
function kboard_editor_insert_media(url){
if(typeof tinyMCE != 'undefined' && tinyMCE.activeEditor && !tinyMCE.activeEditor.isHidden()){
tinyMCE.activeEditor.execCommand('mceInsertRawHTML', false, "<img id=\"last_kboard_media_content\" src=\""+url+"\" alt=\"\">");
tinyMCE.activeEditor.focus();
tinyMCE.activeEditor.selection.select(tinyMCE.activeEditor.dom.select('#last_kboard_media_content')[0], true);
tinyMCE.activeEditor.selection.collapse(false);
tinyMCE.activeEditor.dom.setAttrib('last_kboard_media_content', 'id', '');
}
else if(jQuery('#kboard_content').length){
jQuery('#kboard_content').val(function(index, value){
return value + (!value?'':' ') + "<img src=\""+url+"\" alt=\"\">";
});
}
}
추후 위의 코드를 업데이트에 반영하겠습니다.
안녕하세요~^^
에러 메시지로 보면 TinyMCE 에디터 쪽 문제가 확실하긴 합니다.
다만 에러가 나는 원인이 다양해서 저희도 직접 확인을 해봐야 도움 드릴 방법을 찾아볼 수 있겠습니다.
비회원으로 테스트해볼 수 있는 페이지 주소 알려주시겠어요?
저희 쪽에서는 문제를 찾지 못할 수 있어서 실제 문제 되는 페이지에서 확인해봐야 할 듯합니다.
그리고 기본 테마에서도 같은 문제가 발생된다고요?
테마 이름을 알려주시겠어요?
고맙습니다.
테마는 워드프레스 설치하면 있는 기본 테마들에서도 텍스트 모드에서 위의 오류를 보실 수 있습니다.
1. 오류를 다시 테스트 해보니까 워드프레스 TinyMCE 에디터에서요, 비주얼/텍스트가 있잖아요,
텍스트 모드에서 하면 위와 같이 에러가 납니다.
비주얼 모드에서는 삽입 잘 되구요.
텍스트 모드에서는 삽입이 안되게 막아놓으신건가요? 선택, 업로드, 삭제, 창닫기는 잘 됩니다. 삽입만 안됩니다.
2. 회원들이 워드프레스TinyMCE 에디터를 기본 사용시 비주얼 모드로 하려면 어떻게 해야되나요?
안녕하세요.
1. 텍스트 모드에서의 문제는 저희가 좀더 깊이 살펴봐야 할 듯합니다.
원인을 찾아보겠습니다.
2. 아래 코드를 테마의 functions.php 파일에 추가해보세요.
강제로 비주얼 모드가 표시됩니다.
add_filter('wp_default_editor', 'my_wp_default_editor', 10, 1);
function my_wp_default_editor($richedit){
return 'tinymce';
}
wp_default_editor 필터에대한 자세한 설명은 아래 링크를 확인해주세요.
https://developer.wordpress.org/reference/hooks/wp_default_editor/
고맙습니다.