구글 소형 국기 번역 위젯 만들기 - How to Create Google Mini Flag Translating Widget

[한 줄 짜리 소형 국기 번역 위젯]

참고 : 일쌤 온라인을 방문하는 외국인 정보는 아래의 사이트를 통해 얻을 수 있었다.

http://flagcounter.com/more/dJe8

 

 

<소스 코드>

 

<center>
<div style="border:1px solid #ccc;padding:10px 0px 3px 0px;text-align:center;background-color:none;min-width:235px; margin: 5px 0 5px 0;">
<div align="center" style="width:auto;">

 

 

<a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=ko%

7Cen&hl=en&ie=UTF8'); return false;"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Google-Translate-korean to English"

src="http://www.printableworldflags.com/icon-flags/24/United%20States%20of%20America.png" height="24"></a>

 

<a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=ko%

7Cvi&hl=en&ie=UTF8'); return false;"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Google-Translate-korean to Vietnamese"

src="http://www.printableworldflags.com/icon-flags/24/Viet%20Nam.png" height="24"></a>

 

<a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=ko%7Czh-

CN&hl=en&ie=UTF8'); return false;"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Google-Translate-Chinese (Simplified)"

src="http://www.printableworldflags.com/icon-flags/24/China.png" height="24"></a>

 

<a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=ko%

7Cja&hl=en&ie=UTF8'); return false;"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Google-Translate-korean to Japanese"

src="http://www.printableworldflags.com/icon-flags/24/Japan.png" height="24"></a>

 

<a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=ko%

7Cth&hl=en&ie=UTF8'); return false;"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Google-Translate-korean to Thai"

src="http://www.printableworldflags.com/icon-flags/24/Thailand.png" height="24"></a>

 

<a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=ko%

7Cfr&hl=en&ie=UTF8'); return false;"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Google-Translate-korean to French"

src="http://www.printableworldflags.com/icon-flags/24/France.png" height="24"></a>

 

<a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=ko%

7Cit&hl=en&ie=UTF8'); return false;"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Google-Translate-korean to Italian"

src="http://www.printableworldflags.com/icon-flags/24/Italy.png" height="24"></a>

 

<a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=ko%

7Cru&hl=en&ie=UTF8'); return false;"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Google-Translate-korean to Russian"

src="http://www.printableworldflags.com/icon-flags/24/Russian%20Federation.png" height="24"></a>

 

 

</div>
</div>
</center>

[출처 : http://hubpages.com/hub/Google-Translate-Mini-Flags-Widget-for-Blogger-Blog-How-to-Add-Google-Translate-Mini-Flags-Widget-to-Your-Blog ]

 

 

<코드 내용 살펴보기>

 

아래의 코드는 한국어를 일본어로 번역하는 태그이다.

ko는 '한국어', ja는 '일본어'를 뜻한다.

Google-Translate-korean to Japanese는 국기 이미지 위에 마우스 커서를 올려 놓았을 때 나타나는 팝업 메시지이다.

http://www.printableworldflags.com/icon-flags/24/Japan.png는 국기 이미지의 URL이다.

 

<a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=ko%7Cja&hl=en&ie=UTF8'); return false;"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Google-Translate-korean to Japanese" src="http://www.printableworldflags.com/icon-flags/24/Japan.png" height="24"></a>

 

 

 

<직접 위젯 만드는 방법>

 

Google Mini Flag Translating Widget.txt

1. 위의 파일을 메모장에 연다.

[영어로 번역하는 코드 부분임]

2. 앞서 설명한 것처럼 번역 대상 언어를 수정한다. (en를 원하는 언어로 변경한다. 참고로 베트남은 vi이다.)

 

3. Google-Translate-korean to English(팝업 메시지)를 변경한다.

 

4. 국기 이미지의 URL을 변경한다.

아래의 사이트에서 원하는 국가를 선택하면 다양한 크기의 국기 이미지를 구할 수 있다. 해당 이미지의 URL 주소를 복사하고 코드의 내용에 붙여 넣는다.

 

[해당 국기를 선택하고 원하는 크기의 국기 이미지의 URL을 복사한다.]

http://www.printableworldflags.com/flag-icon

 

 

5. 완성된 코드를 자신의 블로그에 위젯으로 추가한다.