BLOG Story
티스토리 블로그에 네이버 이웃커넥트 위젯, 이웃추가 버튼 설치하는 방법 + 다음뷰 구독 버튼 설치
2proo
2013. 2. 8. 07:40
티스토리 블로그에 네이버 이웃커넥트 위젯, 이웃추가 버튼 설치하는 방법 + 다음뷰 버튼 설치
다음에 다음 뷰가 있다면 네이버엔 네이버 이웃 커넥트 위젯이 있습니다. 다음뷰는 메타블로그 성격이 강하지만 네이버 이웃커넥트는 이웃블로그 소개와 링크 역활을 하게 됩니다. 이웃 커넥트를 설치하여 사용하면 이웃 블로그에 새 글이 올라오는지 여부를 알 수 있고 쉽고 빠르게 해당 블로그로 연결이 가능하게 됩니다. 다른 블로그로의 연결을 쉽게 해주는 의미에서 두 서비스의 성격이 비슷하다고 볼 수 있습니다.
어쨋든... 얼마전에 아래 이미지처럼 블로그 하단에 네이버 이웃커넥트 위젯을 대체하는 이웃 추가 버튼 이미지와 다음뷰 구독 버튼 이미지를 만들어서 사용중에 있습니다. 쉬운 이미지 작업이지만 간만에 버튼 이미지 만드는데 버벅버벅...
이 두개의 이미지를 이용하여 네이버 이웃추가 버튼과 다음뷰 구독 버튼을 티스토리 블로그에 설치하는 방법을 이야기 하고자 합니다. 뭐... 어차피 둘 다 이미지 + 링크 형식이기때문에 네이버에도 설치할 수 있고 이글루스나 다른 블로그 서비스에도 설치가 가능합니다. 다음뷰 이미지 버튼은 예전에도 만들어서 사용중이었는데 이웃추가 버튼 만들면서 같이 수정을 조금 했습니당...
일단 네이버 이웃커넥트 버튼을 적용하려면 네이버 블로그 홈에 가셔서 로그인 후, 이웃 커넥트 위젯을 먼저 만들어야합니다.
▶ 네이버 이웃 커넥트 위젯 : http://section.blog.naver.com/sub/InstallConnectWidget.nhn
네이버 블로그 사용자이든 티스토리나 다음 블로그 사용자든간에 이웃 커넥트 위젯을 먼저 만들어야 합니다.
위 위젯 만들기 링크를 통해 들어가면 아래 스크린샷과 같은 화면이 나옵니다.
네이버 블로그 유저는 위젯을 설치할 블로그 항목에서 네이버 블로그로 퍼가기 그대로 유지하면 되고, 그 외의 티스토리나 다음 블로그, 외부 블로그 들은 다른 블로그로 퍼가기를 선택한 후 하단의 위젯을 사용할 블로그 주소 입력에 자신의 블로그 주소를 입력한 후 맨 아래쪽의 만들기 버튼을 누르면 됩니다.
위젯 옵션과 디자인을 꾸미고 그대로 사용해도 됩니다. 하지만 이 포스트에서는 이미지를 활용한 이웃 커넥트와 다음 뷰 버튼 링크를 만드는 것이므로 다시 고고고~
네이버 블로그든 그 이외의 블로그든 위젯으로만 사용하려면, 위젯 설정을 한 후 위젯으로 퍼가기 기능을 이용하면 소스가 나오므로 그거 고대로 사이드바나 원하는곳에 스크립트를 넣어주면 됩니다.
로그인 되어있는 상태에서 자신의 네이버 블로그 관리 페이지로 갑니다.
네이버 블로그 -> 관리 -> 기본 설정 -> 열린 이웃 메뉴를 보면 해당 페이지 상단에 아래 이미지처럼 이웃 커넥트 관리하기 버튼이 있는 것을 확인 할 수 있습니다. 클릭~!!!
이웃 커넥트 관리하기 페이지에 진입을 하면 위젯 디자인 관리와 위젯 관리 두 메뉴가 나옵니다.
위젯 디자인 관리에서 설치된 블로그가 제대로 설정이 되어있는지 확인합니다.
그리고 위젯관리 에서 별명과 프로필에 사용될 이미지를 업로드해줍니다.
티스토리 블로그의 경우 RSS 프로필 이미지가 있어도 제대로 표시가 안되므로 따로 업로드 해줍니다.
여기까지 진행되었으면 일단 위젯 설치를 위한 기본 사항은 다 완료되었습니다.
위에도 이야기했듯이 네이버 블로그든 아니든간에 네이버 이웃커넥트가 제공하는 위젯 그대로 사용해도 무방합니다.
하지만 위젯 말고 이미지 버튼을 이용해서 네이버 이웃커넥트 기능을 원하는 버튼을 만들려면 좀 더 작업해야합니다.
일단 자신이 만들어놓은 네이버 이웃커넥트 위젯의 이웃추가 주소를 알아내야합니다.
해당 이미지 버튼을 눌렀을때 이웃 추가로 연결되어야 한다는 뜻입니다.
http://section.blog.naver.com/connect/PopConnectBuddyAddForm.nhn?blogId=sunset33&widgetSeq=448575
위 링크가 이웃커넥트 이웃 추가 링크입니다. 위 링크 주소에서 붉은색 굵은 글씨인 sunset33 은 제 네이버 아이디입니다.
위 네이버 아이디 부분에 자신의 네이버 계정을 넣어주면 링크 완성입니다. 쉽죠... ㅇ_ㅇ
이웃커넥트 위젯을 만들어야만 위 이웃 추가 링크를 쓸 수 있습니다.
네이버 이웃커넥트 버튼 만들기는 일단 여기까지 완료~!!!
그 다음은 다음 뷰 구독 버튼의 링크 주소를 알아내는 방법입니다.
▶ 다음 뷰 가입하기 : http://v.daum.net/user/join?tab=2
이미 다음뷰에 가입되어 있으면 가입절차는 패스패스~
다음뷰 가입절차시에 사용된 자신의 블로그 주소 URL은 외워두세요. 아래 링크는 다음 뷰의 구독 추가 주소입니다.
맨 끝의 2proo.net 대신에 자신의 블로그 주소를 입력하면 됩니다.
http://v.daum.net/user/plus?blogurl=http://2proo.net
요기까지가 다음 뷰 구독 추가 링크를 만드는 과정이었습니다.
그렇다면 이제 네이버 이웃커넥트와 다음뷰 구독 버튼 적용 과정입니다.
아래 이미지들은 깨작 깨작 만들어놓은 이미지들인데 뭐... 각자 만들어 쓰셔도 되고 이거 가져다 사용해도 됩니다.
이 이미지들에 위에서 알아낸 이웃 커넥트 주소와 다음뷰 주소를 링크로 연결해주면 됩니다.
350 x 60 사이즈 버튼
305 x 60 사이즈 버튼
200 x 38 사이즈 버튼
위 이미지들을 다운 받았으면 티스토리의 경우 자신의 스킨 파일 업로드에 올려놓고 사용하면 됩니다.
그 외의 네이버 블로그나 다음 블로그의 경우 위젯이나 블로그 포스트에 업로드한 후 각자 만들어서 써도 됩니다.
아래 html 소스가 제 블로그에 설치되어 있는 버튼들의 소스입니다. 테이블 html을 이용해서 간단하게 만들었습니다.
혹시 몰라서 위 링크들의 주소와 html 소스를 아래 텍스트 파일로 업로드 합니다.
네이버 이웃커넥트에 가입하는 방법과 자신의 커넥트 이웃추가 주소 만드는 방법, 다음뷰 가입 및 구독 버튼 주소 만드는 방법, 그리고 적용되는 HTML 소스와 각 버튼 이미지까지 다 올려두었습니다.
각자 자신의 블로그에 자신의 입맛에 맛게 변경하여 사용하시면 되겠습니다.
이상 블로그에 네이버 이웃커넥트 위젯과 이웃추가 버튼, 다음뷰 구독 버튼 설치하는 방법이었습니다.
다음에 다음 뷰가 있다면 네이버엔 네이버 이웃 커넥트 위젯이 있습니다. 다음뷰는 메타블로그 성격이 강하지만 네이버 이웃커넥트는 이웃블로그 소개와 링크 역활을 하게 됩니다. 이웃 커넥트를 설치하여 사용하면 이웃 블로그에 새 글이 올라오는지 여부를 알 수 있고 쉽고 빠르게 해당 블로그로 연결이 가능하게 됩니다. 다른 블로그로의 연결을 쉽게 해주는 의미에서 두 서비스의 성격이 비슷하다고 볼 수 있습니다.
어쨋든... 얼마전에 아래 이미지처럼 블로그 하단에 네이버 이웃커넥트 위젯을 대체하는 이웃 추가 버튼 이미지와 다음뷰 구독 버튼 이미지를 만들어서 사용중에 있습니다. 쉬운 이미지 작업이지만 간만에 버튼 이미지 만드는데 버벅버벅...
이 두개의 이미지를 이용하여 네이버 이웃추가 버튼과 다음뷰 구독 버튼을 티스토리 블로그에 설치하는 방법을 이야기 하고자 합니다. 뭐... 어차피 둘 다 이미지 + 링크 형식이기때문에 네이버에도 설치할 수 있고 이글루스나 다른 블로그 서비스에도 설치가 가능합니다. 다음뷰 이미지 버튼은 예전에도 만들어서 사용중이었는데 이웃추가 버튼 만들면서 같이 수정을 조금 했습니당...
일단 네이버 이웃커넥트 버튼을 적용하려면 네이버 블로그 홈에 가셔서 로그인 후, 이웃 커넥트 위젯을 먼저 만들어야합니다.
▶ 네이버 이웃 커넥트 위젯 : http://section.blog.naver.com/sub/InstallConnectWidget.nhn
네이버 블로그 사용자이든 티스토리나 다음 블로그 사용자든간에 이웃 커넥트 위젯을 먼저 만들어야 합니다.
위 위젯 만들기 링크를 통해 들어가면 아래 스크린샷과 같은 화면이 나옵니다.
네이버 블로그 유저는 위젯을 설치할 블로그 항목에서 네이버 블로그로 퍼가기 그대로 유지하면 되고, 그 외의 티스토리나 다음 블로그, 외부 블로그 들은 다른 블로그로 퍼가기를 선택한 후 하단의 위젯을 사용할 블로그 주소 입력에 자신의 블로그 주소를 입력한 후 맨 아래쪽의 만들기 버튼을 누르면 됩니다.
위젯 옵션과 디자인을 꾸미고 그대로 사용해도 됩니다. 하지만 이 포스트에서는 이미지를 활용한 이웃 커넥트와 다음 뷰 버튼 링크를 만드는 것이므로 다시 고고고~
네이버 블로그든 그 이외의 블로그든 위젯으로만 사용하려면, 위젯 설정을 한 후 위젯으로 퍼가기 기능을 이용하면 소스가 나오므로 그거 고대로 사이드바나 원하는곳에 스크립트를 넣어주면 됩니다.
로그인 되어있는 상태에서 자신의 네이버 블로그 관리 페이지로 갑니다.
네이버 블로그 -> 관리 -> 기본 설정 -> 열린 이웃 메뉴를 보면 해당 페이지 상단에 아래 이미지처럼 이웃 커넥트 관리하기 버튼이 있는 것을 확인 할 수 있습니다. 클릭~!!!
이웃 커넥트 관리하기 페이지에 진입을 하면 위젯 디자인 관리와 위젯 관리 두 메뉴가 나옵니다.
위젯 디자인 관리에서 설치된 블로그가 제대로 설정이 되어있는지 확인합니다.
그리고 위젯관리 에서 별명과 프로필에 사용될 이미지를 업로드해줍니다.
티스토리 블로그의 경우 RSS 프로필 이미지가 있어도 제대로 표시가 안되므로 따로 업로드 해줍니다.
여기까지 진행되었으면 일단 위젯 설치를 위한 기본 사항은 다 완료되었습니다.
위에도 이야기했듯이 네이버 블로그든 아니든간에 네이버 이웃커넥트가 제공하는 위젯 그대로 사용해도 무방합니다.
하지만 위젯 말고 이미지 버튼을 이용해서 네이버 이웃커넥트 기능을 원하는 버튼을 만들려면 좀 더 작업해야합니다.
일단 자신이 만들어놓은 네이버 이웃커넥트 위젯의 이웃추가 주소를 알아내야합니다.
해당 이미지 버튼을 눌렀을때 이웃 추가로 연결되어야 한다는 뜻입니다.
http://section.blog.naver.com/connect/PopConnectBuddyAddForm.nhn?blogId=sunset33&widgetSeq=448575
위 링크가 이웃커넥트 이웃 추가 링크입니다. 위 링크 주소에서 붉은색 굵은 글씨인 sunset33 은 제 네이버 아이디입니다.
위 네이버 아이디 부분에 자신의 네이버 계정을 넣어주면 링크 완성입니다. 쉽죠... ㅇ_ㅇ
이웃커넥트 위젯을 만들어야만 위 이웃 추가 링크를 쓸 수 있습니다.
네이버 이웃커넥트 버튼 만들기는 일단 여기까지 완료~!!!
그 다음은 다음 뷰 구독 버튼의 링크 주소를 알아내는 방법입니다.
▶ 다음 뷰 가입하기 : http://v.daum.net/user/join?tab=2
이미 다음뷰에 가입되어 있으면 가입절차는 패스패스~
다음뷰 가입절차시에 사용된 자신의 블로그 주소 URL은 외워두세요. 아래 링크는 다음 뷰의 구독 추가 주소입니다.
맨 끝의 2proo.net 대신에 자신의 블로그 주소를 입력하면 됩니다.
http://v.daum.net/user/plus?blogurl=http://2proo.net
요기까지가 다음 뷰 구독 추가 링크를 만드는 과정이었습니다.
그렇다면 이제 네이버 이웃커넥트와 다음뷰 구독 버튼 적용 과정입니다.
아래 이미지들은 깨작 깨작 만들어놓은 이미지들인데 뭐... 각자 만들어 쓰셔도 되고 이거 가져다 사용해도 됩니다.
이 이미지들에 위에서 알아낸 이웃 커넥트 주소와 다음뷰 주소를 링크로 연결해주면 됩니다.
350 x 60 사이즈 버튼
305 x 60 사이즈 버튼
200 x 38 사이즈 버튼
위 이미지들을 다운 받았으면 티스토리의 경우 자신의 스킨 파일 업로드에 올려놓고 사용하면 됩니다.
그 외의 네이버 블로그나 다음 블로그의 경우 위젯이나 블로그 포스트에 업로드한 후 각자 만들어서 써도 됩니다.
아래 html 소스가 제 블로그에 설치되어 있는 버튼들의 소스입니다. 테이블 html을 이용해서 간단하게 만들었습니다.
<table width="99%" border="0" cellpadding="0" ><tr>
<td align="center" valign="center" width="350px">
<a title="네이버 이웃추가" href="http://section.blog.naver.com/connect/PopConnectBuddyAddForm.nhn?blogId=sunset33&widgetSeq=448575" target="_blank"><img src="./images/naver-connect.png" width="350" height="60" alt="Naver connect"/></a>
</td><td width="20"></td>
<td align="center" valign="center" width="350px">
<a title="다음 뷰 구독하기" href="http://v.daum.net/user/plus?blogurl=http://2proo.net" target="_blank"><img src="./images/daumview.png" width="350" height="60" alt="Daum View"/></a>
</td></tr>
</table>
<td align="center" valign="center" width="350px">
<a title="네이버 이웃추가" href="http://section.blog.naver.com/connect/PopConnectBuddyAddForm.nhn?blogId=sunset33&widgetSeq=448575" target="_blank"><img src="./images/naver-connect.png" width="350" height="60" alt="Naver connect"/></a>
</td><td width="20"></td>
<td align="center" valign="center" width="350px">
<a title="다음 뷰 구독하기" href="http://v.daum.net/user/plus?blogurl=http://2proo.net" target="_blank"><img src="./images/daumview.png" width="350" height="60" alt="Daum View"/></a>
</td></tr>
</table>
혹시 몰라서 위 링크들의 주소와 html 소스를 아래 텍스트 파일로 업로드 합니다.
네이버-다음뷰-소스.txt네이버 이웃커넥트에 가입하는 방법과 자신의 커넥트 이웃추가 주소 만드는 방법, 다음뷰 가입 및 구독 버튼 주소 만드는 방법, 그리고 적용되는 HTML 소스와 각 버튼 이미지까지 다 올려두었습니다.
각자 자신의 블로그에 자신의 입맛에 맛게 변경하여 사용하시면 되겠습니다.
이상 블로그에 네이버 이웃커넥트 위젯과 이웃추가 버튼, 다음뷰 구독 버튼 설치하는 방법이었습니다.