다음뷰 추천 버튼 옆에 다음 구독 버튼 달아 보자

다음뷰 버튼은 다음뷰에 글을 송고하는 사람이라면 꼭 꾸미는것중 하나이죠. 저는 다음뷰 추천 버튼을 크기를 작게 해두고 뒤에 무늬를 넣었습니다. 링크 : 다음뷰 버튼 꾸미기

그런데 다음추천버튼을 작게 만들어두면 구독버튼이 나타나지 않죠. 그래서 저는 구독버튼을 따로 달았습니다. 다음에서 이부분을 지원해주죠. 그런데 그냥 넣으면 구독버튼이 원하는곳에 뜨지 않습니다. 근데 제 경우에는 원하는곳에 띄울 수 있습니다.

그 방법에 대해서 알아봅시다.

다음뷰 구독 버튼을 다음뷰 추천 버튼 옆에 달아보자

아래의 코드를 skin.html 에 본문 치환자 [샵샵_article_rep_desc_샵샵] 아래에 넣습니다.
노란색 글 부분은 자신의 블로그 주소를 넣습니다 ( 예 : http://test.tistory.com )

<div class="viewonAdd"><a href="http://v.daum.net/user/plus?blogurl=http://cdmanii.com" onclick="window.open(this.href); return false"><img src='http://img-section.daum-img.net/view/widget/bt_plus_a03.gif'></a></div>

아래의 코드를 style.css 맨 하단에 넣습니다.

.viewonAdd {
margin:-228px 0 0 499px;
position:absolute;
width:33px;
}

다음뷰 구독 버튼 위치 조정을 해보자

다음뷰 구독버튼을 위와같이 달면 블로그 마다 뜨는 위치가 조금 다를것입니다. 이부분의 위치를 조절을 하는 방법에 대해서 설명합니다.

위에 코드를 정상적으로 스킨에 넣은 뒤, 파이어폭스의 플러그인인 파이어버그로 미리 구독버튼위 좌표값을 조절해서 맞춰볼 수 있습니다. 파이어폭스의 파이어버그(firebug) 가 궁금하신 분은 여기를 눌러주세요.

파이어버그(firebug) 에서 CSS 탭에서 viewonAdd 를 검색 후, margin 의 좌표값을 조절해서 자신이 원하는 곳에 나타나도록 설정을 해봅니다. -228px 0 0 499px 의 4개의 설정값은 차례대로 위,오른쪽,아래,왼쪽 의 좌표값입니다.

자신이 원하는 곳에 조절을 했다면 그 설정값을 잘 기억해두시고 위에서 스킨에 넣은 값에 내용을 변경을 해줍니다.
저장 후 재대로 뜨는지 확인을 합니다.

다음뷰 구독 버튼 설치 방법 및 위치 조절 설명 동영상

다음뷰 구독 버튼 설치 연관 링크들

XHTML 웹표준 틀리기 쉬운 문법들
블로그 팁 다음뷰 버튼 배경 꾸미기
파이어버그로 티스토리 스킨 미리 수정하기