웹마스터 팁
XE에 맞춤법 검사기를 링크해보자!
2009.05.14 18:05
우선 이 기능은 http://speller.cs.pusan.ac.kr 에서 바로 사용이 가능한 맞춤법 검사기를 XE에서 링크가 되도록 수정하였습니다.
처리 방법은
1. 게시물 작성(댓글 작성)
2. 맞춤법 검사 클릭
3. 게시물 post 방식으로 popup에 전달
4. EUC-KR로 문자 변환
5. <br><p> / 줄바꿈 문자를 공백으로 변환
6. textarea에 내용을 자동 입력
7. 확인
8. 결과 값 확인
위와같은 프로세스를 가지게 됩니다.
소스는 아래와 같습니다.
1. /xe/mmodules/lang/ko.lang.php
중간에 해당 소스 추가 (저는 27 라인 입니다.)
// 버튼에 사용되는 언어
$lang->cmd_board_list = '게시판 목록';
$lang->cmd_module_config = '게시판 공통 설정';
$lang->cmd_view_info = '게시판 정보';
$lang->cmd_list_setting = '목록설정';
$lang->cmd_spell = '맞춤법 검사';
2. /xe/modules/board/skins/xe_board/write_form.html
제일 아랫줄 쪽에 해당 소스 추가
<div class="fl gap1">
<!--@if($is_logged)-->
<span class="button {$btn_class}"><input type="button" value="{$lang->cmd_temp_save}" /></span>
<span class="button {$btn_class}"><input type="button" value="{$lang->cmd_load}" /></span>
<span class="button {$btn_class}"><input type="button" value="{$lang->cmd_back}" /></span>
<span class="button {$btn_class}"><input type="button" value="{$lang->cmd_spell}" /></span>
<!--@end-->
</div>
<div class="fr gap1">
<span class="button {$btn_class}"><input type="button" value="{$lang->cmd_preview}" /></span>
<span class="button {$btn_class}"><input type="submit" value="{$lang->cmd_registration}" accesskey="s" /></span>
</div>
<div class="clear"></div>
</form>
<form name="spell" method="post" target="SpellCheck" >
<input type="hidden" name="CheckText" />
</form>
<!--#include("footer.html")-->
3. /xe/modules/board/skins/xe_board/view_document.html
제일 아랫 줄 쪽에 해당 소스 추가
<div class="commentButton tRight">
<span class="button {$btn_class}"><input type="button" value="{$lang->cmd_spell}" /></span>
<span class="button {$btn_class}"><input type="submit" value="{$lang->cmd_comment_registration}" accesskey="s" /></span>
</div>
</form>
<form name="spell" method="post" target="SpellCheck" >
<input type="hidden" name="CheckText" />
</form>
<!--@end-->
( write_form.html <= 글 작성폼 // view_document.html <== 댓글 작성 폼 // 두 파일 모두 추가합니다.)
4. /xe/common/js/common.js
line 668 함수 추가
function doDocumentSpellCheck(obj){
var fo_obj = obj;
while(fo_obj.nodeName != "FORM") {
fo_obj = fo_obj.parentNode;
}
if(fo_obj.nodeName != "FORM") return;
var editor_sequence = fo_obj.getAttribute('editor_sequence');
var content = editorGetContent(editor_sequence);
var sf = document.spell;
var st = sf.CheckText;
st.value = content;
var wins = "about:blank";
window.open(wins,'SpellCheck','width=450,height=800,scrollbars=yes');
sf.target = 'SpellCheck';
sf.action = '/spellCheck.php'
sf.submit();
}
5. spellCheck.php 파일 생성
<?
$content = $_REQUEST['CheckText'];
$content = iconv("UTF-8","EUC-KR", $content);
$content = str_replace("<BR>","\r\n",strtoupper($content));
$content = str_replace("<P>","\r\n\r\n",strtoupper($content));
$content = str_replace("&NBSP;"," ",strtoupper($content));
$content = strip_tags($content);
?>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;CHARSET=ksc5601"/>
<style type="text/css">
/* 개발자 도구로 작성. 원본 파일을 정확하게 표현한 것이 아닐 수도 있습니다*/
A:link {
COLOR: slateblue; TEXT-DECORATION: underline
}
A:active {
COLOR: slateblue; TEXT-DECORATION: underline
}
A:visited {
COLOR: slateblue; TEXT-DECORATION: underline
}
A:hover {
COLOR: blue; TEXT-DECORATION: none
}
TD {
TEXT-ALIGN: center; FONT-FAMILY: 굴림; FONT-SIZE: 9pt
}
TEXTAREA {
SCROLLBAR-ARROW-COLOR: #ffe384; BORDER-BOTTOM: #f2b704 1px solid; BORDER-LEFT: #f2b704 1px solid; SCROLLBAR-FACE-COLOR: #fffaef; BACKGROUND-COLOR: #fffaef; PADDING-LEFT: 2pt; PADDING-RIGHT: 2pt; SCROLLBAR-DARKSHADOW-COLOR: #fffaef; SCROLLBAR-HIGHLIGHT-COLOR: #f2b704; COLOR: #333333; SCROLLBAR-SHADOW-COLOR: #f2b704; BORDER-TOP: #f2b704 1px solid; SCROLLBAR-TRACK-COLOR: #fffaef; BORDER-RIGHT: #f2b704 1px solid; SCROLLBAR-3DLIGHT-COLOR: #fffaef; PADDING-TOP: 2pt
}
.but {
BORDER-BOTTOM: #f2b704 1px solid; BORDER-LEFT: #f2b704 1px solid; BACKGROUND-COLOR: #fffaef; WIDTH: 60px; HEIGHT: 21px; COLOR: #333333; BORDER-TOP: #f2b704 1px solid; CURSOR: hand; BORDER-RIGHT: #f2b704 1px solid; PADDING-TOP: 1px
}
</style>
<script type="text/javascript">
function init() {
window.resizeTo(450,800);
var node = opener.editorPrevNode;
}
function isEnter(key) {
keyValue = (navigator.appName=='Netscape') ? key.which : key.keyCode;
if (keyValue==13 && key.ctrlKey ) {
this.form.submit();
}
}
</script>
</head>
<body>
<form name="form" action="http://speller.cs.pusan.ac.kr/WebSpell_ISAPI.dll?Check" method="post">
<TEXTAREA name=text1 rows=45 cols=55 STYLE = "ime-mode:active"><?=$content?></TEXTAREA><p>
<input type="submit" value="확인하기" class="but" title="ctrl-enter">
</form>
</body>
</html>
이걸로 끝!!
회사 업무적인 글을 게시할때는 오타 나면 지적을 많이 당해서 연동해 봤습니다;
댓글 2
-
띵야
2009.05.15 21:58
-
YO-DA
2009.07.08 19:20
spellCheck.php 파일 위치 시킬 곳은 어디인가요?
참 좋은 팁이군요^^ 1차 시도 실패하였습니다^^
( write_form.html <= 글 작성폼 // view_document.html <== 댓글 작성 폼 // 두 파일 모두 추가합니다.)도 무슨 말씀이신지~
쓰기에 따라 상당히 좋은 팁을 올려주셨네요...
제가 쓸 일은 없지만, 애써 주심에 추천 드립니다.