블로그스팟 에디터 개조 스크립트 만들기 - 표 생성 및 설정 / 썸네일 지정 / 모든 이미지 원본 크기 버튼

지난 번에 내가 작성한 블로그스팟 에디터 개조 스크립트(링크)는 그저 에디터의 가로 폭을 확장하고, 구글 문서도구로 가는 버튼 하나만 추가했을 뿐이었다.
그러나 이번에는 표 생성 및 설정 기능과 썸네일 지정. 그리고 모든 이미지를 원본 크기로 바꾸는 버튼까지 추가하였다. 여기까지 추가하니 스크립트 줄도 참 많이 길어졌다.
사실 이렇게 만들어 놓아도 사용할 사람은 아마 나밖에 없을 것이다... 하지만, 만약을 위해 아래에 스크립트의 기능을 설명해둔다.



1. 표 생성

에디터의 '새 글 작성 보기'에서 느낌표 + 표 라고 명령어를 입력한다.
그러면 최대 폭, 행, 열을 지정하라는 대화상자가 뜬다.
입력하고 삽입 누르면 명령어를 입력한 자리에 표가 삽입되었을 것이다.



2. 표 설정


에디터에 있는 표의 셀에 커서를 놓은 상태로, 마우스 오른쪽 클릭을 하면 대화 상자가 열린다.

* 행 삽입 / 열 삽입 : 커서가 놓여진 셀의 상하좌우에 행 또는 열이 삽입된다.
* 현재 행 / 열 삭제 : 커서가 놓여진 셀의 행 또는 열이 삭제된다.
* 현재 표 삭제 : 커서가 놓여진 표 전체가 삭제된다.

* 오른쪽 / 아래쪽으로 셀 병합 : 오른쪽 또는 아래쪽으로 인접한 셀을 병합한다. (단, 오른쪽 병합과 아래쪽 병합은 중첩해서 쓸 수가 없다. 내가 기술이 부족해서...)

* 셀 나누기 : 병합된 셀을 모두 풀고 원래대로 되돌린다. 되돌리는 기준은 1행의 열, 1열의 행 개수를 따른다.

* 현재 셀의 폭 설정 : 1행에 있는 셀에서만 작동하며, 텍스트 상자에 폭(width) 값을 입력하고 버튼을 누르면 된다.

* 현재 표의 폭 설정 : 텍스트 상자에 폭(width) 값을 입력하고 버튼을 누르면, 선택한 셀이 속한 표의 전체 폭이 변경된다.



3. 썸네일 지정

에디터의 '새 글 작성 보기'에서 느낌표 + 썸네일 이라고 명령어를 입력한다.
그러면 썸네일로 쓸 이미지의 URL을 지정하라는 창이 뜬다. URL을 입력한 뒤 삽입 버튼을 누르면 해당 이미지가 썸네일로 지정될 것이다.
이미지의 URL 주소는 에디터 상에 있는 이미지를 마우스 오른쪽 클릭 - '이미지 주소 복사' 누르면 획득할 수 있다.



4. 모든 이미지 원본 크기로 바꾸기

에디터 화면 오른쪽 위에 있는 '모든 이미지 원본 크기로' 버튼을 누르면, 에디터 상에 첨부되어 있는 모든 이미지가 원본 크기(s0)로 바뀐다.
(단, 이 기능은 '컴퓨터에서 업로드' 기능으로 첨부한 이미지에서만 작동한다.)



5. 다운로드 및 설치방법

다운로드 링크 : Github의 Gist

위 링크로 들어간 뒤, 내용을 전부 복사해서 Tampermonkey 스크립트에 붙여넣으면 된다. Tampermonkey 부가기능은 여기에서 설치할 수 있다.

* 새로 설치하는 경우 :
Tampermonkey 아이콘 - 새 스크립트 만들기 - 기존의 내용 전부 삭제하고 위의 내용 복붙 - '파일'의 디스켓 모양 저장 버튼 클릭

* 업데이트하는 경우 :
Tampermonkey 아이콘 - 대시보드 - Blogspot Editor... 어쩌구 항목 클릭 - 기존의 내용 전부 삭제하고 위의 내용 복붙 - '파일'의 디스켓 모양 저장 버튼 클릭

* 버전 변동 사항 : 
0.2 - 표 기능 / 썸네일 지정 기능 등 추가.
0.21 - 셀의 폭 지정 기능 추가.
0.22 - 표의 폭 지정 기능 추가.
0.23 - TrustedHTML 오류 로그때문에 렉 걸리는 문제 일부 개선.
0.24 - 렉 개선을 위해 콘솔 오류 로그 주기적으로 삭제 도입. bind를 모두 on으로 변경.
0.25 - 클릭 시 실행되는 함수를 최초 한 번과 에디터 이탈 후 재접속 시 한 번만 실행되도록 변경 / 스크립트 미작동 시 fix하는 버튼 추가. 게시물 목록/새 글 작성으로 에디터에 진입할 시 일부 기능이 작동하지 않는 문제 최대한 수정.
0.26 - 간편한 댓글 확인 기능 추가.
0.27 - '모든 이미지 원본 크기로' 버튼이 표 태그 속 이미지도 크기·위치 수정 처리를 하도록 변경. (Litespot 스킨 기준)
0.28 - 알림 글상자 기능 추가. ('느낌표 + 알림' 이라고 입력 시 알림 글상자로 치환)




6. 주의사항

위에서 설명한 기능을 사용한 뒤 바로 '업데이트' 버튼을 누를 경우 내용이 반영되지 않습니다.
무언가 추가로 글을 더 쓰시거나, 에디터 아무 공간에서 스페이스 한 번 치고 백스페이스 한 번 치세요. 그래야 제대로 인식이 이루어집니다.
명령어가 동작하지 않으면 새로고침 한 뒤 다시 해보세요.
간혹 버튼을 눌러도 묵묵부답인 경우가 있습니다. 그럴 때는 버튼을 연타해보세요.

그럼 이만...

댓글 쓰기

다음 이전