티스토리 왼쪽 사이드에 '따라다니는 베너'(플로팅 베너) 달기!! (다음 추천버튼, 페이스북, 다음뷰, 한RSS버튼) - 1편

제 블로그 왼쪽에 보시면 '플로팅 베너' 가 (다음 추천,
페이스북, 다음뷰 구독, 한RSS 구독) 달려있습니다.

이 버튼들 모음이 왜 플로팅 베너냐 하면~ 말 그대로
떠다니는, 따라다니는 베너라 해서 이름이 붙여졌답니다.

이 플로팅 베너는 화면을 밑으로 내려도 고정된 위치에서
당당하게 클릭해 달라며 손짓?을 하고 있습니다.

제 얼마 안되는 독자분 중 한 분이 플로팅 베너 다는방법을
포스팅 해주면 안되냐는 질문을 해 주셔서 기꺼이
해드리겠다고 약속을 했기에 이렇게 포스팅 하게 됐습니다.

컴맹과 가까운 저인지라 포스팅 준비하는데 시간이 좀
오래걸리게 됐네요~ㅋ

그래도 열심히 준비했으니 재미없어도 재미있게 읽어주시길
바랍니다.


한가지 작은 바램이 더 있다면 왼쪽 플로팅 베너 제일 위에 있는
손가락 버튼을 살포시 눌러주시면 어떨까 바래봅니다 (__)

우선 플로팅 베너를 달기 전에 해야할 일이 있습니다.
플로팅 베너 안에 보시면 3번째 있는 다음 구독버튼과 4번째 있는 한RSS 구독버튼이 있습니다.

이 버튼들은 이미지로 되어있기 때문에 이 이미지를 불러오기 위해서는 해당하는 파일들을 블로그 안에 저장을
해놔야 한답니다.

갑자기 어려워하실필요 없습니다.
제가 이해할 수 있었으니 충분히 따라하실 수 있거든요 ^^

먼저 아래와 같은 경로로 들어가시면 됩니다.

관리자 모드로 들어가신 다음 1번 -> 'HTML/CSS 편집'을 클릭하시고 2번 -> '파일업로드' 탭을 클릭하시면
사진과 같이 여러개의 파일들이 있는것을 보실 수 있습니다.

여기가 바로 블로그에 필요한 사진들이 담겨져 있는 파일방이라고 할 수 있습니다.
바로 이곳에 아까 말씀드린 다음뷰 구독버튼과 한RSS 구독버튼 이미지를 넣어야 하는 것입니다.

제가 올려드리는 파일을 저 안에 넣어두시는게 첫번째로 할 일이랍니다.
파일 올리는 방법은 '파일업로드'탭 화면 아래 보시면 추가하는 버튼이 있으니 어렵지 않게 하실 수 있겠죠?! ^^

 

버튼.zip

위 파일을 다운 받으셔서 업로드 하시면 됩니다.

다음으로 넘어가보실까요?! ^^
우선 손가락 모양의 추천 버튼과 페이스북 버튼을 만들어 보겠습니다.

'HTML/CSS 편집' 탭으로 들어갑니다. 그리고 아래 문구를 Ctrl + F 를 눌러 찾아봅니다.

위 문구를 찾으셨다면 저 문구 바로 밑 부분에 밑에 올려드리는 문구를 넣으시면 됩니다.
(위 문구는 skin.html 부분에 있습니다. style.css 부분이 아닙니다!!)

 

추천,페이스북 버튼.txt

 

파일 올려드렸으니 일일이 타이핑하지 마시고 다운 받으셔서 그대로 넣으시고 저장하시면 됩니다.
단, 위 사진에서 알려드리것처럼 빨간색 밑줄 부분을 본인의 티스토리 아이디로 꼭~~ 변경하신다음
넣으셔야 됩니다. 꼭이요~~  꼭! 꼭! 꼭!

여기까지 따라오시는데 별로 어렵지 않으시죠?
어려우시다면 다시한번 천천히 보시면 충분히 하실 수 있답니다^^

위 단계까지 하셨다면 다음으로 아래의 문구를 style.css 제일 밑부분에 넣어주시면 됩니다.
고민하실 필요 없이 제일 밑에 넣으시면 됩니다^^

style css.txt

역시 타이핑하기 어려우니까 위 파일을 다운받으셔서 그대로 넣어주시면 됩니다.
그리고 저장을 눌러주십니다. 자~ 어떻게 됐을까요??? 밑에 사진을 보실까요?! ^^

 

위 사진처럼 왼쪽에 다음 추천버튼과 페이스북 버튼이 생긴것을 볼 수 있습니다.
여기까지 저와 똑같이 성공하셨다면 모두모두 축하드려요^^ ㅋ

갑자기 이쯤해서 한가지 질문이 생길 수 있습니다.
'이즘님은 플로팅베너에 총 4가지(추천,페이스북,다음 구독,한RSS구독)버튼이 있잖아요!
 그런데 왜 추천 버튼과 페이스북 버튼만 알려주시나요?'

질문한번 받아보고 싶어서 그랬습니다 ㅋㅋ ㅡㅡ;;;
여기까지 잘 따라오셨다면 나머지 두가지 버튼을 넣는것은 정말정말 쉽답니다. 

아쉽지만(나만 아쉽나? ㅋ) 오늘은 여기까지 마치고 내일 이어지는 2편에서 뵐께요^^
여기까지 만드는데도 3시간이나 걸렸네요 ㅠ.ㅠ

그럼 다음 구독버튼과 한RSS 구독버튼 넣는 방법에 대해서는 다음편(내일)에서 찾아뵙겠습니다^^
여기까지 읽어주시고 따라해보시느라 수고 많으셨습니다.

혹시~혹시~ 아직까지 왼쪽 손가락 버튼을 눌러주지 않으신 분이 계시다면 꾸~욱 눌러주시길 바랍니다 ㅋ
여러분의 추천이 글을 쓰는데 매우 힘이되거든요^^

ps. 반도의~대학생님 이정도면 쉽게 따라하실 수 있죠?!