VoidNoble IT Zone

한국 웹접근성 인증마크를 위한 ckeditor TAB 포커스 이동은 아래 이미지와 같아야 한다. Ckeditor 기본 TAB 포커스 이동은 1-2-14-15 순이어야하며 Shift+TAB 이동은 역순이어야 KWCAG 인증평가에 준하게 된다. Ckeditor Core 중에서는 아래의 부분이 관련되어 있다. CKEDITOR.plugins.add( 'toolbar', {...}); 구현 코드는 아래와 같다. See the Pen vEWYEb by Yeon Jun Kwak (@cezips76) on CodePen.

CKEditor를 내용 입력부분에 적용한 CMS 툴에서 어느날 내부 클라이언트 한명이 한컴 한글에서 붙여넣기 하면 글자 크기가 달라진다는 문제를 들고 왔다.일단 한글의 환경설정에서 복사&붙여넣기시 텍스트 형식으로 붙여넣기 옵션을 체크하도록 했으나 해당 문제는 여전했다.UX를 확인하려고 직접 입력 과정등을 시연해달라 했고 문제점을 파악 할 수 있었다.문제는 결론적으로 크롬 Webkit 버그 때문이었는데 한컴 한글에서 작성한 텍스트 전체를 복사 하고 CKEditor 에 붙여넣기 까지는 아무 문제 없다.CKEditor 상에서 문장의 윗부분에 필요없는 라인 제거를 위해 DEL 키나 Backspace 키를 누르는 순간 (이 앞의 P 태그 제거하기 위해 Backspace 누름)문장문장위와같이 쓸데없는 태그가 생성된..

회사 제작부에서 내가 제작한 집배신을 통해 DTP 작업을 해 왔었다.기존에 기자들이 글 작성시 본문은 textarea로 했다가2주 전 ckeditor로 바꿨다.신문이 나왔는데 어떤 기사의 특정 문장 뒤에 - 가 함께 인쇄되어 나왔다.Classic MAC 9 의 QuarkXpress 3.3에서는 공백문자가 아닌 공백같은 문자로 보였고그것을 텍스트로 긁어와서 윈도우의 텍스트 편집기로 봤더니아무 문자도 없게 보이는데 키보드 커서를 움직이면 한 컬럼 움직이는것이바이트로는 있는것이엇기에Hex 에디터로 열어봤더니80으로 보였다.이것을 문자열로 바꾸어보니 € 문자였는데 윈도우 텍스트 편집기에서도블럭으로는 지정불가였다.그 더미 문자를 텍스트파일로 넣어 첨부해둔다. 문제가 되는 문자가 들어있는 글의 ckeditor로 저..

ckeditor 디렉토리에 보면 contents.css 파일이 있다. 이것을 편집기로 열고 body 속성에 word-wrap: break-word; 를 추가해준다. 이렇게 하고 에디터에 글자를 쓰면 지정한 넓이 이상으로는 글자가 자동 줄바꿈 되어 보이고 가로 스크롤바가 나타나지 않게 된다.