미투데이 버튼 그리고 요즘 버튼

프로그래밍/Web

Elex 2011. 8. 15. 04:34

삽입된 현재 문서의 제목과 주소를 알아서 처리하는 기능이며, 공개된 공식 삽입 소스가 없어서 자바스크립트로 대충 만듦. 원래는 PHP로 소스를 뿌려주는 방식으로 짠건데 보기 좋게 살짝 손 봐서 올립니다.

웹 페이지의 적당한 삽입 위치에 <a> 태그를 지정해두고 스크립트가 실행되면 각각의 id를 찾아서 링크 주소 및 해당 이미지를 처리함.

웹페이지

자바스크립트

/scripts/socialButtons.js

var sPost = encodeURI(document.title);

var sLink = encodeURI(window.location.href);

var sTag = encodeURI("미투데이 태그");

me2day(sPost, sLink, sTag);

yozm(sPost, sLink);

function me2day(me2Post, me2Link, me2Tag) {

var me2day = document.getElementById("me2day-button");

me2day.setAttribute("href", 'http://me2day.net/plugins/post/new?new_post[body]="' + me2Post + '":' + me2Link + '&new_post[tags]=' + me2Tag);

me2day.setAttribute("target", "_blank");

me2day.innerHTML = '<img src="/images/me2-button.png" />';

}

function yozm(yozmPost, yozmLink) {

var yozm = document.getElementById("yozm-button");

yozm.setAttribute("href", 'http://yozm.daum.net/api/popup/prePost?link=' + yozmLink + '&prefix=' + yozmPost);

yozm.setAttribute("target", "_blank");

yozm.innerHTML = '<img src="/images/yozm-button.png" />';

}

버튼 이미지는 각 브랜드의 CI를 받아서 대략.. 20픽셀로 그렸음.

주소 및 매개변수는 예전에 쓴 글을 참고하세요.