본문 바로가기
반응형

기술이 너무나 급성장을 하는 것을 새삼 느낍니다. 예전에도 번역프로그램이 없었던 것은 아니지만 번역율이 좋지 않아서 거들떠도 보지 않았었는데 지금은 인공지능이라고 하는 머신러닝 기술을 이용해서 상당히 번역율이 높아지고 있음을 실감합니다.
그 선봉에 서있는 기업이 역시나 구글입니다. 구글은 전세계 언어를 서로 번역하는 기능을 무료로 제공 하고 있습니다. 무료로 제공한다고 해서 구글이 착한 회사라고는 할 수 없지만 그래도 일반인 입장에서는 고마운 기능임에는 틀림없습니다.

그래서 블로그나 웹사이트를 구글 번역 플러그인을 사용하여 어느정도 퀄리티 있는 번역을 제공하는 방법을 포스팅해 보려고 합니다.

구글 번역사이트 접속하여 코드 발행하기

구글 번역 웹사이트

먼저 구글 번역웹사이트에 접속을 합니다.
접속 후 웹사이트에 지금추가 버튼을 실행시킵니다.

웹사이트 정보 입력

웹사이트 정보 입력

  1. 먼저 웹사이트 URL을 입력합니다. 이것이 무슨 의미인지 모르지만 다른 URL을 입력해도 실행은 되더라구요.
  2. 블로그가 작성된 원본언어에 대한 설정입니다. 우리는 한국사람이니 한국어로 설정하면 됩니다.
  3. 다음을 클릭하여 다음단계로 넘어갑니다.

플러그인 설정 정보 입력

플러그인 설정

  1. 번역되는 언어의 종류를 선택합니다. 간단하게 영어, 일어, 중국어 등을 선택해도 되고 모든 언어를 선택해도 됩니다.
  2. 표시모드는 해당 번역단추가 어떤 형태로 나올 것인지에 대한 설정입니다. 저는 드롭다운을 설정 후 CSS로 모양을 조금 바꾸어서 사용하고 있습니다.
  3. 고급설정은 잘 모르겠으면 그냥 기본으로 놓으셔도 크게 문제는 없습니다.
  4. 코드받기를 선택하여 다음 단계로 넘어 갑니다.

플러그인 추가 코드 획득

플러그인 추가

이제 모두 왼료 되었습니다. 완료가 되면 아래와 같이 html과 javascript 코드가 생성됩니다.
코드는 기본적으로 위와 같이 생성 됩니다.

  1. 해당 html 태그가 나오는 곳에 실제 번역 버튼이 나오게 됩니다.
  2. 객체를 생성하는 코드입니다. head에 넣튼 footer에 넣튼 상관없습니다. 아니면 그냥 위의 div태그 아래에 같이 붙혀놔도 됩니다.
  3. google에서 제공하는 번역기능이 있는 javascript 링크 입니다.

이 코드를 복사해서 내 블로그의 원하는 위치에 붙혀넣기 하면 됩니다.

코드를 블로그에 붙혀넣기

제가 티스토리를 사용하고 있기 때문에 티스토리(tistory)를 기준으로 설명하겠습니다.

티스토리 스킨편집

스킨편집 화면
티스토리의 관리자 화면에 접속해서 스킨편집 화면으로 이동을 합니다.

  1. 저는 상단 메뉴영역에 버튼을 놓았습니다.
  2. html을 붙혀넣기 위해서 화면 오른쪽에 있는 html편집버튼을 선택합니다.

HTML 입력하기
위에서 획득한 구글번역 코드를 html코드에 입력합니다. 저는

사이에 입력을 했습니다.

적용된 화면
저는 모든언어를 번역하도록 선택해서 이렇게 많이 나오지만 몇개만 선택을 하면 간단한 화면이 나옵니다.

이상으로 포스팅을 마치겠습니다.

UX 공작소

UX와 UI에 관해 내가 알게된 다양한 이야기를 공유해요~