블로그에 번역 버튼을 달아보자!

플래시 작품 2007/06/25 16:30
TAG , , , , , , , ,
블로그에 번역 버튼으로 활용할 수 있는 플래시를 만들었습니다. 한국어 버튼, 영어 버튼, 일본어 버튼 3개로 구성이 되어 있으며 영어 버튼과 일본어 버튼을 클릭하면 각각 영어와 일본어로 번영해주는 페이지로 이동합니다. 물론 한국어 버튼을 누르면 원래 페이지로 이동하게 됩니다. 포스팅을 하다보니 번역 사이트를 다른 곳으로 바꿀 수 있게 하는 부분도 필요할 것 같군요. 어째꺼나 번역 버튼을 홈페이지에 붙여 외국인들도 내 블로그에 있는 글도 볼 수 있도록 번역 버튼을 달아보세요. 제가 만든 것이 아니더라도 번역 버튼을 붙여볼 것을 권장합니다. 전에 포스팅 했던 북마크 모음 플래시바와 사용법은 같습니다.

[Flash] http://www.hompydesign.com/club/bookmark.swf

[Flash] http://www.hompydesign.com/club/bookmark.swf


[번역 버튼 태그]
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="180" height="60"><param name="movie" value="http://www.hompydesign.com/club/translate.swf"/><param name="flashvars" value="link=http://hompy.info/141"><EMBED pluginspage=http://www.macromedia.com/go/getflashplayer src=http://www.hompydesign.com/club/translate.swf width=180 height=60 type=application/x-shockwave-flash quality="high" FlashVars="link=http://hompy.info/141" /></object>

[개별 포스트별 번역 버튼 태그]
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="90" height="30"><param name="movie" value="http://www.hompydesign.com/club/translate.swf"/><param name="flashvars" value="link=http://hompy.info［##_article_rep_link_##］"><EMBED pluginspage=http://www.macromedia.com/go/getflashplayer src=http://www.hompydesign.com/club/translate.swf width=90 height=30 type=application/x-shockwave-flash quality="high" FlashVars="link=http://hompy.info［##_article_rep_link_##］" /></object>

[IE 에서 테투리를 안보이게 하는 태그]
스킨 편집 skin.html 의 상단 "</head>" 라는 태그 바로 위에 "<script language="javascript" src="http://factor.kr/attachment/dk46.js"></script>" 를 추가합니다.
그리고 예제 포스트 대신 다음과 같은 태그를 사용합니다.
<textarea id="flash_blog_translate［##_article_rep_link_##］" style="display:none;" rows="0" cols="0">
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="90" height="30"><param name="movie" value="http://www.hompydesign.com/club/translate.swf"/><param name="flashvars" value="link=http://hompy.info［##_article_rep_link_##］"><param name="wmode" value="opaque"><EMBED pluginspage=http://www.macromedia.com/go/getflashplayer src=http://www.hompydesign.com/club/translate.swf width=90 height=30 type=application/x-shockwave-flash quality="high" FlashVars="link=http://hompy.info［##_article_rep_link_##］" wmode=opaque /></object>
</textarea><script>document_write(document.getElementById('flash_blog_translate［##_article_rep_link_##］').value);</script>

주의)
* 빨간색 링크 주소는 운영하는 블로그 도메인으로 바꾸셔야 합니다. 그리고 "［ " 와 "］" 로 표시된 부분은 "[" 와 "]" 로 바꿔주셔야합니다.
* 파란색 태그가 없는 경우 플래시가 레이어를 통과해서 보일 수 있습니다.

[네이버 카페 메인화면에 번역 버튼 적용 태그 예제]
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="90" height="30"><param name="movie" value="http://www.hompydesign.com/club/translate.swf?link=http%3A%2F%2Fflashcafe.org"/><param name="flashvars" value="link=http://flashcafe.org"><EMBED pluginspage=http://www.macromedia.com/go/getflashplayer src="http://www.hompydesign.com/club/translate.swf?link=http%3A%2F%2Fflashcafe.org" width=90 height=30 type=application/x-shockwave-flash quality="high" FlashVars="link=http://flashcafe.org" /></object>

