요즘 SNS가 유행이고 최근에는 Facebook이 대세라 다음뷰위젯 하단에 Facebook 소셜 플러그인이 설치된 모습이 많이 보이고 있습니다. 하지만 티스토리에서 지원하는 소셜플러그인은 다음뷰위젯하단에는 어울리지만 믹시와 같이 있으면 지저분해 보인다는 느낌을 많이 받았습니다. 

 

 
 오늘글은 믹시2.0이 업데이트된 기념으로 Facebook소셜 플러그인과 다음뷰, 믹시위젯을 테이블 태그와 잘 어울리도록 배치하는 포스팅을 한번 해봤습니다. 


테이블 태그를 이용한 소셜 플러그인과 추천위젯배치

 가로폭 683px( Life in Mono 기본스킨)에 최적화 되어 있습니다. 

1. Facebook 소셜플러그인 생성하기 [바로가기]

Facebook은 잘 사용하질 않아서 어떤 플러그인이 좋은지 몰라 가로폭이 지정이 가능한 두번째 플러그인을 임의로 선택해 가로폭 200과 세로폭 190으로 생성해줬습니다. Get Code를 누르면 Facebook 소셜플러그인 위젯 코드가 복사됩니다.



2. 티스토리 > 플러그인 > 다음뷰, 믹시위젯 보이지 않음으로 설정

 다음뷰와 믹시위젯을 플러그인을 통해서 자동으로 생성되는것을 보이지 않음으로 설정한뒤 자신이 원하는 위치에 넣어주시면 됩니다. 티스토리 > 플러그인에 접속 > 해서 다음뷰와 믹시위제을 보이지 않음을 선택하고 저장해주시면 됩니다. 



3. 테이블 태그를 이용한 소셜 플러그인과 추천위젯 배치 코드만들기

 추천위젯배치.txt내용을 자신의 블로그에 맞게 수정하신뒤 HTML/CSS편집에서 하단의 그림처럼 배치해주시면 됩니다. ( 본문폭이 683px에 최적화 되어있습니다. )


 

테이블 여백주기 추가 설명


4. 다른글 보기 이동 하는법 
(출처 : missflash님)

HTML/CSS편집을 통해서 추천위젯을 설치하면 추천위젯 상단에 다른글보기가 나타나게 됩니다. 다른글 보기를 추천위젯 하단으로 옮기려면 아래 내용을 참고하시면 됩니다.  

 - 아래 파일의 내용을 Skin/css편집 Skin.html에서 </title>뒤에 복사해줍니다.



 
- 아래 피일의 내용을 위에 추천위젯 코드 하단에 복사해주시면 됩니다.


<!-- 카테고리 다른글 더보기  -->
<div id="MF_Reference" class="another_category another_category_color_gray"></div>
<script type="text/javascript">
//<![CDATA[
// Created by MissFlash(http://blog.missflash.com)
var MF_Reference = document.getElementById('MF_Reference');
MF_Reference.setAttribute("id", "MF_Reference" + MissFlash_Div_Num);
MF_Reference.className = "another_category another_category_color_gray";
var ref_source = getElementsByClass(MissFlash_Div_Num,"another_category");
MF_Reference.innerHTML = ref_source;
MissFlash_Div_Num += 1;
//]]></script>
<!-- 카테고리 다른글 더보기  -->


후기

 테이블에 선이 안보이기를 원하시면 3번의 추천위젯코드의 첫줄을 <table border=0 width=100% cellspacing=0 cellpadding=0>로 변경하거나 테두리선 색상을 바탕색과 같은 #ffffff로 수정해주시면 됩니다. 가로폭이 683보다 넓거나 짧으신분들은<td width="270" rowspan="3" align=center>에서 270의 숫자를 조정해주시면됩니다.
 
 아하라한님 블로그에 추천위젯과 구글애드센스 광고가 잘 배치된것을 보고 소셜플러그인을 그자리에 넣어보면 괜찮을것 같아서 그 방법을 간단히 포스팅해봤습니다. 이번기회에 오늘 포스팅을 참고하셔서 본문하단의 추천위젯들을 한번 정리해보세요 ^^;  



신고

