반응형
공감을 눌러 주신 분들께 감사한 마음을 전달하고자 생각한 방법입니다.
복잡하지 않은 내용이므로 쉽게 따라 하실 수 있습니다.
목차
토스트 기능 만들기
사실 토스트 기능을 좀 더 전파하고 싶어서 작성한 글입니다. 토스트 기능을 먼저 적용하셔야 이어서 진행이 가능합니다. 아래 포스팅 참고 하시기 바랍니다.
티스토리 토스트 알림 팝업 기능 만들기
클립보드 내용 복사 완료 문구를 단순하게 alert 창을 이용하여 띄웠더니 너무 없어 보여서 간단하게 구현하였습니다. 목차 HTML 작성 관리 페이지 > 꾸미기 > 스킨 편집 으로 이동합니다. html 편집
sangminem.tistory.com
클릭 이벤트 작성하기
관리 페이지 > 꾸미기 > 스킨 편집 으로 이동합니다.
html 편집을 클릭합니다.
그럼 다음과 같은 HTML 에디터가 뜨는데 여기에서 작업을 해 보겠습니다.
body 태그 안쪽 제일 하단 script 태그 안에 붙여넣기 하시면 됩니다.
공감 버튼 클릭 이벤트를 감지하여 공감을 클릭했을 경우 토스트 기능으로 고마움을 표시하였습니다.
$('button.btn_post.uoc-icon').on('click',function(){
setTimeout(function() {
if($('button.btn_post.uoc-icon>div.like_on').length > 0) {
showToast('사랑합니다 ♥');
}
}, 500);
});
멘트는 원하는 대로 바꾸시면 됩니다.
결과 확인
다음과 같이 공감을 누르는 사람도 덩달아 기분이 좋아지도록 하였습니다.
영상으로도 확인해 보겠습니다.
아래 공감 버튼을 한 번 씩 클릭하여 확인해 보세요 ㅎㅎ 네트워크 상태가 좋지 않으면 멘트가 가끔 뜨지 않을 수도 있습니다.
감사합니다 :)
반응형
그리드형(광고전용)
'정보 > 블로그 운영팁' 카테고리의 다른 글
티스토리 스크롤 시 글 위치 표시 프로그레스바 간단하게 만들기 (20) | 2021.03.09 |
---|---|
티스토리 목차 완전 자동으로 생성하기 (서식 저장 불필요) (71) | 2021.02.27 |
티스토리 스크롤 자연스럽게 이동하기 (3) | 2021.02.24 |
북 클럽 스킨 상단 글 제목 배경 이미지 제거 및 스타일 변경하기 (20) | 2021.02.22 |
티스토리 공감 클릭 시 고마움 표시하기 (19) | 2021.02.22 |
티스토리 목차 링크 클립보드 복사하기 (4) | 2021.02.20 |
티스토리 토스트 알림 팝업 기능 만들기 (4) | 2021.02.20 |
티스토리 글 열람 즉시 원하는 제목 내용으로 이동하기 (4) | 2021.02.14 |
고래스킨, 친효스킨 둘러 보고 다시 북 클럽 스킨으로 돌아온 이유 (13) | 2021.02.14 |
와 기분좋겠는걸요^^ 문구 바꿔도 되니까 굿~~
답글
오 ㅋㅋㅋ 이거 도전!!!!!!
답글
음 안되겠네요...
ㅋㅋㅋㅋ 방금 좀 더 자세하게 설명 추가했어요~ 다시 도전!!
우와 감사합니다.
저도 도전!
그런데 구독이 안눌려지네요 ㅠ
답글
안녕하세요! 엇.. 몰랐는데 저 종때문에 가려져서 안눌러지는거였네요 ㅠㅠ 방금 수정했습니다 알려주셔서 감사해요~
꾸미기에 좋은 글들이 많아 구독해요.
근데 컴터를 잘 몰라서 토스트 기능은 못넣었어요ㅠㅠ
토스트 설정은 링크 따라 가서 body 내에 먼저 해두긴 했는데 CSS에선 어디다 붙여야 하는건가요?
css는 아무데나 넣으면 돼서 따로 설명을 안드렸습니다 ㅎㅎ
그냥 맨 위에 작성하셔도 돼요~
구독 감사드려요!
선생님 지금 말풍선을 적용했는데, 말풍선의 높이를 낮추고 가로로 길게 하고 싶은데 어떻해야 할까요?
https://sadvqe13.tistory.com/8
답글
여긴 말풍선 게시물이 아닌데요 ㅎㅎ 말풍선은 폰트 내 문자이므로 모양을 커스터마이징 하기는 어렵습니다.
와...이거 너무좋은데요... 사실 한번 시도했다가 오타가 났는지 뭐가문제인지 적용되지 않아서ㅠㅠ 다시 시도해보렵니다..ㅠㅠㅠㅠㅠㅠ
답글
하다가 잘 안 되시면 댓글 남겨 주세요~ 도와 드릴게요 ㅎㅎ
좋은 글 감사합니다 ( _ _ )
답글
비밀댓글입니다
답글
안녕하세요. 그 정도 말씀만 듣고 판단하긴 어렵지만 단순하게 구현하기는 어려운 부분 같습니다. 참고할 수 있는 블로그 하나 알려주시면 보고나서 좀 더 자세히 말씀드릴 수 있을거 같아요.
비밀댓글입니다
원리는 어렵지 않아 보이는데 단순하게 구현을 할 수 있는 부분도 아니라서 추후 적용하게 되면 방법을 포스팅 하도록 하겠습니다.
간단히 말씀 드리면 현재 보고 있는 글 스크롤이 일정한 위치가 되면 오른쪽 하단에 카테고리 다른 글 목록에서 직전 글 정보를 가져와서 따로 띄우는 단순한 원리 같습니다.
코딩이 가능하신 분이라면 참고가 되시리라 생각됩니다.
비밀댓글입니다