주의)
네이버에서는 일부 태그를 제한하는 관계로 파란색에 해당하는 파라메터(인수) 전달이 제대로 되지 않으므로 빨강색 부분에서 처럼 URL 을 통해서 값을 전달해야 합니다. URL 을 통해서 값을 전달할때 한글이나 특수문자인 경우 URL 인코딩을 해야합니다.
파란색 문장을 구글 검색창에 검색해보면 주소창에서 인코딩된 빨강색 문장 처럼 바뀌는 부분이 있습니다. "http://flashcafe.org"라는 문장을 검색해보면 주소창에 다음과 같은 경로가 보입니다.
http://www.google.co.kr/search?hl=ko&q=http%3A%2F%2Fflashcafe.org&lr=
위의 경로에서 URL 인코딩된 빨간색 부분만 가져와서 태그에서 사용합니다. 빨간색 처럼 인코딩이 되지 않은 값을 사용하는 경우 제대로 정보 전달이 안될 수 있습니다.
태그 입문자의 경우 다소 어려워 보일 수 있지만 차근 차근 따라해 보시면 완성할 수 있습니다.

[참고]
국기 이미지는 http://www.all-the-flags-of-the-world.c.la/ 에서 가져왔습니다.
사용한 구글 영어 번역기 주소
http://translate.google.com/translate?langpair=ko%7Cen&hl=ko&ie=UTF8&u=http://hompy.info/141
사용한 네이버 일어 번역기 주소
http://j2k.naver.com/j2k.php/japan/http://hompy.info/141

[Flash] http://factor.kr/attachment/dl190.swf

웹프로그래머의 홈페이지정보 블로그 http://hompy.info
트랙백 3개, 댓글 53개가 달렸습니다.

