[텍스트큐브] SNS에 글 보내는 단추 달기 0.91

텍스트큐브/끼우개 2011/03/29 20:34 글쓴이 : 팥알

〈새 판 목록〉

SNS와 즐겨찾기에 글을 쉽게 보내도록 단추를 다는 플러그인(확장기능, 추가기능)을 공개합니다.

기능 및 특징

SNS와 즐겨찾기를 연결하는 단추를 달고 글 제목과 주소를 넣어 줌
플러그인 설정으로 본문 위나 아래에 단추를 닮
위젯 설정으로 옆막대(사이드바)에 단추를 닮
블로그 스킨에 치환자 [##_SNS_icons_##]로 단추를 닮
넣는 곳마다 단추 모양, 정렬 방식, 간격, 여백을 조절할 수 있음
넣을 SNS와 즐겨찾기(트위터, 페이스북, 미투데이, 요즘, C공감, 구글 즐겨찾기, 디그, 딜리셔스)를 고를 수 있음
쪽그림(아이콘) 옆에 이름을 나타낼 수 있음
글쓴이의 트위터 아이디를 넣으면'via @아이디'를 넣음
트위터만 단축 추소(t.co)를 쓸 수 있고, 나머지는 고유 주소를 씀 (강제로 숫자 주소를 붙일 수 있음)
사용 환경 : 텍스트큐브 1.8 이상. 인터넷 탐색기(IE) 6~8, 파이어폭스(Firefox) 3.6, 크롬(chrome) 10, 오페라(Opera) 11 등

아직 트위터를 빼고 단축 주소를 넣는 기능은 넣지 못했습니다.

쪽그림, 글 단추 예시

플러그인 설정에서 단추 모양, 간격, 여백 등을 조절하면 아래처럼 쪽그림(아이콘)이나 글 단추를 붙일 수 있습니다.

환경 설정

받기

고치거나 더함

문제점을 알려 주시고 고치는 데에 도움을 주신 부사리님, 아르님께 감사 드립니다.

0.91.1

새로 열리는 창 크기를 조절함

0.91

객체의 id, class를 잘못 지정하여 HTML 문법 검사를 통과하지 못하는 것을 바로잡음
방명록, 글 분류, 보관함 등을 블로그 대표 주소가 아닌 원래 주소로 연결함

0.903

트위터에 짧은 주소(t.co)로 연결할 때 한글이 들어간 제목(문자) 주소를 받지 못하여 숫자 주소로 보내도록 바꿈
파이어폭스 등에서 새 창을 띄우게 함

0.902

IE7에서 쪽그림이 세로로 나오지 않게 고침

0.901

블로그 대표 주소로 최근 글이 뜰 때 글 주소와 꼬리표를 가져 오지 못하는 문제를 해결

알고 있는 문제

구글 즐겨찾기 등에 들어가는 본문 앞머리에 첨부한 그림 등의 치환자가 그대로 들어 감 (removeAllTags()를 쓰면 [##_SNS_icons_##]가 들어간 글이 나오지 않아서 이 함수를 주석 처리하여 생기는 문제) → 1.0판에서 해결함

보람말 : C공감, delicious, digg, facebook, SNS, SNS_icons, social network service, tinyMCE, twitter, 구글, 글 보내기, 단문, 단추, 디그, 딜리셔스, 미투데이, 사회망, 아이콘, 요즘, 즐겨찾기, 쪽그림, 쪽글, 추가기능, 치환자, 텍스트큐브, 트위터, 페이스북, 편집기, 플러그인, 확장기능

걸린 글 1 / 덧글 31

글 걸기 주소 : 이 글에는 글을 걸 수 없습니다.

<걸린 글>

블로그 방문자를 위한 배려, SNS 단추 달기

도아의 세상사는 이야기2011/06/29 13:28

얼마 전 인터넷에서 우연히 상당히 깔끔하며 눈에 거슬리지 않는 Cute Profiles[주:나도 원래 이름은 몰랐다. 다른 사이트에서 이미지와 스타일을 가져와 달았기 때문이다. 그런테 트위터(Twitter)를 통해 @premist님이 질문을 해서 확인한 것이다.]이라는 것을 발견했다. 정확히 어떤 사이트에 올라왔는지는 기억나지 않는다. 다만 깔끔함과 눈에 거슬리지 않는 디자인 때문에 그 사이트의 이미지와 스타일 시트를 가져와 내 블로그에 같은 방법...

덧글을 달아 주세요

Ryan 2011/03/30 00:38 고유주소 고치기 답하기

안녕하세요.플러그인 잘 사용하고 있습니다. 유용한 플러그인 만들어 주셔서 감사합니다. 그럼 행복하세요~~
- 팥빙산 2011/03/30 10:25 고유주소 고치기 답하기
  
  고맙습니다. 문제점이나 더 넣을 기능이 있으면 알려 주세요.
  블로그 사진들이 참 멋지네요.
부사리 2011/03/30 10:48 고유주소 고치기 답하기

안녕하세요. 좋은 플러그인 감사합니다.
일부 IE에서 문제가 있습니다.

제가 테스트해본 브라우져는 크롬(플러스포함), IE6, IE7, IE8, IE9인데요.
다른 브라우져는 문제없는데 IE7, IE8 두 버전에서 그림이 세로로 나옵니다.
정렬상태하고 는 상관이 없네요.
일단 플러그인은 꺼두었습니다. ^^;

즐거운 하루되세요~~!
- 팥빙산 2011/03/30 11:03 고유주소 고치기 답하기
  
  혹시 IE에서 호환성 보기를 켜지 않으셨나요.
  <button> 태그를 쓰면 어느 브라우저든 잘 나오지만 RSS에 단추가 나옵니다.
  그래서 IE6만 <button>을 쓰고 나머지는 <div>를 썼습니다.
  IE6에서는 <div>를 쓰면 세로로 나오는데, 호환성 보기 때문에 IE6처럼 나타나지 않나 싶습니다.
- 팥빙산 2011/03/30 14:17 고유주소 고치기 답하기
  
  IE7을 깔아서 세로로 나오는 걸 확인했습니다.
  IE7에서 점검하기는 했었는데 자꾸 고치다가 IE7이 깔린 PC를 쓰지 못하여 놓쳤습니다.
  IE8에서는 호환성 보기만 하지 않으면 잘 나옵니다.
  고쳐서 곧 다시 올리겠습니다.
  
  알려 주셔서 고맙습니다.^^
- 부사리 2011/03/30 14:36 고유주소 고치기 답하기
  
  이런 저 때문에 IE까지 설치하시고 ^^;
  
  패치나오면 감사히 받겠습니다. ^^
  
  즐거운하루되세요.
- 팥빙산 2011/03/30 14:41 고유주소 고치기 답하기
  
  글 보내기 단추를 넣은 티스토리 블로그는 <button> 태그 때문에 RSS 본문 아래에 트위터, 미투데이 등의 단추가 나오는 걸 볼 수 있습니다.
  그걸 감추려고 애써 div를 썼습니다.
  플러그인 설정에서 글 단추로 넣게 하거나, 플러그인 파일에서 div를 button으로 바꿔서 RSS 캐시를 지우고 다시 보면 그런 모습을 볼 수 있습니다.
- 부사리 2011/03/30 15:16 고유주소 고치기 답하기
  
  빠른 답변감사합니다. ^^
  저는 설치형TC여서 div를 button으로 변경했는데도 아무 변화가 없었던 거군요. ^^
- 팥빙산 2011/03/30 15:37 고유주소 고치기 답하기
  
  다시 고쳐 올렸습니다.
부사리 2011/03/30 15:39 고유주소 고치기 답하기

팥빙산님 버그리포트(?) 하나더요... ^^
글 고유주소를 "그대로쓰기", 트위터 "단축주소" 설정 이렇게 하고
포스팅글 리트윗 하면 단축주소가 생성이 안되고

제목+via @아이디 이렇게 나옵니다.
아마도 제 블러그주소가 문자로 설정되어 있어서 그런듯 합니다.
저는 숫자로 보내기 설정해서 사용할거라 상관은 없지만
그냥 그렀다구요. ^^
고생하면서 만들어 주신건데 제가 귀찮게 하네요 ^^;
- 팥빙산 2011/03/30 16:09 고유주소 고치기 답하기
  
  귀찮다니요.
  부사리님 덕분에 문제점을 바로 고칠 수 있어서 감사할 따름입니다.
  자바로 만들었을 땐 잘 나왔는데, 플러그인으로 바꾸니 문제가 생기네요.
  고쳐서 올리겠습니다.
- 부사리 2011/03/31 07:28 고유주소 고치기 답하기
  
  패치 감사합니다. 이제 정상 작동하네요.
  아...그리고 팥빙산님 어디서 본듯하다 했는데 라이브리 관련글에 댓글 달았었더군요. 몰라뵈서 죄송 ^^;
  저도 스킨색깔 문제때문에 라이브리 내렸네요.
  
  즐거운 하루되세요...
비밀방문자 2011/03/31 09:18 고유주소 고치기 답하기

관리자만 볼 수 있는 덧글입니다.
- 팥빙산 2011/03/31 09:36 고유주소 고치기 답하기
  
  마침 웹 표준 문제를 지금 보고 있었습니다.
  거의 고쳤으니 각 브라우저마다 잘 나오는지 확인하고 올리겠습니다.
- 팥빙산 2011/03/31 13:09 고유주소 고치기 답하기
  
  수정해서 올렸습니다. ^^
서비 2011/03/31 14:20 고유주소 고치기 답하기

와우 열심히 스킨 고치고 있었는데 쉽게 해결이 되서 좋습니다.
한가지 아쉬운게 있다면.. 직접 코드를 삽입한 것과 달리.. 버튼을 클릭하면 새 창이 너무 크게 뜨는데.. 이 부분은 개선 할 계획이 있으신가요?
- 팥빙산 2011/03/31 16:14 고유주소 고치기 답하기
  
  핑계를 댄다면 만들다가 무난하다 싶은 크기로 열게 한 적은 있는데,
  가로폭이 긴 유난히 미투데이를 보고 그만 두고 말았습니다.
  
  마음에 드실지는 모르겠지만, 750*510 크기로 창을 열게 하고 미투데이만 가로로 길게 열도록 고쳤습니다.
디자인공유 2011/04/05 13:36 고유주소 고치기 답하기

유튜브버튼도 있었으면 합니다^^ 텍큐 공부하고있는데 유용한 정보 조합해서
다시 블로그만들고 싶습니다^^
- 팥빙산 2011/04/05 14:51 고유주소 고치기 답하기
  
  유튜브 단추라면 본문에 들어 있는 영상을 공유하는 것 말씀이시죠?
  끼워넣기가 쉽지는 않을 것 같은데 궁리는 해 보겠습니다.
와일드 2011/04/07 23:10 고유주소 고치기 답하기

안녕하세요. 올려주신 플러그인을 사용하려고 합니다.
그런데, 단추를 다는 위치가 플러그인설정에서는 제한되어 있더군요.
•블로그 스킨에 치환자 [##_SNS_icons_##]로 단추를 닮
↑ 위의 문구로 위치 조정이 가능한것 같은데, 어떻게 해야 하는지 모르겠더라고요.

좀더 자세하게 설명해주실 수 있나요??

치환자를 복사에서 본문에 붙여넣기 하면되는건가요? (정말 무식한 질문이네요 ㅠ.ㅠ)
- 팥빙산 2011/04/08 00:12 고유주소 고치기 답하기
  
  텍스트큐브 관리자 설정에서 '꾸미기' -> '스킨 편집'으로 들어가면 skin.html을 고치는 화면이 나옵니다.
  거기에서 적당한 곳에 [##_SNS_icons_##]를 끼워넣으면 됩니다.
  공개된 글의 본문 영역은 <s_article_rep>과 </s_article_rep> 사이이고, [##_article_rep_desc_##]가 본문입니다.
  본문 바로 위에 넣으려면 [##_article_rep_desc_##] 앞에 [##_SNS_icons_##]를 넣으면 됩니다.
  
  작성한 글이 아니라 블로그 스킨의 skin.html에 치환자를 넣어야 합니다.
- 와일드 2011/04/08 08:31 고유주소 고치기 답하기
  
  설명 감사합니다.
  치환자를 적용하는것은 이제 알게되었습니다.
  그런데, 제가 사용중인 'Creative Commons License'플러그인을 적용하면
  → 본문 → 플러그인 → 'SNS ICON' 순으로 배열됩니다.
  'Creative Commons License'플러그인 위에 오게 하기 위해선 어떻게 해야하나요? ^^;;
  (어려운 작업이면 그냥 현상태로 사용할려고 합니다. )
- 팥빙산 2011/04/08 08:52 고유주소 고치기 답하기
  
  확장기능(플러그인)은 /plugins 안에 만든 자료방(디렉토리) 이름 순서대로 실행됩니다.
  앞에 a가 붙은 확장기능이 z가 붙은 확장기능보다 먼저 처리됩니다.
  CCL 확장기능은 본문 아래에 붙이는 방식인 걸로 기억하고 있습니다.
  본문 위나 아래에 붙이는 확장 기능은 맨 나중에 실행한 것의 내용이 맨 끄트머리에 들어갈 겁니다.
  SNS 단추 다는 확장기능을 먼저 실행하게 이름을 바꿔 주고 본문 아래에 넣도록 하면 될 것 같습니다.
- 와일드 2011/04/10 15:16 고유주소 고치기 답하기
  
  폴더이름만 바꿨더니...플러그인 기능이 활성화되지 않넨요~ 아무래도 폴더명만 변경한다고 되는게 아닌가봐요?
  하하하..
  어렵네요~ 감사합니다.
bighey 2011/04/13 22:07 고유주소 고치기 답하기

유용하게 잘 쓰고 있습니다...^^
질문이 있는데요..

페이스북에 보내려고 할때...
썸네일과 본문이 나오는 경우가 있고..
이미지와 본문이 있음에도 페이스북에 보낼때 나타나지 않는경우가 있는데요..
어떻게 해야 하나요?
- 팥빙산 2011/04/14 00:17 고유주소 고치기 답하기
  
  이 확장기능이 페이스북에 보내는 정보는 글 주소뿐이고, 본문 내용과 그림은 페이스북이 알아서 나타냅니다.
  페이스북의 능력에 달려서 어찌할 수 없는 것 같고, 나중에 보면 달라질 때는 있었습니다.
집토끼닷컴 2011/04/24 02:44 고유주소 고치기 답하기

1.85버전에서 잘쓰고있습니다.
한가지 건의사항있는데요.
버튼에 마우스를 가져다 놓으면 검지손가락 모양으로 마우스 포인트가 안바뀌는게 좀 아쉽네요. 혹시 수정할 방법은 없나요?

또 한가지 1.78 버젼 블로그에서 적용이 안되고 사이드바 오류가 나더군요..
처음엔 1.8 이상에서 작동하는지 몰랐거든요.
혹시 1.78버젼에서 쓸수있는 방법은 없나요? 1.78 버전용 sns버튼은 아무리 검색해도 정보를 찾을수가 없네요
- 팥빙산 2011/04/24 03:57 고유주소 고치기 답하기
  
  IE 7 이하에서 쪽그림에 댈 때 손모양이 안 나오는군요.
  손모양 문제는 이미 수정하긴 했습니다.
  곧 새 판을 내려고 하니 좀 기다려 주시기 바랍니다.
  
  1.78 이하에서 쓸 수 있게 고치려는 생각은 했지만 우선 필요한 기능부터 넣느라 신경 쓰지 않았습니다.
  아는 게 딸리고 기능에 비해 경우 수가 많아 시간을 많이 까먹고 있습니다.
  좀 더 시간을 두고 살피려고 합니다.
- 집토끼닷컴 2011/04/25 03:55 고유주소 고치기 답하기
  
  답변 잘 읽었습니다.
  그런데 저는 IE8버젼을 쓰고있습니다 8버전에서도 문제가 있는거같네요 그러면...
  1.78에서도 사용할수있기를 기대해봅니다
  아무튼 잘 사용하고있습니다 감사합니다.
TZST 2011/04/25 15:03 고유주소 고치기 답하기

안녕하세요 ... 유용한 플러그인을 만들어 주셔서 정말 잘 쓰고 있습니다.

그런데 한가지만 여쭤볼려구요 ..한페이지에 여러개의 글이 있을경우 css가 중복으로 출력이 되는거 같아 css출력부분을 빼버리고 skin.css에 직접입력해서 쓰고 있고 같은 id가 여러번 출력되면서 HTML 문법 검사에 걸려서 전부 id를 class로 변경해서 사용하고있는데 혹시..판올림 하면 괜찮은건가요 ?

기능은 아주 잘 사용하고 있습니다(아직 블로그글이없어 테스트만....) ^^;;
- 팥빙산 2011/04/25 16:19 고유주소 고치기 답하기
  
  아, 그렇군요.
  한 쪽에 여러 글이 나올 때를 살피지 않았습니다.
  판올림할 때 반영하겠습니다.
  
  알려 주셔서 고맙습니다.^^