fckeditor, 디폴트 파일매니저에서 이미지 썸네일 보이게 하는 방법

2009년 8월 31일

백엔드

나는 이 방법을 사용하지 않는다. 너무 리소스를 많이 먹기 때문이다. 파일이 수십개씩 폴더에 들어있는 상황에서 모든 이미지를 로드하는 것은 별로 안 좋은 것 같다.(2010.3.14 추가)

—————-

먼저 말해두지만 이 방법은 편법이다. 사용할 사람만 사용하기 바란다.

fckeditor의 버전은 2.6.4.1이다.

이 방법을 사용하고 나면 다음과 같이 파일매니저 화면이 변한다.

들어있는 파일이 이미지일 경우에는 좌측에 썸네일이 뜬다.

그러나 ㅡㅡ;; 그냥 파일일 경우에는 십중팔구 깨질 것이다. 아마도 엑박이 뜰텐데, 그걸 감수하고 이 방법을 사용하겠다면 좋다.

(난 그렇게 사용하고 있다. 이미지 썸네일을 보여 주는 플러그인을 찾았는데 잘 작동하지 않고, 그걸 잘 커스터마이징하기엔 내 실력이 부족하고… 그래서 아쉬운대로 대충 고쳐서 사용하기로 했다.)

한 가지 더 말하자면, 썸네일을 생성하는 게 아니라 img 태그에서 그냥 줄여버린 것이다. 이게 의미하는 바는? 파일매니저 폴더에 있는 그림파일을 전부 다운로드하는 결과를 낳는다는 것이다. 이미지 파일 10여개 있으면 상관 없겠지만, 1000개쯤 있으면 그걸 모두 다운로드해야 썸네일이 보인다는 말씀. 그러니까 그런 경우에도 이 방법을 사용하면 안 된다.

서두가 길었다. 방법은 간단하다.

fckeditor\editor\filemanager\browser\default\frmresourceslist.html 을 연다.

아래 코드를 찾는다.

oListManager.GetFileRowHtml = function( fileName, fileUrl, fileSize )<br />{<br />   (생략)<br />}

코드를 이렇게 고친다.

oListManager.GetFileRowHtml = function( fileName, fileUrl, fileSize )<br />{<br />	// Build the link to view the folder.<br />	var sLink = '&lt;a href="#" onclick="OpenFile(\'' + ProtectPath( fileUrl ) + '\');return false;"&gt;' ;<br />	// Get the file icon.<br />	var sIcon = oIcons.GetIcon( fileName ) ;<br />	return '&lt;tr&gt;' +<br />			'&lt;td width="70"&gt;'+sLink+'&lt;img src="' + ProtectPath( fileUrl ) + '" width="70" border="0"&gt;&lt;\/a&gt;' +<br />			'&lt;\/td&gt;' +<br />			'&lt;td width="16"&gt;' +<br />				sLink +<br />				'&lt;img alt="" src="images/icons/' + sIcon + '.gif" width="16" height="16" border="0"&gt;&lt;\/a&gt;' +<br />			'&lt;\/td&gt;&lt;td&gt;&amp;nbsp;' +<br />				sLink +<br />				fileName +<br />				'&lt;\/a&gt;' +<br />			'&lt;\/td&gt;&lt;td align="right" nowrap&gt;&amp;nbsp;' +<br />				fileSize +<br />				' KB' +<br />		'&lt;\/td&gt;&lt;\/tr&gt;' ;<br />}

원래대로 돌리고 싶다면? 69,70번째 줄을 지우거나 주석처리하면 된다.

끝.

👇 댓글 바로 가기

👇 카테고리 글 목록

백엔드