댓글을 달아 주세요

  1. 이전 댓글 더보기
  2. 수 있도록 노력하겠오랫동안 블로그에서 제공되었던 기능이 종료되어 아쉽지만, 더 유용한 기능을 제공할 수 있도록 노력하겠

    2013.06.12 21:05 신고 [ ADDR : EDIT/ DEL : REPLY ]
  3. 공할료되어 아쉽쉽지만, 더 유용한 기능을 제공할료되어 아쉽쉽지만, 더 유용한 기능을 제공할료되어 아쉽

    2013.06.14 16:42 신고 [ ADDR : EDIT/ DEL : REPLY ]
  4. 구하고 벌써 뉘엿뉘엿 지는 석양을 바라보며 달리는 스노모빌은 마치 영화 007 시리즈의 한 장면 속에 들어 와 있는 듯한 느낌이 든다.

    2013.06.15 20:33 신고 [ ADDR : EDIT/ DEL : REPLY ]
  5. 다양한 부족들이 일가를 이루며 핀란드, 스웨덴, 노르웨이, 러시아 등 여러 나라에 걸쳐 살아 왔다

    2013.06.17 21:12 신고 [ ADDR : EDIT/ DEL : REPLY ]
  6. 댓글 쓰려다 보면 페북에 올라오는 글 들 때문에 번거로울 때가 있습니다.^^

    2013.06.21 19:45 신고 [ ADDR : EDIT/ DEL : REPLY ]
  7. 노력하겠습니다.이용하시면서 주신 많은 의견은 적극 검토하여 앞으로 더 좋은 기능이 될 수 있도록

    2013.06.24 17:01 신고 [ ADDR : EDIT/ DEL : REPLY ]
  8. 안정되고 튼튼한 서비스로 만들기 위한 것으로 많은 양해 부탁드립니다.

    2013.06.28 15:23 신고 [ ADDR : EDIT/ DEL : REPLY ]
  9. 는 글을 보다가 자기가 예전에 쓴 글 중 B라는 글이 A라는 글과 관계있어보여

    2013.07.03 17:47 신고 [ ADDR : EDIT/ DEL : REPLY ]
  10. 수있는 분야입니다. 나는 어떤 기업은 사람들이 그에게서 구입하기 어려운 것 이유를 이해하지 않습니다.

    2013.07.06 16:26 신고 [ ADDR : EDIT/ DEL : REPLY ]

  11. 이제 블로그를 만들었으니 글 쓰는 방법에 대해 알아봅시다.

    2013.07.06 17:36 신고 [ ADDR : EDIT/ DEL : REPLY ]
  12. 산업을 지칭하는 개념이었으나 향후에는 제조업과 서비스를 포함한 산업 전반으로 범위가 확대될 것이다.

    2013.07.06 20:01 신고 [ ADDR : EDIT/ DEL : REPLY ]
  13. 미래에, 제조 및 서비스 산업 등은 범위를 확장 할 것입니다

    2013.07.09 15:59 신고 [ ADDR : EDIT/ DEL : REPLY ]
  14. 게임 일 수 있었다. 가능한 한 빨리이 게임을 완성 수 스킬을 많이 해야 합니다.

    2013.07.09 17:30 신고 [ ADDR : EDIT/ DEL : REPLY ]
  15. 항상이 정보의 업데이트에 대한 모습에

    2013.07.12 21:14 신고 [ ADDR : EDIT/ DEL : REPLY ]
  16. 바로 입력할 수 있으며, 입력된 내용은 꾸미기 적용 시 함께 반영됩니다. 또 폰트의 종류와 크기, 색상을 설정하거나 테두리 위치, 그림자 및 반사 효과 사용 여부를 설정할 수 있습

    2013.07.21 16:21 신고 [ ADDR : EDIT/ DEL : REPLY ]
  17. 다시 띄우고, 글자를 복사해다가 검색창에 붙여넣는 귀찮음 때문에 그냥 대충 ~ 넘어가기도 하구요.

    2013.07.21 19:59 신고 [ ADDR : EDIT/ DEL : REPLY ]
  18. 오랫동안 블로그에서 제공되었던 기능이 종료되어 아쉽지만, 더 유용한 기능을 제공할 수 있도록 노력하겠습니다.

    2013.07.22 15:07 신고 [ ADDR : EDIT/ DEL : REPLY ]
  19. 서 기존에 올리신 사진만 이용하실 수 있었던 핸드폰 보관함 기능이 2012년 8월 21일에 종료하게 되었습니다.

    2013.07.22 16:50 신고 [ ADDR : EDIT/ DEL : REPLY ]
  20. 꾸준히 활동해주시는 좋은 블로거 분들을 소개하고 우수블로거 분들께 다양한 지원을 해드리고자 노력하고 있습니다

    2013.07.25 16:25 신고 [ ADDR : EDIT/ DEL : REPLY ]
  21. 서 제 5회 YES24 블로그 축제 Level Up 파티! 를 개최합니다.
    이번 파티는 지난 6월에 진행된 블로그 축제에서 선정된 우수 글 책 발간을 축하하는 자리로

    2013.07.29 14:20 신고 [ ADDR : EDIT/ DEL : REPLY ]

티스토리 툴바