Tag Archives: link

WordPress Plugin중에 Link to Post 소개

예전에 WordPress Plugin 중에서 Posting 할때, 예전 Posting을 참고하여 Link를 만들어 주는 Plugin으로 Simple Link를 이용하였었습니다. 간단하게 Searching도 되고, 본문중에 Link를 바로 삽입하게 해주니 글을 쓸때, 무척 편리한 Plugin 이었습니다.

그런데, 최근 WordPress를 이용 도중에 AJAX가 동작하지 않는 등의 문제가 있어 살펴 본 결과 Simple Link Plugin 이 일으키는 문제였음을 알게 되었습니다. 현재 Simple Link는 Maintenance가 되고 있지 않습니다.

다시 googling과 searching을 하여 찾아 낸 것이 Link to Post 라는 Plugin 입니다. 위의 Simple Link와 비슷한 역할을 하면서도, 특별하게 아직까지 WordPress Admin Page들에 대한 Side Effect등의 Bug는 없는 듯 싶습니다.

사용하는 방법도 간단하게도 TinyMCE와 HTML에 버튼이 삽입이 되어 링크로 만들 부분을 Block으로 잡고, 버튼을 누르면 지난 페이지들을 Search도 할 수 있고, 최근 Post 된 목록도 보여주면서 쉽게 Link를 만들 수 있게 해 줍니다. Post 된 것만 Link로 잡는 것이 아니라, Page도 Link로 잡아주는 버튼도 있습니다.

워드프레스 플러그인: Keyword Link Plugin (V0.6) 수정

키워드에 따라 자동으로 하이퍼링크를 만들어 주는 플러그인을 찾다가 마침내, Keyword Link Plugin 1 2 를 발견했습니다.

이것은 제가 그동안 찾고 싶었던 플러그인인데요, 제가 촛점으로 맞춘 기능은 다음과 같습니다.

  • 키워드를 넣고 거기에 따른 하이퍼링크를 자동으로 추가할 것
  • UTF-8을 지원할 것
  • 새창으로 열기 옵션이 있을 것

다 좋았는데, utf-8을 완벽하게 지원하지 안는 것 같았습니다. 그래서 몇가지 수정을 했구요, 또 “EDIT” 버튼을 눌렀을 때, 제대로 옵션을 표현하지 못하는 버그도 있고 해서 수정했습니다. 이 글은 제가 수정한 것을, 첫째는 저를 위한 노트가 될 듯 싶구요, 둘째는 이 수정을 다른 분들과 공유하고자 하여 글을 올립니다.

1. 버그: 옵션을 저장할때 제대로 기록하지 않는다.

Export/Import CSV를 이용하면, 이 문제가 사라지지만, 폼을 이용하여 수정하고 추가할때는 발생하는 문제입니다. 옵션을 선택하고 이것을 저장할때, 워드프레스의 option 테이블에 잘못된 정보를 기록하는 것이 문제였습니다. 문제를 보면, 예를 들어 플러그인 세팅 페이지에서 다음과 같이 입력하면,

Wordpress keyword link plugin option selection

정보가 사실은 “0|0|1|1|0” 와 같이 되어야 하지만, 실제 저장이 “||new window|ignore case|” 이와 같이 됩니다. 그래서 다시 EDIT 버튼을 누르면, 다음과 같이 나옵니다.

bug picture when edit button is clicked.

이 문제를 해결하기 위해 bm_getvalue() 함수를 추가했구요, bm_keywordlink_savenew() 함수를 다음과 같이 수정했습니다.

function bm_getvalue($var) {
     if ($var) {
	  return "1";
     } else {
	  return "0";
     }
}

function bm_keywordlink_savenew()
{
      $links = get_option(BM_KEYWORDLINK_OPTION);

		$keyword = $_POST['keyword'];
		$link = $_POST['link'];
		$nofollow = bm_getvalue($_POST['nofollow']);
 		$firstonly = bm_getvalue($_POST['firstonly']);
 		$newwindow = bm_getvalue($_POST['newwindow']);
 		$ignorecase = bm_getvalue($_POST['ignorecase']);
 		$isaffiliate = bm_getvalue($_POST['isaffiliate']); 

		if ($keyword == '' || $link == '')
		{
		  bm_keywordlink_topbarmessage(__('Please enter both a keyword and URL'));
		  return;
		}

		if (isset($links[$keyword]))
		{
		  bm_keywordlink_topbarmessage(__('Existing keyword has been updated'));
		}

 		/* Store the link */
	  $links[$keyword] = implode('|',array($link,$nofollow,$firstonly,$newwindow,$ignorecase,$isaffiliate));
	  update_option(BM_KEYWORDLINK_OPTION,$links);
}

이 이후에는 동작을 잘 했습니다.

2. UTF-8 지원문제

2-1. readme.txt에 있는 가이드라인을 따라하기

readme.txt에 보면, 아시아 언어를 쓰기 원한다면, bm_keywordlink.php에 있는 $regEx 변수값을 수정해야 한다고 되어 있습니다. 관련된 함수는 bm_keywordlink_replace() 인데요, 거의 마지막 부분에 다음을

$regEx = '\'(?!((<.*?)|(<>]*?)>)|([^>]*?))\'s' . $case;

다음으로 수정해 줍니다.

$regEx = '\'(?!((<.*?)|(<>]*?)>)|([^>]*?))\'s' . $case;

2-2. UTF-8을 지원하기 위한 decode64 추가

