FastBoot스킨 사이드바에 구글 번역기 설치하기

티스토리에서 기본적으로 적용이 가능한 #2 반응형스킨을 사용하다가 구글 번역기를 추가하고 싶은 마음이 생겼습니다. 사이드바에 구글 번역기를 추가 하려니 #2 반응형스킨은 사이드바를 보려면 메뉴버튼을 눌러줘야 사이드바가 나타나서 설치를 하나마나 사용하는 사람이 없을것이라는 판단에 FastBoot 반응형스킨으로 변경을 하였습니다.


이제 FastBoot 반응형스킨 사이드바에 구글 번역기를 설치해 봅시다.



구글 웹사이트 번역기 코드 받기

https://translate.google.co.kr/?hl=ko 구글 번역 사이트로 이동해주세요.

아래쪽에 붉은색으로 표시한 웹사이트 번역기를 클릭해주세요.

웹사이트에 지금 추가를 클릭해주세요.

웹사이트 URL에 본인의 티스토리 주소를 입력해 주시고 웹사이트 언어는 한국어로 설정한 다음에 다음을 클릭해주세요.

번역 언어는 모든 언어로 표시 모드는 본문에 표시, 가로로 선택을 해주시고 고급에는 페이지에 표시된 언어와 다른 언어를 사용하는 사용자를 위해 자동으로 번역 배너 표시를 선택한 다음에 코드 받기를 클릭해주세요.

티스토리에 추가할 구글 번역 코드를 받았습니다. 붉은색으로 표시된 부분에 있는 코드를 복사해주세요.




티스토리 사이드바에 구글 번역기 추가하기

사이드바에 설치하는 두가지 방법이 있습니다. 첫번째는 티스토리 관리 사이드바에서 추가하는 방법 두번째는 HTML/CSS 편집을 통한 방법이 있습니다. 두가지 방법이 어떻게 적용이 되는지 보시고 마음에 드는 방법으로 사용하시면 되겠습니다.

1. 티스토리 관리 사이드바에서 추가

2. HTML/CSS 편집으로 사이드바에 추가

두가지 방법의 차이점을 확인 하셨나요? 그러면 첫번째 방법부터 설명 시작하겠습니다.



티스토리 관리 사이드바에서 추가하는 방법

티스토리 관리로 이동해주세요.

플러그인 항목에서 플러그인 설정을 클릭해주세요.

관리 및 통계에서 배너출력을 선택하고 저장을 해주세요.

이제 꾸미기 항목에서 사이드바를 클릭해주세요.

기본 모듈에 HTML배너출력 모듈이 생겼습니다. +를 눌러서 사이드바 1에 추가를 해주시고 사이드바 1에 추가된 HTML배너출력에 편집을 클릭해주세요.

사용자가 알아보기 쉬운 이름으로 입력을 해주시고 아까 구글 번역에서 웹사이트를 추가하고 받은 코드를 HTML소스에 입력해주시고 확인을 눌러주시면 사이드바에 구글 번역기가 추가가 되었습니다.



HTML/CSS 편집으로 사이드바에 추가하는 방법

티스토리 관리로 이동해주세요.

꾸미기 항목에서 HTML/CSS 편집을 클릭해주세요.

HTML에서 <s_sidebar_element>를 찾기 하시면 모듈을 적용하는곳으로 이동 됩니다. </s_sidebar_element>아래에 구글 번역기 모듈 코드를 작성하시면 됩니다. 아무 모듈 사이에 추가를 하셔도 상관 없습니다. 꼭 </s_sidebar_element>아래에 추가를 해주세요. 구글 번역기 모듈은 텍스트파일로 첨부를 하도록 하겠습니다.

구글 번역기 추가.txt

위에 이미지 구글 번역기 모듈에 검은색 글씨로 Google Translator라고 써있는 글씨를 수정해 주시면 사이드바 구글 번역기 위에 글씨가 바뀝니다. 마지막으로 저장을 클릭해주시면 적용이 완료 됩니다. 

HTML/CSS 편집으로 구글 번역기를 추가 했는데 사이드바에 구글 번역기기 보이지 않으신다면 티스토리 관리에서

꾸미기 항목에 사이드바로 이동해주세요.

기본 모듈에 구글 번역기 모듈이 있으면 +를 눌러서 사이드바 1에 추가를 해주시고 저장을 하시면 사이드바에 적용이 됩니다.

반응형

이 글을 공유하기

댓글

Designed by JB FACTORY