기타/티스토리(Tistory)

티스토리 사이드바 링크(이웃)추가 만들기

블랙쥬스 2017. 5. 1. 00:06

티스토리 사이드바 링크(이웃)추가 만들기

 


 

 

이번 포스팅 내용은 티스토리 블로그 사이드바에 "링크추가(이웃)"를 설치 하는 방법에 대해서 알아보겠습니다.

 

티스토리 블로그는 타 블로그에서 운영되고 있는 "이웃"이라는 기능이 따로 없습니다. 그러나 비슷한 기능인 티스토리 블로그"링크"라는 기능이 있습니다. 다만 이 "링크"기능이 티스토리 블로그 "링크"추가 위치가 명확하지 않아, 사용자들이 도움이 될만한 블로그를 추가 하는 기능이 없다고들 생각 하는데, 이 기능을 눈에 확 뛸만 한 곳에 추가해보려고 합니다.

 


먼저 설명하기에 앞서 위 사진처럼 "링크"이미지를 만들어 주어야 하는데, 이 글을 보고 있는 구독자분들이 아마 준비되어있는 이미지 파일이 없을 것으로 판단이 되어 임시적으로 사용 할 수 있는 링크를 아래의 올려두겠습니다.

 

이미지 파일을 다운받으시고 위 순서대로 진행을 하시면 됩니다.

 

(.Png 파일형식 특성상 다운이 진행되지 않아 압축하여 파일을 올려드리겠습니다.)


링크추가 이미지.zip


 

위 이미지 파일을 받고 압축을 풀어주고 순서대로 좌측에서 우측으로 진행 하시면 됩니다.

 

자신의 티스토리 블로그 관리자모드 로 들어가서 좌측에 보이는 HTML/CSS편집 항목을 클릭하여 줍니다.

그리고 새로운 화면이 뜰텐데, 이때 2번째 사진에 보이는 것 과 같이 파일업로드항목을 클릭하고 아래의 "추가"버튼을 클릭하여 이미지 파일을 업로드 해야 합니다. 이미지파일을 지정해 놓은 경로로 이동하여 해당 파일을 클릭하고 열기 버튼을 눌러주면 파일업로드에 이미지 파일이 올라갑니다.

 

이상태에서 다음으로 진행을 하여야 합니다.

 

 

이미지 파일이 업로드 되었다면 해당 이미지 파일을 마우스를 이용하여 오른쪽 클릭-> 속성 탭을 클릭합니다.

클릭하였다면 속성에 주소(URL) 이 나오게 되는데 이 주소를 전부 선택하고 복사를 하셔야 됩니다.

키보드 단축키는 Ctrl+A(전체선택) - Ctrl+C(복사)

 

이렇게 이미지 파일 경로를 다시 복사를 하였다면 다음 단계인 메모장으로 이동하여 해당 이미지경로붙여넣기를 해주어야 합니다.

 


이웃추가 소스.txt


위 메모장 파일을 받고 아래의 그림대로 다시 진행을 해 보겠습니다.

 

메모장 파일을 다운받고 실행을 하게되면 첫 화면 위에 화면처럼 보이게 될 것입니다.

 

이 때에는 이미지파일 경로를 복사한 값을 붙여넣기만 해주면 됩니다. 위 보이는 사진과 같이 기본이미지주소 , 마우스 오버시 바뀌는 이미지주소 줄에 이미지파일 경로를 붙여넣으면 됩니다.

 

(본 글쓴이는 이미지주소를 통합하여 같은 이미지 경로로 삽입 하라고 했지만 만약 마우스를 오버시(올려놓았을때) 이미지가 바뀌는 것을 원한다면 해당 이미지 경로를 별도로 바꿔주셔도 됩니다.)

 

그럼 모든 이미지 경로가 삽입이 되었다면 다시 한번 전체선택(Ctrl+A) -> 복사(Ctrl+C)를 눌러주고 티스토리 관리자 모드로 이동하겠습니다.

 

 

자신의 티스토리 관리자 모드로 이동하였다면 좌측에 보이는 "사이드바"를 클릭하고 "HTML배너출력"을 추가해 줍니다.

그리고 "HTML배너출력"을 눌러주고 "편집"항목을 클릭하시고 메모장에서 작업하신 소스파일을 붙여넣기(Ctrl+V)를 하고 확인을 눌러줍니다.

 

그리고 저장 버튼을 클릭하면 자신의 블로그에 이웃추가 항목사이드바에 추가 된 것을 확인 할 수 있습니다.

 

Tip. "저장"을 누르기전 "미리보기"를 눌러서 제대로 사이드바에 추가 되었는지 확인 한 이후에 저장 버튼을 누르는 것을 추천합니다.

 

 

자신의 티스토리 관리자모드->사이드바 항목에 HTML배너출력이 없다!!?

 

아래의 방법으로 진행하시고 위 방법을 진행 하시면 됩니다.

 

 티스토리 사이드바(태그입력기,HTML배너출력)활성화

 

 

포스팅을 보시고 우측 사이드바 "링크(이웃)추가"를 눌러 글쓴이와 소통하고,

본문 아래 "공감"버튼 꾹 한번씩만 눌러시면 감사하겠습니다.