사라진 내 SNS아이콘
티스토리에는 플러그인으로 SNS로 공유하기 아이콘이 제공되었는데요. 무슨이유에서인지 갑자기 어느날 블로그에서 공유하기 아이콘이 다 사라진거예요. 아무리 뒤져봐도 아이콘은 보이질않고 그래서 공유를 하는것에 불편을 느끼고 직접 공유하기 아이콘을 붙여야겠다고 다짐하고 실행에 옮겼습니다. 저처럼 아이콘 없어지신 분들 쉽게 따라할 수 있도록 알려드릴테니 따라해보세요.
원목과 주전자의 완벽한 조화가 아름답다고 표현할 수 있다. 전기포트 추천 ▼
SNS아이콘 글에 삽입하기
1. 가장 먼저 블로그관리화면에서 꾸미기 > 스킨 편집으로 이동하세요.
2. 각자의 스킨마다 나오는 이름은 다르겠지만 html편집창은 모두 같습니다. 눌러주세요.
3. html편집창에서 Ctrl+F키를 눌러서 1번처럼 검색창이 나오게 한다음
사라진 내 SNS아이콘
티스토리에는 플러그인으로 SNS로 공유하기 아이콘이 제공되었는데요. 무슨이유에서인지 갑자기 어느날 블로그에서 공유하기 아이콘이 다 사라진거예요. 아무리 뒤져봐도 아이콘은 보이질않고 그래서 공유를 하는것에 불편을 느끼고 직접 공유하기 아이콘을 붙여야겠다고 다짐하고 실행에 옮겼습니다. 저처럼 아이콘 없어지신 분들 쉽게 따라할 수 있도록 알려드릴테니 따라해보세요.
원목과 주전자의 완벽한 조화가 아름답다고 표현할 수 있다. 전기포트 추천 ▼
SNS아이콘 글에 삽입하기
1. 가장 먼저 블로그관리화면에서 꾸미기 > 스킨 편집으로 이동하세요.
2. 각자의 스킨마다 나오는 이름은 다르겠지만 html편집창은 모두 같습니다. 눌러주세요.
3. html편집창에서 Ctrl+F키를 눌러서 1번처럼 검색창이 나오게 한다음 을 입력한 후 엔터를 눌러 해당위치를 찾아주세요. 2번의 위치에 아래의 내용을 삽입하면 됩니다.
2번의 위치에 삽입해야할 코드입니다. 복사해서 붙여넣기 해주세요.
<!--sns 공유하기-->
<div class="sns-go">
<ul>
<!-- 네이버 블로그 공유 -->
<li>
<a href="#" onclick="javascript:window.open('http://share.naver.com/web/shareView.nhn?url=' +encodeURIComponent(document.URL)+'&title='+encodeURIComponent(document.title), 'naversharedialog', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600');return false;" target="_blank" alt="Share on Naver" ><img src="./images/sns_naver.png" width="40" alt="네이버 블러그 공유하기"></a>
</li>
<!-- 페이스북 공유 -->
<li>
<a href="#" onclick="javascript:window.open('https://www.facebook.com/sharer/sharer.php?u=' +encodeURIComponent(document.URL)+'&t='+encodeURIComponent(document.title), 'facebooksharedialog', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600');return false;" target="_blank" alt="Share on Facebook" ><img src="./images/sns_face.png" width="40" alt="페이스북 공유하기"></a>
</li>
<!-- 트위터 공유 -->
<li>
<a href="#" onclick="javascript:window.open('https://twitter.com/intent/tweet?text=[%EA%B3%B5%EC%9C%A0]%20' +encodeURIComponent(document.URL)+'%20-%20'+encodeURIComponent(document.title), 'twittersharedialog', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600');return false;" target="_blank" alt="Share on Twitter" ><img src="./images/sns_tw.png" width="40" alt="트위터 공유하기"></a>
</li>
<!-- 구글 플러스 공유 -->
<li>
<a href="#" onclick="javascript:window.open('https://plus.google.com/share?url=' +encodeURIComponent(document.URL), 'googleplussharedialog','menubar=no,toolbar=no,resizable=yes, scrollbars=yes,height=350,width=600');return false;" target="_blank" alt="Share on Google+"><img src="./images/sns_google.png" width="40" alt="구글 플러스 공유하기"></a>
</li>
<!-- 카카오톡 공유 -->
<li>
<a href="javascript:shareKatalk()"><img src="./images/sns_ka.png" width="40" alt="카카오톡 공유하기"></a></li>
<!-- 카카오스토리 공유 -->
복사가 안되는 분들을 위해서 아래에 txt파일을 올려드리니 파일을 열어서 복사해주세요.
4. 해당 위치에 붙여넣기한 모습입니다.
5. 이제 html편집창 옆에 CSS창을 누르고 아래처럼 코드를 삽입해주세요. CSS코드는 그냥 가장 하단에 붙여넣기해주면 됩니다. 특별한 위치를 찾지않아도 무방합니다.
/*SNS 공유*/
.sns-go {text-align:center; padding: 20px 0;}
.sns-go li {display:inline-block; margin: 0 5px; }
.sns-go li img {border-radius:50%;}
복사가 안되는 분들을 위해서 아래에 txt파일을 올려드리니 파일을 열어서 복사해주세요.
6. 마지막으로 파일업로드 창을 열고 1번처럼 추가버튼을 눌러 2번과 같이 아이콘을 모두 선택후 업로드 합니다.
아래의 zip파일을 다운로드 받고 압축을 풀어서 모두 업로드해주세요.
이렇게 모두 진행하고 나서 내 블로그의 글을 들어가보면 글하단에 3번의 그림처럼 SNS아이콘이 삽입되어있는것을 확인할 수 있습니다. 이제 자유롭게 클릭하여 SNS에 글을 업로드해주세요.
LG전자 디오스 오브제컬렉션 양문형냉장고 7%할인에 카드 8%할인까지 받고 사세요.▼
관련글
이 글과 비슷한 관련 카테고리의 글을 함께 읽어보세요. 도움이 되는 정보가 많이 준비되어 있습니다.
티스토리블로그 업로드이미지 용량줄이기 사이트 TinyPNG
티스토리블로그 업로드이미지 용량줄이기 사이트 TinyPNG
이미지 용량 줄이기 블로그가 검색사이트에 노출이 잘되게하려면 여러가지 방법을 사용해볼 수 있습니다. 그중 하나는 블로그에 삽입되는 이미지의 크기나 용량을 줄이면서 최적화하여 보는
commagun.tistory.com
티스토리블로그 미넴스킨의 H2, H3 제목앞에 바 제거하는 팁
티스토리블로그 미넴스킨의 H2, H3 제목앞에 바 제거하는 팁
제목앞에 표시되는 바가 거슬리는 분들에게 저는 미넴스킨을 주로 사용하는데 구글 애드센스의 적용이나 여러가지 설정을 하는데 있어서 편리하여 아주 애용하는 스킨입니다. 하지만 제가 제
commagun.tistory.com
티스토리블로그 - 형광펜효과 주는 html소스코드
형광펜 효과 티스토리 블로그에 열심히 글작성하고 여러가지 유용한 글꾸미기나 스킨의 적용을 고려하고 있을텐데요. 이번시간에는 글본문에 유용하게 사용해볼 수 있는 형광펜효과를 적용하
commagun.tistory.com
참고하세요
· 블로그 상단의 구독하기버튼을 누르시면 제 블로그의 새글을 바로 받아볼 수 있습니다.
· 방문하시는 여러분의 ♥공감 하나와 댓글 하나가 저에게는 큰힘이 될 수 있습니다.
· 이 글에는 다양한 어필리에이트 활동으로 수익금을 지급받을 수 있는 링크가 있습니다.
· 이 글은 블로그정보 카테고리에 위치하고 있습니다. 비슷한글을 보시려면 아래를 확인하세요.
2번의 위치에 삽입해야할 코드입니다. 복사해서 붙여넣기 해주세요.
<!--sns 공유하기-->
<div class="sns-go">
<ul>
<!-- 네이버 블로그 공유 -->
<li>
<a href="#" onclick="javascript:window.open('http://share.naver.com/web/shareView.nhn?url=' +encodeURIComponent(document.URL)+'&title='+encodeURIComponent(document.title), 'naversharedialog', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600');return false;" target="_blank" alt="Share on Naver" ><img src="./images/sns_naver.png" width="40" alt="네이버 블러그 공유하기"></a>
</li>
<!-- 페이스북 공유 -->
<li>
<a href="#" onclick="javascript:window.open('https://www.facebook.com/sharer/sharer.php?u=' +encodeURIComponent(document.URL)+'&t='+encodeURIComponent(document.title), 'facebooksharedialog', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600');return false;" target="_blank" alt="Share on Facebook" ><img src="./images/sns_face.png" width="40" alt="페이스북 공유하기"></a>
</li>
<!-- 트위터 공유 -->
<li>
<a href="#" onclick="javascript:window.open('https://twitter.com/intent/tweet?text=[%EA%B3%B5%EC%9C%A0]%20' +encodeURIComponent(document.URL)+'%20-%20'+encodeURIComponent(document.title), 'twittersharedialog', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600');return false;" target="_blank" alt="Share on Twitter" ><img src="./images/sns_tw.png" width="40" alt="트위터 공유하기"></a>
</li>
<!-- 구글 플러스 공유 -->
<li>
<a href="#" onclick="javascript:window.open('https://plus.google.com/share?url=' +encodeURIComponent(document.URL), 'googleplussharedialog','menubar=no,toolbar=no,resizable=yes, scrollbars=yes,height=350,width=600');return false;" target="_blank" alt="Share on Google+"><img src="./images/sns_google.png" width="40" alt="구글 플러스 공유하기"></a>
</li>
<!-- 카카오톡 공유 -->
<li>
<a href="javascript:shareKatalk()"><img src="./images/sns_ka.png" width="40" alt="카카오톡 공유하기"></a></li>
<!-- 카카오스토리 공유 -->
복사가 안되는 분들을 위해서 아래에 txt파일을 올려드리니 파일을 열어서 복사해주세요.
4. 해당 위치에 붙여넣기한 모습입니다.
5. 이제 html편집창 옆에 CSS창을 누르고 아래처럼 코드를 삽입해주세요. CSS코드는 그냥 가장 하단에 붙여넣기해주면 됩니다. 특별한 위치를 찾지않아도 무방합니다.
/*SNS 공유*/
.sns-go {text-align:center; padding: 20px 0;}
.sns-go li {display:inline-block; margin: 0 5px; }
.sns-go li img {border-radius:50%;}
복사가 안되는 분들을 위해서 아래에 txt파일을 올려드리니 파일을 열어서 복사해주세요.
6. 마지막으로 파일업로드 창을 열고 1번처럼 추가버튼을 눌러 2번과 같이 아이콘을 모두 선택후 업로드 합니다.
아래의 zip파일을 다운로드 받고 압축을 풀어서 모두 업로드해주세요.
이렇게 모두 진행하고 나서 내 블로그의 글을 들어가보면 글하단에 3번의 그림처럼 SNS아이콘이 삽입되어있는것을 확인할 수 있습니다. 이제 자유롭게 클릭하여 SNS에 글을 업로드해주세요.
LG전자 디오스 오브제컬렉션 양문형냉장고 7%할인에 카드 8%할인까지 받고 사세요.▼
관련글
이 글과 비슷한 관련 카테고리의 글을 함께 읽어보세요. 도움이 되는 정보가 많이 준비되어 있습니다.
티스토리블로그 업로드이미지 용량줄이기 사이트 TinyPNG
티스토리블로그 업로드이미지 용량줄이기 사이트 TinyPNG
이미지 용량 줄이기 블로그가 검색사이트에 노출이 잘되게하려면 여러가지 방법을 사용해볼 수 있습니다. 그중 하나는 블로그에 삽입되는 이미지의 크기나 용량을 줄이면서 최적화하여 보는
commagun.tistory.com
티스토리블로그 미넴스킨의 H2, H3 제목앞에 바 제거하는 팁
티스토리블로그 미넴스킨의 H2, H3 제목앞에 바 제거하는 팁
제목앞에 표시되는 바가 거슬리는 분들에게 저는 미넴스킨을 주로 사용하는데 구글 애드센스의 적용이나 여러가지 설정을 하는데 있어서 편리하여 아주 애용하는 스킨입니다. 하지만 제가 제
commagun.tistory.com
티스토리블로그 - 형광펜효과 주는 html소스코드
형광펜 효과 티스토리 블로그에 열심히 글작성하고 여러가지 유용한 글꾸미기나 스킨의 적용을 고려하고 있을텐데요. 이번시간에는 글본문에 유용하게 사용해볼 수 있는 형광펜효과를 적용하
commagun.tistory.com
참고하세요
· 블로그 상단의 구독하기버튼을 누르시면 제 블로그의 새글을 바로 받아볼 수 있습니다.
· 방문하시는 여러분의 ♥공감 하나와 댓글 하나가 저에게는 큰힘이 될 수 있습니다.
· 이 글에는 다양한 어필리에이트 활동으로 수익금을 지급받을 수 있는 링크가 있습니다.
· 이 글은 블로그정보 카테고리에 위치하고 있습니다. 비슷한글을 보시려면 아래를 확인하세요.
'블로그정보' 카테고리의 다른 글
| 티스토리블로그에 쉽게 적용하는 반응형 링크 버튼 바로 적용하기 (7) | 2023.12.06 |
|---|---|
| 티스토리블로그 공감버튼 위에 공감유도하는 문구넣는 코드삽입하기 (11) | 2023.12.04 |
| 워드프레스 블로그 '내가 가진 글꼴 적용'할 수 있는 방법 (1) | 2023.11.29 |
| 티스토리블로그 미넴스킨 하단의 떠다니는 아이콘 삭제하기 (2) | 2023.11.20 |
| 구글블로그테마 추천 - 3단의 전문적인 느낌 'Soraedge' (3) | 2023.10.16 |
| 구글블로그테마 'Sora Blog' 타이틀이 딱 보이는 테마를 원한다면 이거예요. (1) | 2023.10.04 |
| 'SmartMag' 뉴스와 매거진특화 구글블로그 테마 (1) | 2023.09.27 |
| 'SeoPro' 깔끔하게 정돈된 느낌의 구글블로그테마 (4) | 2023.09.26 |
댓글