EnglishFrenchGermanItalianKoreanPortuguese



티스토리에서 기본적으로 제공하는 SNS 공유 플러그인이 있지만 디자인도 그리 이쁘지 않고, 카카오스토리. 트위터, 페이스북 이렇게 3곳만 지원하고 있어 항상 아쉽다고 생각했는데 바꿀 수 있는 방법이 없을까?! 검색을 해보았습니다. 검색을 해보니 몽리님 블로그 SNS 공유 버튼 4종 소개 글이 있어 그 글을 보고, 자세하고 쉽게 그리고 소스 공유까지 해주신 친절하신 블로거님 글을 따라 제 블로그에 적용해보았습니다.



▲ 티스토리 기본 SNS 공유 버튼




▲ 제 블로그에 적용한 SNS 공유 버튼




▲ 모바일에서 잘 나오는지 확인




티스토리 기본 SNS 공유 버튼은 관리자 - 플러그인 설정에 들어가 해제하여 중복으로 나오지 않게 하였습니다.










▲ Byner 님 블로그 SNS 공유 버튼

http://itlounge.net/9





▲ IT넘버원 님 블로그 SNS 공유 버튼

http://prolite.tistory.com/783






Byner 님 블로그에서 공유해주신 소스와 IT넘버원 님이 공유해주신 이미지로 제 블로그에 적용하였습니다.


친절하신 두 분 블로그에 가시면 이미지 압축 파일과 적용하는 소스 파일이 첨부되어 있고, 적용 방법 또한 저 같은 초보자도 쉽게 따라 할 수 있도록 자세히 설명되어 있으니, Byner 님과 IT넘버원 님 블로그에 방문하셔서 나머지를 진행을 하시면 됩니다.




이 아래 내용은 제가 적용한 방법을 나열하여 나중에 블로그 스킨 변경이나 새로운 SNS 공유 버튼을 추가하고 싶을 때를 대비 쉽게 찾을 수 있게 기록해두려 합니다. (저 같은 초보 분들은 참고하셔도 좋을듯합니다.)



- Byner 님 공유 소스 및 이미지를 받아 압축 해제


- IT넘버원 님 공유 이미지를 받아 압축 해제


- IT넘버원 님 공유 이미지 파일명을 Byner 님 공유 이미지 파일명으로 변경


- HTML/CSS ->파일업로드에 파일명 변경한 IT넘버원 님 공유 이미지 파일을 업로드 및 저장


- HTML/CSS ->HTML 에서 CTRL+F


티스토리에서 기본적으로 제공하는 SNS 공유 플러그인이 있지만 디자인도 그리 이쁘지 않고, 카카오스토리. 트위터, 페이스북 이렇게 3곳만 지원하고 있어 항상 아쉽다고 생각했는데 바꿀 수 있는 방법이 없을까?! 검색을 해보았습니다. 검색을 해보니 몽리님 블로그 SNS 공유 버튼 4종 소개 글이 있어 그 글을 보고, 자세하고 쉽게 그리고 소스 공유까지 해주신 친절하신 블로거님 글을 따라 제 블로그에 적용해보았습니다.



▲ 티스토리 기본 SNS 공유 버튼




▲ 제 블로그에 적용한 SNS 공유 버튼




▲ 모바일에서 잘 나오는지 확인




티스토리 기본 SNS 공유 버튼은 관리자 - 플러그인 설정에 들어가 해제하여 중복으로 나오지 않게 하였습니다.










▲ Byner 님 블로그 SNS 공유 버튼

http://itlounge.net/9





▲ IT넘버원 님 블로그 SNS 공유 버튼

http://prolite.tistory.com/783






Byner 님 블로그에서 공유해주신 소스와 IT넘버원 님이 공유해주신 이미지로 제 블로그에 적용하였습니다.


친절하신 두 분 블로그에 가시면 이미지 압축 파일과 적용하는 소스 파일이 첨부되어 있고, 적용 방법 또한 저 같은 초보자도 쉽게 따라 할 수 있도록 자세히 설명되어 있으니, Byner 님과 IT넘버원 님 블로그에 방문하셔서 나머지를 진행을 하시면 됩니다.




이 아래 내용은 제가 적용한 방법을 나열하여 나중에 블로그 스킨 변경이나 새로운 SNS 공유 버튼을 추가하고 싶을 때를 대비 쉽게 찾을 수 있게 기록해두려 합니다. (저 같은 초보 분들은 참고하셔도 좋을듯합니다.)



- Byner 님 공유 소스 및 이미지를 받아 압축 해제


- IT넘버원 님 공유 이미지를 받아 압축 해제


- IT넘버원 님 공유 이미지 파일명을 Byner 님 공유 이미지 파일명으로 변경


- HTML/CSS ->파일업로드에 파일명 변경한 IT넘버원 님 공유 이미지 파일을 업로드 및 저장


- HTML/CSS ->HTML 에서 CTRL+F 치환자를 찾아 Byner 님 공유 소스 중 구글 플러스 부분 제외 후 태그 트레일 주석과 트랙백 주석 사이에 붙여 넣음 (페이스북 4글자를 페북으로 변경함)


- 저장




※ 참고사항


밴드 개발자 센터 밴드 이미지 아이콘 다운

https://goo.gl/8m3wxz




아리따움 배경화면 앱(app) 설치하기

치환자를 찾아 Byner 님 공유 소스 중 구글 플러스 부분 제외 후 태그 트레일 주석과 트랙백 주석 사이에 붙여 넣음 (페이스북 4글자를 페북으로 변경함)


- 저장




※ 참고사항


밴드 개발자 센터 밴드 이미지 아이콘 다운

https://goo.gl/8m3wxz




아리따움 배경화면 앱(app) 설치하기

URL이 복사되었습니다.