본문 바로가기
▶ Special/○ 블로그(Blog)

티스토리 블로그에 트위터(Twitter)위젯 설치하기

by 빨간꿈 2013. 7. 5.


티스토리 블로그에 트위터(Twitter)위젯 설치하기



기본적으로 트위터에서는 홈페이지,카페,블로그 등 외부설치를 위한 트위터 위젯을 제공해줍니다. 이렇게 제공해준 위젯은 클릭몇번이면 간단히 생성이 가능하며 필요시 엄청난 커스터마이징까지 가능하도록 다양한 소스와 스크립트를 제공해줍니다. 부분설치가 가능한 티스토리 블로그는 이렇게 생성한 소스코드를 바로 불러와서 적용시켜 볼 수 있습니다. 자 그럼 티스토리 블로그에트위터위젯을 생성하는 법을 알아보겠습니다. 




먼저 트위터계정에 접속합니다.  그리고 '설정' > '위젯' > '새로만들기' 를 클릭합니다. 



사용자 위젯만들기 항목이 나오면 계정 아이디가 노출되며 설정항목을 간단히 세팅할 수 있습니다. 세팅내용은 직관적이고 쉬우므로 누구나 손쉽게 위젯코드를 생성할 수 있습니다. 



간단히 설정을 마치고 <위젯만들기>를 클릭하면 코드생성이 가능합니다. 이렇게 생성된 코드를 바로 사용해도 되나 이대로 사용하기에는 조금 부족해보입니다. 살짝 커스터마이징을 해보겠습니다. 똑같이 트위터의 <위젯>을 클릭하면 만들어진 계정의 수정버튼이 보입니다. 여기서 아래에 보이시는 <커스텀옵션>항목을 클릭합니다. 



여기서부턴 좀 어렵습니다. 어느정도의 HTML에 대한 이해가 필요하고 영어를 읽을 줄 알아야 합니다. 커스텀옵션을 클릭하면 아래와 같이 다양한 소스와 스크립트들에 대한 설명이 있습니다. 개개인별로 필요한 항목이 무엇인지 찾고 적용방법을 확인하시기 바랍니다. 




저는 나름 블로그에 맞게 트윗수,사이즈와 색상, 선굶기등을 수정해보았습니다. 아래는 최종적으로 생성한 소스코드로 티스토리 사이드바에 적용하였습니다. 트위터에서 위젯을 만들어야만 아이디가 생성되는 구조이므로 소스는 공유로 사용할 수 없습니다. 다만, 아래 제가 수정한 부분들과 추가한 항목을 비교해보신다면 기본위젯에서도 충분히 위젯 외형을 수정하실 수 있으실 겁니다.



# 기본 수정소스:  가로 width=" "  / 세로 height=" " / 색상 color=" " 트윗수 data-tweet-limit=" "



위 코드를 적용한 화면입니다. 아주 심플한 트위터위젯이 완성되었습니다. 이제 트위터를 블로그에 달아보세요^^ 



반응형


댓글