다음뷰 구독버튼 사이드바에 크고 확실하게 다세요.

포스팅을 통해서 지난번 구독소스를 활용하여 다음뷰의 MY글 위젯과 같이 활용하도록 위와같이 제작하였습니다. 

플래쉬로 사용되어지는 구독버튼의 크기가 너무작고(+버튼을 눌러야하는데 작을뿐만아니라 구독버튼이 이 버튼인지 쉽게 확인하기도 힘들며 클릭하여 마우스를 가져갈때는 "퍼가기"라는 문구가 떠서 쉽게 구독을 하기가 어려웠습니다) 구독버튼을 누르기가 힘들어 어떻게 하면 쉽게 구독버튼을 누를 수 있을까하다 제 스킨에 맞추어 제작하였습니다.

오른쪽에 보이는 사이드바에 달린것처럼 위의 모습으로 구독사이드를 만들었고 아래의 하단부는 제가 사용하는 레뷰,믹시,올포스트를 연결하도록 되어 있습니다. 롤오버 형태로만들어 마우스를 갖다대면 이미지가 바뀔 수 있도록 제작하였습니다.

1. 다음뷰 구독만 넣은 소스 및 이미지입니다.

 

<table width=200 border="1" align="center" style="border-collapse:collapse; border:1px #d0d0d0 solid;"> <tr><td> <img src="자신의 이미지 주소/view1.jpg"> </td></tr><tr><td height="13"></td></tr> <tr><td><div align=center> <A onmouseover='img1.src="자신의 이미지 주소/bn_daum_174.jpg"' onmouseout='img1.src="자신의 이미지 주소/bn_daum_174_o.jpg"' href=http://v.daum.net/user/plus?blogurl=본인블로그주소 target=blank><IMG name=img1 src="자신의 이미지주소/bn_daum_174_o.jpg"></a></div></td></tr> <tr><td height="13"></td> </tr> </table> 소스와 이미지를 다운받으셔서 사용하세요. 사이드바 소스.txt 다음뷰구독이미지.zip

위에 적어드린 소스는 보이는 다음뷰 구독버튼만 들어있는 소스로 사이드바 넓이"200px" 구독 이미지 넓이 "174px"로 되어 있습니다. 보인블로그주소는 다음뷰에 연동되어져 사용하고있는 주소를 넣어주시면 됩니다.

적용모습

위의 형태로 사이드바가 삽입됩니다. 이미지 등록&주소 확인방법 및 사이드 바의 사용방법은은 아래와 같습니다.

1. Image 업로드
관리자 모드의 Html/CSS 편집에 들어가면 파일 업로드를 할 수 있습니다.

이곳을 통하여 이미지 파일을 업로드 합니다. 파일업로드를 누르시면 파일을 불러오는 창이 뜨며 올리고자하는 파일을 선택하시고 열기를 누르시면 자동으로 업로드가 됩니다.
* 파일명은 임의적으로 하셔도 괜찮습니다.

2. Image 주소확인

파일을 업로드 하신 후 자신이 업로드한 파일명을 선택 후 왼쪽의 화면에서 우측버튼을 클릭합니다. 클릭하시면 속성에 들어시면 이 이미지에대한 주소를 확인 할 수 있습니다.

좌측의 빨간부분이 이 이미지에 대한 경로입니다. 결로로 지정된 부분을 드래그 하셔서 복하시어 사용하 실 수 있습니다.





3. 사이드바에 등록
소스를 수정하시고 관리자 모드로 접속하신 후 스킨-사이드바 설정에 들어갑니다.

위와 같이 진행하시고 넣으시면 적용은 끝납니다.

2. 다음뷰 구독 및 작은 아이콘 포함소스 및 이미지입니다. 

소스와 이미지를 다운받으셔서 사용하세요. 사이드바 소스.txt 하단 아이콘 포함 이미지.zip

설정방법은 위와 같습니다. 레뷰의 자신주소는 http://www.revu.co.kr/MyRevU/자신의아이디를 넣어주시면 됩니다. 믹시의 경우 로그인하신 후 마이믹시에 가시면 왼쪽하단에 자신의 블로그네임이 있습니다. 그걸 누르시면 나타나는 주소창의 주소를 집어넣으시면 됩니다.

롤오버가 싫으신분들께서는 <A onmouseover=....><a>로 되어있는부분을 <A herf="연결주소"><img src="이미지 주소"></a>로 바꾸셔서 사용하시면 롤오버 하지 않는 기본이미지만 보여지게됩니다. 블로그에 이쁘게 다시고 함께 추천과 구독을 나눌 수 있었으면 좋겠습니다.

다음뷰의 MY글처럼 만드시고 싶으신 분들께서는 소스안의 <table>이 열린곳에보시면 #d0d0d0이라되어 있는부분을 #c3c9e0로바꾸시고 view1.jpg대신에 view3.jpg를 업로드 하시고 소스에서 view1.jpg대신에 view3.jpg로 수정해서 사용하세요.

대체하실 작은 아이콘 이미지가 필요하신분들은 댓글남겨주시면 제작해서 드리겠습니다.
트위터 및 기타 메타블로그를 연결하시고 싶으시면 댓글을 통해 요청해주세요.
기타 사이즈 제작도 가능하오니 요청해주시면 제작해드리겠습니다.

이 글이 마음에 드시면 아래의 추천버튼을 눌러주시길 부탁드립니다.