개발/CSS

완전 쉬운 티스토리 공감클릭 이미지 자동설정 방법

알 수 없는 사용자 2022. 11. 4.
반응형

티스토리 공감클릭 이미지 자동설정

 

블로그 게시글을 보면 하단에 공감버튼이 있습니다.

 

공감버튼 이미지는 스킨마다 다름

 

포스팅을 읽는 사람마다 공감버튼을 눌러주면 좋겠지만 사실 잘 누르지 않죠 ㅠ_ㅠ

그래서 한분이라도 더 공감버튼을 누르게 하기 위해 공감클릭 유도 이미지를 게시글마다 자동으로 삽입되는 방법을 공유합니다

 

추가로 공감유도 이미지도 공유합니다! 이미지는 글 밑에 있습니다

 

공감 클릭 유도 이미지 자동삽입 설정하기

 

 

블로그관리 > 꾸미기 > 스킨 편집으로 들어갑니다

 

 

우측에 html 편집 버튼을 누릅니다

 

 

html 부분에서 Ctrl+F키를 누른 다음 article_rep_desc 를 검색합니다.

article_rep_desc는 본문 내용이 나오는 부분입니다.

 

<!--공감유도 이미지로 넣을 경우-->
<div style="text-align : center;">
	<img src="./images/이미지명">
</div>

<!--공감유도 글자로 넣을 경우-->
<div style="text-align : center;">
	공감유도 문장
</div>

이미지로 넣을 경우는 위의 3줄, 글자로 넣을 경우는 아래 3줄을 복사해서

##_article_rep_desc_## 바로 아래에 코드를 넣어줍니다

 

 

이미지로 올리시는 분들은 파일업로드 > 추가에서 이미지를 업로드하세요

 

 

넣어준 후에는 왼쪽 상단 목록에서 글을 선택한 후 새로고침을 한 뒤 이미지/문장이 잘 들어갔는지 확인해 주세요

 

 

글자로 넣었을 경우에는 이렇게 나오게 되고요,

 

 

이미지로 넣었을 경우에는 이렇게 나옵니다.

 

 

원하는대로 잘 나왔다면 적용 버튼을 눌러서 적용해 줍니다.

 

 

기존에 업로드 된 글에 가서 확인해보니 잘 적용된 것을 확인할 수 있습니다.

 

공감클릭 유도 이미지

직접 만든 공감클릭 유도 이미지를 공유합니다. 필요하신 분은 자유롭게 사용하시고 공감버튼 꾹 눌러주세요!

폰트는 저작권에 문제없이 G마켓 산스를 사용했습니다.

 

 

 

 

 

 

 

 

포스팅이 도움이 되셨길 바랍니다. 감사합니다!

반응형

댓글

💲 추천 글