트랙백 주소 :: http://hompy.info/trackback/141

  1. Subject: [Updated]블로그에 영어,일어 번역 버튼을 넣기 위한 스크립트

    Tracked from Trivial Thoughts of Ikarus 2007/06/25 19:05  삭제

    updated 2/20/2007 아래에 올린 스크립트는 번역하기 위해 Active-x를 설치해야만하는 찜찜함이 있어서 active-x 없이 번역 가능한 사이트로 수정해서 다시 올립니다. 아무래도 일어로 번역하는 거라 한국보다는 일본 사이트에 자료가 더 많을 것 같아 일본 yahoo를 검색해보니 http://www.excite.co.jp 라는 사이트가 여러 외국어를 일본어로 자동번역하는 링크를 제공하더군요. 사용방법은 위의 스크립트와 동일합니다. <s..

  2. Subject: 블로그에 외국어 번역 (한국, 영어, 일어) 기능을 추가하자.

    Tracked from This is my story 2009/04/25 15:26  삭제

    이것은 웹프로그래머님( http://hompy.info/141 )의 홈피에 있는 내용이다. 딱히 내 홈피에 누가 많이 찾아오거나 하는건 아니지만 그래도 왠지 내 블로그 내용을 영어로 바꿔보면 어떤 내용의 영어단어가 나올지는 궁금했었는데 이참에 번역 스크립트를 만들고 공개하여주신 웹프로그래머님께 감사를...^^; 내가 플래쉬이런걸 수정을 잘 못한다. 저 오른쪽 위의 버튼의 배경을 흰색말고 투명이나 검은색으로 하고 싶은데 어떻게 수정을 해야 하는건지....

  3. Subject: 외국어 번역버튼을 달았습니다.

    Tracked from 이바구(ibagu) 2009/09/20 20:58  삭제

    웹 서핑을 하다가 설치가 간단하고 모양이 깔끔한 외국어 번역버튼이 있길래 달아 보았습니다. 위치는 오른쪽 관리자 로그인 아래 부분입니다. 우선 영어와 일어입니다. 다른 언어로 중국어 정도까지는 있었으면 좋겠는데 좀 더 연구해 보아야 하겠습니다. 클릭해 보시면 아시겠지만 구글 번역기와 네이버 일어 번역기를 쓰기 때문에 번역도 깔끔하고 이미지 버튼도 깔끔합니다. 좋은 번역기를 블로그에 달 수 있도록 방법을 공유해 주신 웹프로그래머님에게 감사를 드립니다...

댓글을 달아 주세요

  1. 강민건담 2011/11/24 07:45  댓글주소  수정/삭제  댓글쓰기

    블로그 위젯으로 사용하고 싶은데..ㅜ.ㅜ...해보니..안먹히네요.ㅜ.ㅜ.악! ㅜ.ㅜ

  2. Mikuru 2010/11/28 20:56  댓글주소  수정/삭제  댓글쓰기

    일본어도 구글을 사용할 수는 없을까요..?

  3. 마루짱 2009/10/29 22:03  댓글주소  수정/삭제  댓글쓰기

    제 블로그 구글 웹번역이 안되는데요.
    왜 그런지 알 수 있을까요??

  4. 박영수 2009/09/07 02:10  댓글주소  수정/삭제  댓글쓰기

    홈페이지에서도 가능한가요

  5. 모기야 2009/04/25 03:40  댓글주소  수정/삭제  댓글쓰기

    감사합니다~
    저도 지금 설치를 했습니다~
    덕분에 좋은 정보를 얻어가네요~ ^^

    즐거운 하루되세요~

  6. demun 2009/03/23 10:57  댓글주소  수정/삭제  댓글쓰기

    감사합니다.잘 쓰겠습니다.
    그나저나 제 블로그에도 외국사람이 많이 와서 번역버튼을 많이 사용해야 할텐테 ㅎㅎㅎㅎㅎ
    구경오세요.
    http://demun.tistory.com

  7. pmc 2009/02/01 04:24  댓글주소  수정/삭제  댓글쓰기

    감사합니다...저도 방금 달아봤는데 버튼이 안눌려서 밑에
    달아 주신 hompy.info 님 블로그 소스로 올리니까 잘되고 있습니다.
    늘 감사하게 잘 배우고 있습니다.
    새해 복 많이 받으세요..늘 건강 행복하세요..감사합니다.

  8. gooddream 2008/06/04 23:53  댓글주소  수정/삭제  댓글쓰기

    저만 그런가요??? 번역버튼을 달고 버튼을 눌러 보아도 버튼이 눌러지지 않아요...
    제가 잘못한건가요????

    • 승호/ 2008/11/02 16:20  댓글주소  수정/삭제

      저도 방금 달아봤는데 버튼이 안눌리더군요..;
      그래서 hompy.info 님 블로그 소스에서 가져와서 썼더니 되더군요..

      <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="90" height="30"><param name="movie" value="http://www.hompydesign.com/club/translate.swf"/><param name="allowScriptAccess" value="always" /><param name="flashvars" value="link=도메인 주소"><EMBED pluginspage=http://www.macromedia.com/go/getflashplayer src=http://www.hompydesign.com/club/translate.swf width=90 height=30 type=application/x-shockwave-flash quality="high" FlashVars="link=도메인 주소" /></object>


      이대로 써보세요~~

  9. JVIX 2008/05/08 17:07  댓글주소  수정/삭제  댓글쓰기

    이제서야 살펴보며 적용해보았는데요.. 이미지들은 정상적으로 나오는데 번역적용이 안되네요.. 아래코드만으로는 적용이 안되는것인지요.. 소스코드에 미숙함이 있기에.. http://jvix.com , http://jvix.tistory.com 둘다해봐도 안되는.. ^^;

    <table border=0 cellpadding=0 cellspacing=0 bgcolor=#000000><tr><td align=middle><EMBED pluginspage=http://www.macromedia.com/go/getflashplayer src=http://www.hompydesign.com/club/translate.swf width=90 height=30 type=application/x-shockwave-flash quality="high" FlashVars="link=http://jvix.com" wmode=transparent></EMBED></td></tr></table>

  10. 웹프로그래머 2007/11/23 09:02  댓글주소  수정/삭제  댓글쓰기

    배경색을 넣고 싶으시면 아래와 같은 태그를 사용하세요. bgcolor 에 원하는 색코드를 입력하면 됩니다. <table border=0 cellpadding=0 cellspacing=0 bgcolor=#333333><tr><td align=middle><EMBED pluginspage=http://www.macromedia.com/go/getflashplayer src=http://www.hompydesign.com/club/translate.swf width=180 height=60 type=application/x-shockwave-flash quality="high" FlashVars="link=http://hompy.info" wmode=transparent></EMBED></td></tr></table>

  11. 적련 2007/11/06 12:18  댓글주소  수정/삭제  댓글쓰기

    저도 null은.. 어쩌구... 나오네요 ㅠ,ㅠ 흑.

    이전 주소의 블로그가 고장나서, 새로이 포워딩 신청 게시판에 신청 했습니다 ;ㅁ;

  12. 적련 2007/11/06 01:43  댓글주소  수정/삭제  댓글쓰기

    어설프게나마 웹프로그래머님의 설명대로..

    플래시를 복사해서 하나로 합치기까진 성공했는데..
    테두리가 나와요..ㅠ,ㅠ

    해결책은 없을까요? ㅎㅎ

    • 웹프로그래머 2007/11/06 09:58  댓글주소  수정/삭제

      [IE 에서 테투리를 안보이게 하는 태그] 를 잘 보시고 해보세요.

  13. 피터팬이야 2007/11/05 17:33  댓글주소  수정/삭제  댓글쓰기

    영어 번역기를 누르면 이런 메세지가 나옵니다...

    'null'은 null이거나 개체가 아닙니다.

    무슨 이유 때문에 이런 메세지가 나올까요??
    제가 넘 초짜라...ㅜㅜ

    • 웹프로그래머 2007/11/06 10:03  댓글주소  수정/삭제

      구글 번역 사이트에서 번역하는 과정에서 생기는 문제라서 간단히 해결될 문제는 아닌듯 합니다. 경고창을 뿌려주는 부분을 찾기위해 번역된 웹페이지 소스 보기 같은 것을 하셔서 자바스크립트를 일일이 추적해야 될듯...

  14. [subit] 2007/10/21 20:34  댓글주소  수정/삭제  댓글쓰기

    정말 감사합니다 +_+ 너무 멋진데요 ㅎ_ㅎ
    그런데 일어번역을 하니 블로그의 프래임이 완전 깨져서 나오는데
    이것은 왜 그런가요?
    혹 포스트의 주소가 한글로 되어 있어서 그런가요?

  15. Zet 2007/08/03 18:24  댓글주소  수정/삭제  댓글쓰기

    번역 버튼 잘쓰겠습니다. 대단한 지니어스 웹프로그래머님의 실력에 항상 감탄하고 갑니다~ 지니어스~

  16. 꽃수염 2007/07/09 15:18  댓글주소  수정/삭제  댓글쓰기

    잘 쓰겠습니다^^

  17. 주주 2007/07/08 22:04  댓글주소  수정/삭제  댓글쓰기

    longing입니다 ^^필명을 바꿧어요..제가 이 번역기 플래쉬를 블로그 상단부분에 작은 사이즈로 붙이고 싶어서 만들어 놓으신 개별포스트용태그에서 ［##_article_rep_link_##］이부분을 삭제 한후..사용했거든요..?;;
    첨엔 위의 큰사이즈태그에서 180,60 부분을 90 30 으로 바꿔서 달믄 사이즈가 줄을까 하구 햇는대 안되길래..작은사이즈로 만들어 놓으신 포스트용을..제가 맘대로 손대서 페이지번역부분만 지우고..사용했눈데...괜찮은건지 어떤건지..몰라서요...혹시라도 제가 실수를 한것이라면 댓글 달아 주세요..바꿀께요 ^^

  18. longing 2007/07/02 21:42  댓글주소  수정/삭제  댓글쓰기

    저도 사용해 보고 싶어서 담아 갑니다 ^^ 감사합니다!

  19. 피아노 2007/07/02 09:58  댓글주소  수정/삭제  댓글쓰기

    감사합니다 사용하고 싶습니다 사용해도 되죠..? ^^*

  20. 플토커 2007/06/30 20:02  댓글주소  수정/삭제  댓글쓰기

    스킨편집에서 작업 하는거 맞죠?
    어느 위치에 붙여야하나요?

    • 웹프로그래머 2007/07/01 09:26  댓글주소  수정/삭제

      스킨 편집에서 하시면 되고, 개인 취향에 따라 배치하시면 됩니다.

  21. 비밀방문자 2007/06/28 21:15  댓글주소  수정/삭제  댓글쓰기

    관리자만 볼 수 있는 댓글입니다.

  22. jukun 2007/06/26 00:37  댓글주소  수정/삭제  댓글쓰기

    아이콘도 이쁘고, 항상 좋은 자료 감사합니다~

  23. 플토커 2007/06/25 22:50  댓글주소  수정/삭제  댓글쓰기

    가입형 블로그처럼 스크랩할려면 어떻게 해야하나요?

    • 웹프로그래머 2007/06/25 23:28  댓글주소  수정/삭제

      가져가고 싶은 게시물 내용의 상단에서 드래그 해서 하단으로 옮기면 블럭 설정이 됩니다. 복사(CTRL+C) 하시고 블로그 글쓰기에서 붙여넣기(CTRL+V) 붙여넣기 하세요. 그외의 스크랩 방법은 없습니다.

  24. 플토커 2007/06/25 22:45  댓글주소  수정/삭제  댓글쓰기

    블로그 왕초보 입니다. 자주 와서 한 수 배우겠습니다.
    좋은 정보 감사드려요

  25. 나인테일 2007/06/25 19:43  댓글주소  수정/삭제  댓글쓰기

    http://blog.naver.com/makehost/30019122769

    혹시 저런 블로그에 전문인용 허가해 주신 적 있으십니까? 네이버 블링크에 트랙백 넣으러 갔다가 찾아낸 포스트입니다만...

    • 웹프로그래머 2007/06/25 20:25  댓글주소  수정/삭제

      저의 네이버 블로그 입니다. 만약을 위해 서브 블로그에 백업을 해두고 있습니다. 신경써주셔서 더 감사하네요.^^

  26. papam 2007/06/25 19:10  댓글주소  수정/삭제  댓글쓰기

    잘쓰겠습니다.
    감사합니다.

  27. Ikarus 2007/06/25 19:13  댓글주소  수정/삭제  댓글쓰기

    플래쉬를 이용하셔서 번역서비스를 구현하셨군요. 제가 시도했던 것은 파이어폭스에서는 제대로 안되던데 웹프로그래머님의 플래쉬 버전은 파이어폭스에서도 잘 되네요. 훨씬 좋네요. 부럽습니다.

  28. 좀비 2007/06/25 19:04  댓글주소  수정/삭제  댓글쓰기

    바로 달아 버렸습니다. ^^
    너무 마음에 드는 군요.
    근데 제가 좀 지식이 짧아서리. 붐바와 같이 한줄에 넣지를 못하겠네요.. ^^;;

  29. nashimaryo 2007/06/25 18:38  댓글주소  수정/삭제  댓글쓰기

    오~ 세계화 시대에 맞는 자료군요~ ^^
    북마크/추천/구글 광고 세트 드리고 갑니다~~

  30. sepial 2007/06/25 18:30  댓글주소  수정/삭제  댓글쓰기

    이 포스트를 번역시켜봤더니, 블로그가 blow him, 달아보자가 weigh로 나오는군요.....^^;;;;; 써야하나 말아야 하나......고민됩니다. ^^;
    제 경우 영어를 빼고나면 전혀 감도 안오니까, 중국어, 일본어, 스페인어 등등을 발견했을 때 얼추 무슨 말을 하려고하는지는...번역기 돌리면 추측할 수 있을 것 같네요. 잘 보고 갑니다. ^^

  31. R 2007/06/25 17:55  댓글주소  수정/삭제  댓글쓰기

    신기하네요 +ㅁ+ 호오.. 멋집니다. 늘 재밌는 걸 공개해주시네요 ㅎㅎ

  32. 떡이떡이 2007/06/25 17:39  댓글주소  수정/삭제  댓글쓰기

    좋은 자료 감사합니다.^^

  33. 푸리아에 2007/06/25 17:38  댓글주소  수정/삭제  댓글쓰기

    잽싸게 적용해봤는데 참 좋네요. 감사합니다. :D

◀ 이전페이지 1 ... 483 484 485 486 487 488 489 490 491 ... 623 다음페이지 ▶