무료 웹에디터, CKEditor, 위지윅 HTML 에디터 다운로드 및 설치 방법

무료 웹에디터, HTML 에디터, CKEditor.. 위지윅 편집 방식 및 소스 편집 방식 지원.. 생각보다 쓸만하고 괜찮은데?

 

웹 프로그래밍 실력을 향상시키기 위해선 직접 손으로 타이핑하면서 코딩을 하는 것이 좋다고 합니다. 저 역시 이 말에 공감합니다.

 

그러나 저는 전문적인 프로그래머도 아니고 이것으로 밥 벌어 먹고 살 것도 아니다 보니 반복적으로 사용되는 간단한 HTML 태그들을 일일이 타이핑하려니 꽤나 귀찮고 성가시더라고요. ㅋㅋ

 

더욱이 코딩한 소스가 짧을 때는 문제가 없지만 길어질 때는 너무 복잡해서 찾고자 하는 부분이 눈에 잘 들어오지 않아서 너무 불편하더라고요.

 

뭐.. 실력이 허접하다 보니 이건 어쩔 수 없이 겪는 현상인가 봅니다. ㅋㅋ

 

그래서 저는 HTML 문서 작업 시 항상 위지윅 에디터를 애용하고 있답니다. ^^

 

제가 주로 사용하고 있는 것은 ‘나모 웹에디터 5‘라는 국산 프로그램인데요.

 

이게 나온지 꽤 오래된 프로그램인 것으로 아는데요. 정확히는 모르겠으나 아마 나온지 10년은 넘지 않았나 싶네요.

 

오프라인 세상에서 10년이면 강산도 변한다고 하는데 눈부신 발전과 변화를 보이는 온라인 IT세상은 그 정도가 더 심할 거 아니겠어요?

 

그래서, 최신 웹표준이 적용된 무료 위지윅 에디터를 찾아 보았는데요. 나모 웹에디터 5를 대체할 만큼 딱히 마음에 끌리는 건 없더군요.

 

그래서, 인터넷에 돌아댕기는 최신 나모 웹에디터를 찾아보았는데요. 인터넷에 돌아댕기는 것 중에서는 나모 웹에디터 2008 버전이 최신이더라고요.

 

그런데, 이건 1년 마다 제품키와 시리얼을 구매해서 사용해야 되는 시간 제한이 걸린 제품이더군요.

 

한 번도 아니고 매년 제품키와 시리얼 구매를 위해 한 두 푼도 아닌 비용을 지불해야 될 것을 생각하니 엄두가 안나더군요.

 

더군다나 2015년도에 출시된 최신 웹표준 규칙이 적용된 제품도 아니구요.

 

프로그래밍 작업으로 밥 벌어 먹고 사는 전문 프로그래머도 아닌 저의 입장에서 투자 대비 효율을 생각해 볼 때 사치이며 낭비라는 판단이 내려지더군요.

 

그래서 눈높이를 낮춰서 무료로 배포하고 있는 위지윅 웹에디터는 없을까 찾아봤더랬죠.

 

역시 눈높이를 낮추니 그럭저럭 쓸 만한 무료 웹에디터들이 몇 가지 눈에 띄네요.

 

그중에서 저는 ‘CKEditor‘를 사용하기로 했어요. 우선 에디터 디자인도 그럴싸해 보였고요. ㅎㅎ

 

웹호스팅에 그누보드 설치해서 사용하면서 CKEditor라는 이름을 종좀 본 탓인지 눈에 익숙하더라고요. ㅋㅋ

 

그래서 일단 다운로드 받아서 설치해 보자는 생각에 별 기대 없이 제 웹호스팅 계정에 업로드 해봤는데요.

 

오~ 오~ 별 기대를 안해서 그런지 몰라도 그럭저럭 쓸 만하다는 생각이 들더군요.

 

참고로 자신의 컴퓨터에 서버 구축하시면 웹호스팅 이용하지 않고 자신의 컴퓨터에 설치하셔도 됩니다.

 


CKEditor 샘플 페이지

 

위 그림은 다운로드 받은 CKEditor 파일에 포함되어 있는 샘플 페이지 모습이에요.

 

CKEditor 폴더를 통째로 업로드 하셨다면 ‘https://자신의 웹호스팅 계정/ckeditor/samples/index.html’ 경로에 위치해 있어요.

 

위 그림에서 빨간색 사각형 부분 보이시죠? 그것을 클릭하면 에디터가 브라우저 전체화면으로 확장됩니다.

 


CKEditor 브라우저 전체 화면 확장

 

확장된 모습은 위 그림과 같네요. 디자인이 제법 그럴싸하죠? 기본적으로 위지윅 편집 화면인데요. 위 그림의 좌측 상단 부분에 보시면 [ 소스 ] 버튼이 보이실 거에요.

 

그것을 클릭하면 소스 편집 화면으로 전환됩니다. 다시 한 번 더 클릭하면 위지윅 편집 화면으로 전환되어요.

 

CKEditor 다운로드

 


CKEditor 제작사 홈페이지에서 다운로드 받기

 

제작사 홈페이지에 접속하면 위 그림과 같이 우측 상단에 ‘Download’ 버튼이 보이실 거에요. 이것을 클릭하세요.

 


CKEditor Full Package 다운로드 받기

 

‘Full Package’ 선택하신 후 그 아래에 있는 ‘Download CKEditor’ 버튼을 클릭하세요.

 


CKEditor 다운로드 받은 파일은 압축파일

 

다운로드 받은 위치로 가보면 압축 파일 하나가 보이실 거에요.

 

이제 압축을 푸신 후 이것을 자신의 웹호스팅 계정에 업로드합니다. 자신의 컴퓨터에 서버를 구축하셨다면 그곳으로 이동시키면 될테구요.

 


카페24 웹호스팅 계정에 CKEditor 폴더 통째로 업로드

 

저는 카페24 웹호스팅 계정이 있기에 그곳에 압축을 푼 파일들을 폴더 통째로 업로드 하였습니다.

 

‘../ckeditor/samples/’ 디렉토리 내에 index.html 파일이 있습니다. 여기로 접속하면 앞에서 보셨더 샘플 페이지가 나타납니다.

 

샘플 페이지를 참고하셔서 자신의 입맛에 맞게 뜯어 고칠 수도 있겠지만 저는 전체화면 확장 눌러서 그냥 사용해도 쓸 만하고 괜찮더라고요. ㅎㅎ

답글 남기기

이메일 주소는 공개되지 않습니다. 필수 필드는 *로 표시됩니다