웹마스터 팁
page_full_width">
게시판 글쓰기에서 자동링크의 target을 _blank로 일괄 적용
2011.08.23 17:21
게시판에 url을 쓰면 <a href="url">내용</a> 처럼 기본으로 자동 링크가 걸립니다.
문제는 target이 지정되어 있지 않아 해당 url을 클릭하면 현재 창에 뜬다는 것이죠. 전 이게 불편하더군요.
[HTML 편집기]로 직접 target을 지정하거나, URL 버튼을 이용해도 되지만, url이 많을 경우 버겁습니다. 귀찮기도 하구요. -_-;
그래서, XE 기본 편집기인 'xpresseditor'를 수정했습니다. 혹시나, 필요하신 분이 계실까 해서 올려 봅니다.
1. 에디터의 'URL' 버튼을 클릭하면 아래 그림처럼 나타나며, '_blank' 버튼을 클릭하면 본문 내용에 있는 A 태그 중에서 target이 지정되지 않은 링크에 target="_blank" 를 설정합니다.
2. 수정한 파일
|
3. editor.html
4. default.css
./modules/editor/skins/xpresseditor/img/ 에 'btn_layer_blank.gif' 버튼 이미지를 만들어 업로드.
- .xpress-editor .tool .layer .btn_area button.confirm{ width:38px; height:21px; background:url(../img/btn_layer_confirm.gif) no-repeat;}
- .xpress-editor .tool .layer .btn_area button.cancel{ width:38px; height:21px; background:url(../img/btn_layer_cancel.gif) no-repeat;}
- .xpress-editor .tool .layer .btn_area button.blank{ width:41px; height:21px; background:url(../img/btn_layer_blank.gif) no-repeat;}
5. Xpress_Editor.js
- xe.XE_Hyperlink = $.Class({
- name : "XE_Hyperlink",
- $init : function(elAppContainer){
- this._assignHTMLObjects(elAppContainer);
- this.sRXATagMarker = this.sATagMarker.replace(/\//g, "\\/").replace(/\./g, "\\.");
- },
- _assignHTMLObjects : function(elAppContainer){
- this.oHyperlinkLayer = $("DIV.xpress_xeditor_hyperlink_layer", elAppContainer).get(0);
- this.oLinkInput = $("INPUT[type=text]", this.oHyperlinkLayer).get(0);
- this.oBtnConfirm = $("BUTTON.confirm", this.oHyperlinkLayer).get(0);
- this.oBtnCancel = $("BUTTON.cancel", this.oHyperlinkLayer).get(0);
- this.oBtnBlank = $("BUTTON.blank", this.oHyperlinkLayer).get(0); // add by 무얼까 mooin@hitel.net 2011-8-23
- this.oCbNewWin = $("INPUT[type=checkbox]", this.oHyperlinkLayer).get(0);
- },
- $ON_MSG_APP_READY : function(){
- this.oApp.exec("REGISTER_HOTKEY", ["ctrl+k", "XE_TOGGLE_HYPERLINK_LAYER", []]);
- this.oApp.registerBrowserEvent(this.oBtnConfirm, "mousedown", "XE_APPLY_HYPERLINK");
- this.oApp.registerBrowserEvent(this.oBtnCancel, "mousedown", "HIDE_ACTIVE_LAYER");
- this.oApp.registerBrowserEvent(this.oBtnBlank, "mousedown", "XE_MAKE_BLANK"); // add by 무얼까 mooin@hitel.net 2011-8-23
- this.oApp.registerBrowserEvent(this.oLinkInput, "keydown", "EVENT_XE_HYPERLINK_KEYDOWN");
- this.oApp.exec("REGISTER_UI_EVENT", ["hyperlink", "click", "XE_TOGGLE_HYPERLINK_LAYER"]);
- },
- $ON_XE_TOGGLE_HYPERLINK_LAYER : function(){
- // hotkey may close the layer right away so delay here
- this.oApp.delayedExec("TOGGLE_TOOLBAR_ACTIVE_LAYER", [this.oHyperlinkLayer, null, "XE_RESET_HYPERLINK_LAYER", []], 0);
- },
- $ON_XE_RESET_HYPERLINK_LAYER : function(){
- this.oApp.exec("FOCUS", []);
- this.oSelection = this.oApp.getSelection();
- var oAnchor = this.oSelection.findAncestorByTagName("A");
- this.oCbNewWin.checked = true; // 무얼까가 'true'로 수정 2011-08-23
- if(oAnchor){
- this.oSelection.selectNode(oAnchor);
- this.oSelection.select();
- var sTarget = oAnchor.target;
- if(sTarget && sTarget == "_blank") this.oCbNewWin.checked = true;
- this.oLinkInput.value = oAnchor.href?oAnchor.href:"http://";
- }else{
- this.oLinkInput.value = "http://";
- }
- this.oLinkInput.focus();
- this.oLinkInput.value = this.oLinkInput.value;
- },
- $ON_XE_APPLY_HYPERLINK : function(){
- var sURL = this.oLinkInput.value, newWin = this.oCbNewWin.checked, sTarget = newWin?'_blank':'';
- this.oApp.exec("FOCUS", []);
- this.oSelection = this.oApp.getSelection();
- if(this.oSelection.collapsed){
- var str = "<a href=" + sURL + "' target="+sTarget+">" + sURL + "</a>";
- this.oSelection.pasteHTML(str);
- }else{
- var nSession = Math.ceil(Math.random()*10000);
- var sMarker = this.sATagMarker+nSession;
- var arg = ( sURL == "" ? ["unlink"] : ["createLink", false, sMarker+sURL] );
- this.oApp.exec("EXECCOMMAND", arg);
- try { this.oSelection.setFromSelection() }catch(e){};
- var oDoc = this.oApp.getWYSIWYGDocument();
- $(oDoc.body.getElementsByTagName("A"))
- .filter('[href^="'+sMarker+'"]')
- .attr('href', function(){
- var rx = new RegExp('^'+sMarker.replace(/([\.\\])/g, '\\$1'), 'i');
- if (sTarget) $(this).attr('target', sTarget);
- else $(this).removeAttr('target'+ ');
- return this.href.replace(rx, '');
- });
- }
- this.oApp.exec("HIDE_ACTIVE_LAYER");
- setTimeout($.fnBind(function(){try{this.oSelection.select()}catch(e){}}, this), 0);
- },
- /* add by 무얼까 mooin@hitel.net 2011-8-23
- * a 태그에 target 속성이 없으면 target="_blank"로 설정
- */
- $ON_XE_MAKE_BLANK : function(){
- var doc = this.oApp.getWYSIWYGDocument();
- var oA = doc.getElementsByTagName("a");
- for(var i=0;i<oA.length;i++) {
- if( !oA[i].hasAttribute('target') ) {
- oA[i].setAttribute('target', '_blank');
- }
- }
- this.oApp.exec("HIDE_ACTIVE_LAYER");
- },
- _validateURL : function(sURL){
- return /^(http|https|ftp|mailto):(?:\/\/)?((\w|-)+(?:[\.:@](\w|-))+)(?:\/|@)?([^"\?]*?)(?:\?([^\?"]*?))?$/.test(sURL);
- },
- $ON_EVENT_XE_HYPERLINK_KEYDOWN : function(oEvent){
- if (oEvent.keyCode == 13){
- this.oApp.exec("XE_APPLY_HYPERLINK");
- oEvent.preventDefault(); oEvent.stopPropagation();
- }
- }
- });
6. 추가로 위 하이퍼링크 설정 창의 '새 창으로' 체크박스가 기본으로 체크되어 있게 수정했습니다.
위 Xpress_Editor.js 파일 소스 중 4673 라인 참고
댓글 0
제목 | 글쓴이 | 날짜 |
---|---|---|
(CSS) IE8용 웹조각 기능
![]() | Simulz | 2009.03.26 |
XE위키 모듈: 숫자 문서의 짧은 주소 문제와 미디어위키 문법 사용시 내부링크 문제 해결하기 | Gunmania | 2016.02.12 |
가상사이트 페이지별 개별 레이아웃 적용하기 | Xiso | 2016.01.31 |
warning: call time pass by reference 에러 해결 방법 [6] | ezi | 2011.07.28 |
리눅스 10원짜리 팁 - history 명령어 응용 | paraduxx | 2016.01.12 |
리눅스 10원짜리 팁 - 탭 키 쓰십니까 ? | paraduxx | 2016.01.12 |
회원가입폼 기본항목에 안내문구 넣기 | paraduxx | 2016.01.11 |
XE와 마인크래프트 서버 화이트리스트 연동하기
[9]
![]() | 연가시먹었다 | 2012.08.25 |
일반 게시판에서 익명 선택하여 작성하기 [2] | POWERXE | 2015.12.27 |
메뉴활성화에 따라 원하는 위치에 레이어 넣고 바꾸기.. 왼쪽 플래시 메뉴 메뉴따라서 바꾸기 [4] | 만쓰별(정만) | 2009.01.24 |
비밀글 이여도 갤러리나 웹진형에서, 썸네일이나 요약 부분이 나타나게 수정하려면.. | sejin7940 | 2015.12.23 |
상단에 스르르~ 닫기 가능한 배너 달기
[30]
![]() | 야옹잉 | 2014.06.20 |
빠른 글 쓰기: 메인 페이지에서 글 쓰기
[1]
![]() | 윈컴이 | 2015.12.09 |
통합검색 기능에 권한 적용하기 (완전 차단 필요할 때)
[9]
![]() | 모노소프트 | 2012.04.30 |
관리자만 볼 수 있는 로그인 기록 페이지 만들기 | 퍼니엑스이 | 2015.12.07 |
rsync 와 ssh root 접속을 막고 인증키로만 백업하기 | 마루디자인 | 2015.11.25 |
리눅스 백업 1.0 | ibin | 2015.11.23 |
이제는 유튜브동영상 손쉽게 다운로드 받으세요 ミ:つÞ [7] | 딴죽을거는남자 | 2015.11.02 |
파시ㅇ 예제입니다.
[3]
![]() | 유창화 | 2015.11.12 |
CentOS PHP TS/NTS 모드 설치 방법 | 마루디자인 | 2015.11.09 |