이미 javascript로 decode64() 함수가 이 플러그인에 있지만, 아시아 언어와는 동작을 제대로 하지 않는 것 같습니다. 그래서, 아시아언어를 같이 지원하기 위해 다른 javascript code를 WebToolKit site에서 가져왔습니다. 다음은 그 부분입니다.

/**
*
*  Base64 encode / decode
*  http://www.webtoolkit.info/
*
**/

var Base64 = {

    // private property
    _keyStr : "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=",

    // public method for encoding
    encode : function (input) {
        var output = "";
        var chr1, chr2, chr3, enc1, enc2, enc3, enc4;
        var i = 0;

        input = Base64._utf8_encode(input);

        while (i < input.length) {

            chr1 = input.charCodeAt(i++);
            chr2 = input.charCodeAt(i++);
            chr3 = input.charCodeAt(i++);

            enc1 = chr1 >> 2;
            enc2 = ((chr1 & 3) << 4) | (chr2 >> 4);
            enc3 = ((chr2 & 15) << 2) | (chr3 >> 6);
            enc4 = chr3 & 63;

            if (isNaN(chr2)) {
                enc3 = enc4 = 64;
            } else if (isNaN(chr3)) {
                enc4 = 64;
            }

            output = output +
            this._keyStr.charAt(enc1) + this._keyStr.charAt(enc2) +
            this._keyStr.charAt(enc3) + this._keyStr.charAt(enc4);

        }

        return output;
    },

    // public method for decoding
    decode : function (input) {
        var output = "";
        var chr1, chr2, chr3;
        var enc1, enc2, enc3, enc4;
        var i = 0;

        input = input.replace(/[^A-Za-z0-9\+\/\=]/g, "");

        while (i < input.length) {

            enc1 = this._keyStr.indexOf(input.charAt(i++));
            enc2 = this._keyStr.indexOf(input.charAt(i++));
            enc3 = this._keyStr.indexOf(input.charAt(i++));
            enc4 = this._keyStr.indexOf(input.charAt(i++));

            chr1 = (enc1 << 2) | (enc2 >> 4);
            chr2 = ((enc2 & 15) << 4) | (enc3 >> 2);
            chr3 = ((enc3 & 3) << 6) | enc4;

            output = output + String.fromCharCode(chr1);

            if (enc3 != 64) {
                output = output + String.fromCharCode(chr2);
            }
            if (enc4 != 64) {
                output = output + String.fromCharCode(chr3);
            }

        }

        output = Base64._utf8_decode(output);

        return output;

    },

    // private method for UTF-8 encoding
    _utf8_encode : function (string) {
        string = string.replace(/\r\n/g,"\n");
        var utftext = "";

        for (var n = 0; n < string.length; n++) {

            var c = string.charCodeAt(n);

            if (c < 128) {
                utftext += String.fromCharCode(c);
            }
            else if((c > 127) && (c < 2048)) {
                utftext += String.fromCharCode((c >> 6) | 192);
                utftext += String.fromCharCode((c & 63) | 128);
            }
            else {
                utftext += String.fromCharCode((c >> 12) | 224);
                utftext += String.fromCharCode(((c >> 6) & 63) | 128);
                utftext += String.fromCharCode((c & 63) | 128);
            }

        }

        return utftext;
    },

    // private method for UTF-8 decoding
    _utf8_decode : function (utftext) {
        var string = "";
        var i = 0;
        var c = c1 = c2 = 0;

        while ( i < utftext.length ) {

            c = utftext.charCodeAt(i);

            if (c < 128) {
                string += String.fromCharCode(c);
                i++;
            }
            else if((c > 191) && (c < 224)) {
                c2 = utftext.charCodeAt(i+1);
                string += String.fromCharCode(((c & 31) << 6) | (c2 & 63));
                i += 2;
            }
            else {
                c2 = utftext.charCodeAt(i+1);
                c3 = utftext.charCodeAt(i+2);
                string += String.fromCharCode(((c & 15) << 12) | ((c2 & 63) << 6) | (c3 & 63));
                i += 3;
            }

        }

        return string;
    }

}
&#91;/sourcecode&#93;</pre>
또한, BMEditKeyword() 함수를 다음과 같이 수정합니다.
<pre>
function BMEditKeyword(keyword,url,nofollow,firstonly,newwindow,ignorecase,isaffiliate)
		{
 			 document.bm_keywordadd.keyword.value      = Base64.decode(keyword);
			 document.bm_keywordadd.link.value         = Base64.decode(url);
			 document.bm_keywordadd.nofollow.checked   = (nofollow==1);
			 document.bm_keywordadd.firstonly.checked  = (firstonly==1);
			 document.bm_keywordadd.newwindow.checked  = (newwindow==1);
			 document.bm_keywordadd.ignorecase.checked = (ignorecase==1);
			 document.bm_keywordadd.isaffiliate.checked= (isaffiliate==1);
			 window.location.hash = "keywordeditor";
		}

2.1 와 2.2 는 utf-8을 지원하기 위해 반드시 필요한 작업이었습니다. 이 이후에 “EDIT” 버튼을 누르면, 기존에는 아시아문자 (예:한국어)를 가져오지 못했지만, 이제는 폼으로 잘 가져오게 되네요.

이제 키워드를 등록하고 자동으로 하이퍼링크를 만들어주는 플러그인을 즐기시면 됩니다. :)

  1. Plugin Homepage: WordPress Keyword Link Plugin
  2. WordPress Plugin Page: BlogMechanics KeywordLink