분류 목록
    분류 전체보기 (1638)
    남식이의 생활 이야기 (149)
    유용한 정보<휴대폰> (750)
    유용한 정보<컴퓨터> (692)
    유용한 정보<기타> (47)
소셜 통합 플러그인을 만들어보았습니다.
 과거에 필자의 블로그에 적용하여 사용하던 쿠나님의 대통합 플러그인(새창)을 참고하여 현재 추세에 맞는 새로운 버젼의 소셜 통합 플러그인을 제작하게 되었습니다. 쿠나님께서 제작하신 대통합 플러그인의 목적을 크게 벗어나지 않았으며, 디자인도 오래된 디자인을 벗어던지고, 다음 view on의 버튼 디자인으로 변경하였습니다.


소셜 통합 플러그인?

 다음에서 운영중인 티스토리의 경우에는 SNS소셜플러그인(새창)을 지난 2010년부터 제공하고 있지만, 필자의 경우에는 플러그인의 디자인(새창)이 필자의 블로그와 어울리지 않는다고 판단되었고, 필자의 블로그에서 사용하고 있던 쿠나님의 대통합 플러그인(새창)의 연식이 있다보니 동작하지 않는 사이트가 다수 포함되어 있어서, 이번 기회를 통하여 동작하지 않는 사이트의 버튼을 삭제하고 Facebook(페이스북), Twitter(트위터), me2day(미투데이)로 글보내기 기능을 추가한 새로운 버젼의 대통합 플러그인을 제작하게 되었습니다.


소셜 통합 플러그인 (2013/07/08 ver 0.3) 

 상단의 회색박스에 첨부된 소셜 통합 플러그인은 2013년 07월 08일 배포한 0.3버젼의 소셜 통합 플러그인이며, 플러그인에서 사용하는 버튼의 이미지, 본문소스(710), 본문소스(680/프린트버튼 제거)에 대한 내용을 포함하고 있습니다. 해당 플러그인은 불규칙적으로 업데이트가 이루어질 수 있으며, 티스토리의 플러그인 설정에서 Daum View, 믹시를 선택한 후 '표시하지 않음 및 표시안함'을 선택하시고, SNS 글보내기 플러그인은 활성화시켜주세요.


소셜 통합 플러그인 수정하기

 상단에 첨부한 스크린샷은 소셜 통합 플러그인의 소스의 내용 중 일부이며, 사용자가 분홍색으로 표시한 부분은 사용자님이 수정하여야 하는 부분을 표시하고 있습니다. Mixsh의 MUID는 믹시 홈페이지에 로그인하신 후 마이믹시→등록된 블로그를 선택하시면 주소창에 MUID를 쉽게 확인할 수 있습니다. 참고로 Facebook(페이스북), Twitter(트위터), me2day(미투데이)의 경우에는 별도로 수정하지 않아도 사용하실 수 있습니다.


소셜 통합 플러그인 적용 (티스토리의 경우) 

skin.html

style.css
 필자의 소셜 통합 플러그인은 HTML/CSS 편집(스킨 편집)에서 skin.html의 경우 [##_article_rep_desc_##]을 선택하신 후 소셜 통합 플러그인의 소스를 넣어주시면 되며, style.css에는 추가로 .tt-sns-wrap { display:none; }를 기재해주시면 PC용 보기 화면에서는 티스토리의 기본 소셜 네트워크가 나타나지 않도록 할 수 있습니다.


티스토리가 아닌 경우 추가로 삽입해주셔야하는 소스 

 티스토리가 아닌 설치형 테터툴즈, 텍스트큐브를 이용중인 경우에는 위에서 빨간색으로 표시한 소스를 <head>와 </head>사이에 넣어주시지 않으시면, Facebook(페이스북), Twitter(트위터), me2day(미투데이) 글 보내기 기능이 정상적으로 동작하지 않는 문제가 있으므로 반드시 넣어주셔야 합니다.
의견을 남겨 주세요
  1. 코알라 2013.07.02 07:50 수정/삭제 댓글쓰기

    남식님 글에 첨부된 플러그인을 제 블로그에도 적용했는데요. 전부다 좋은데 제가 원하는 Google+를 추가하는 방법은 없을까요? 솔직히 mixsh보다 google+를 통한 유입자수가 더 많다보니...

    • Favicon of https://jnstory.net 조남식 2013.07.02 17:21 신고 수정/삭제

      Google+도 소스를 약간만 변형시켜주시면 충분히 추가하실 수 있습니다. 압축파일내 첨부된 psd파일을 변형시켜 google+ 아이콘을 만드시거나, google+에서 제공하는 위젯을 적용시켜도 무방합니다. 만약, 도움이 필요하시다면 도움을 드릴 수 있으니 언제든 댓글로 문의해주세요~^^

  2. Favicon of http://vode.tistory.com/ 나만의스타일.com 2013.07.27 00:27 수정/삭제 댓글쓰기

    감사합니다 잘적용되어서 잘쓰고있습니다 ㅎㅎ

    • Favicon of https://jnstory.net 조남식 2013.07.27 10:36 신고 수정/삭제

      네, 도움이 되었기를 바랍니다~^^
      혹여라도 다른 문제가 있다면 댓글을 통해서 알려주시면 즉시 수정하여 게시할 수 있도록 하겠습니다~^^

Powerd by Tistory, designed by criuce, modify by Namsik's Story
RSS
TOP