티스토리37

• 

  블로그 커버 글 순서 실시간 랜덤 섞기 및 애니메이션 효과 적용 커버 글 4개가 다 중요한데 순서를 매번 수작업으로 바꾸기도 애매하고 사람들이 들어올 때마다 글 순서를 무작위로 변경하면서 애니메이션 효과로 보는 눈도 즐겁게 하고 좀 더 눈에 띄게 하면 어떨까 싶어서 고안한 방법입니다. 전체 글 수는 4개지만 그중에 1개를 안 보이게 하고 글 4개 중 3개를 선택하여 사라졌다가 다시 나타나면서 재배치 되도록 해보겠습니다. 그럼 바로 적용해 볼게요! 관리 페이지 > 꾸미기 > 스킨 편집 으로 이동합니다. html 편집을 클릭합니다. 그럼 위외 같은 HTML 에디터가 뜨는데 여기에서 작업을 해 보겠습니다. body 태그 안쪽 제일 하단 script 태그에 다음과 같이 작성을 합니다. 먼저 딜레이를 줄 수 있는 함수를 구현하였습니다. 그대로 가져다 쓰시면 됩니다. 그리고 c.. 정보/블로그 운영팁 2020. 11. 21.

• 

  티스토리 방명록 글(댓글)에 프로필 로고 이미지 보이게 하기 일반적인 글에 달린 댓글에서는 로고가 보이는데 방명록에만 안 보이는 것이 이상하여 알아 보았더니 치환자가 있긴 있더라구요. 다음 링크는 티스토리 스킨 가이드 입니다. tistory.github.io/document-tistory-skin 소개 · GitBook 티스토리 스킨 가이드 티스토리에서는 스킨을 통해서 사이트를 자유롭게 디자인할 수 있습니다. 스킨은 치환자를 사용하여 제작되고 사용된 치환자에는 티스토리의 데이터가 대입되어 티스토 tistory.github.io 방명록 가이드를 살펴보면 다음과 같은 작성자 프로필 치환자를 확인할 수 있습니다. 이 치환자를 내 블로그에 적용해 보겠습니다. 관리 페이지 > 꾸미기 > 스킨 편집 으로 이동합니다. html 편집을 클릭합니다. 그럼 위외 같은 HTML 에디.. 정보/블로그 운영팁 2020. 11. 21.

• 

  티스토리에 무료 채팅(상담) 기능 넣기 가끔 질문을 해 주시는 분들에게 댓글로만 답하기에는 한계가 있어서 채팅을 찾아보게 되었는데 고맙게도(?) 무료로 채팅 기능을 이용할 수 있는 서비스가 있더라구요. 유료플랜에 비해서는 제한적이긴 하지만 의사소통하기에는 충분한 것 같습니다 ㅎㅎ 유료플랜으로 변경하기 전에는 계속 무료이니 안심하고 사용하시면 됩니다 :) 목차 채널톡 가입하기 먼저 아래 링크로 이동합니다. channel.io/ko 고객 획득 메신저 - 채널톡 사이트 방문객을 놓치지 마세요. 상담을 늘려서 영업기회를 높이거나, 자동화된 맞춤형 메시지로 전환율을 높일 수 있습니다. channel.io 자신이 사용하는 이메일을 하나 넣고 무료로 시작하기 버튼을 클릭합니다. 적당히 본인의 정보를 입력해 준 다음 다음 단계로 버튼을 클릭합니다. 필수 항.. 정보/블로그 운영팁 2020. 11. 21.

• 

  티스토리 블로그 배경음악 직접 넣기 (고급 버전) 잠깐! 이 포스팅은 HTML, CSS, JavaScript 기초가 있으신 분들 대상으로 작성되었습니다. #배경음악넣기_초급버전 sangminem.tistory.com/84 티스토리(TISTORY) 블로그 배경음악(BGM) 직접 넣기 (초급 버전) 안녕하세요. 블로그를 하다 보니 은근 배경음악 욕심이 생겨서 한 번 넣어 보았습니다. 1. 음악 파일 등록 먼저 비공개 게시물을 하나 만듭니다. 그리고 위에 보이는 파일 메뉴를 통해 배경음악 sangminem.tistory.com 이해가 어려우신 분은 위 링크로 이동하셔서 초급버전이나 SCM Music Player로 적용해 보시길 바랄게요 :) 안녕하세요. 이번에는 초급 버전을 수정하여 조금 더 많은 기능을 넣어 보려고 합니다. 일단 동일하게 시작해 보겠습니다... 정보/블로그 운영팁 2020. 11. 17.

• 

  티스토리 대댓글 많을 경우 자동 접기 기능 구현 대댓글이 너무 많아지면 자동으로 접히는 기능이 없어서 직접 구현해 보았습니다. 자동으로 제공해 주면 참 좋을텐데 티스토리는 손이 많이 가는 블로그 서비스네요 ㅎㅎ 이와 같이 댓글이 너무 많아지면 조금 부담스럽죠 ㅎㅎ 한 번 접어 보겠습니다. 먼저 댓글들 태그를 jQuery로 가져 와 보겠습니다. 관리 페이지 > 꾸미기 > 스킨 편집 으로 이동합니다. html 편집을 클릭 합니다. 그럼 다음과 같은 HTML 에디터가 뜨는데, 여기에 실제 동작에 필요한 소스 코드를 작성을 해 보겠습니다. body 태그 안쪽 제일 하단 script 태그에 다음과 같이 작성을 합니다. function initFoldReply() { var commentList = $('div.comment-list>ul>li'); if(com.. 정보/블로그 운영팁 2020. 11. 15.

• 

  티스토리 댓글에 URL 자동 링크 적용하는 방법 티스토리는 댓글에 URL을 입력하면 자동 링크를 생성해 주지 않아서 직접 그 기능을 구현해 보았습니다. 북 클럽 스킨 기준입니다. 다른 스킨에 적용하고 싶으신 분은 댓글 남겨 주시면 확인해 드릴게요. 깃허브에 올라 온 자동링크 만들어 주는 소스를 참고하여 작성하였습니다. github.com/bryanwoods/autolink-js bryanwoods/autolink-js Tiny little tool to find URLs in a string of text and hyperlink them - bryanwoods/autolink-js github.com 소스가 길지 않아서 직접 복사하여 가져 온 다음 필요한 로직을 덧붙여 구현해 보겠습니다. 관리 페이지 > 꾸미기 > 스킨 편집 으로 이동합니다. htm.. 정보/블로그 운영팁 2020. 11. 15.

• 

  티스토리 블로그 외국인 해외 검색 유입을 위한 나만의 전략 목차 개요 최근에 해외 사용자 유입도 고민을 해 보았습니다. 외국어 구사 능력은 없는데 외국인도 내 글을 봤으면 좋겠고.. ㅋㅋ 어떻게 하면 좋을까 고민을 하다가 최근 성능이 눈에 띄게 향상된 구글 번역 기능에 집중을 하였습니다. 그래서 얼마 전에 일단 GTranslate 위젯을 이용하여 블로그 전체 번역을 하는 것은 일단 성공을 하였습니다. sangminem.tistory.com/160 티스토리 블로그(홈페이지) GTranslate 구글 번역 위젯 적용 Select Language Afrikaans Albanian Arabic Armenian Azerbaijani Basque Belarusian Bulgarian Catalan Chinese (Simplified) Chinese (Traditional).. 정보/블로그 운영팁 2020. 11. 15.

• 

  티스토리 글 하단 버튼 클릭 안 되는 현상 해결 간혹 가다가 글 하단에 위치한 버튼이 클릭이 안 되는 현상이 발생을 합니다. 바로 이 위치입니다. 구글 애드센스 광고 정상적으로 로딩이 되지 않으면 자리만 차지하여 버튼이 위치한 곳과 겹치는 현상이 발생하는 것 같습니다. 아마 다른 위치의 버튼이나 링크가 클릭이 안 되더라도 마찬가지 이유일 가능성이 높습니다. 그 경우 광고를 감싸고 있는 클래스를 찾아 높이 값을 확인하고 값이 0인 경우 제거를 해 주는 로직을 추가하면 해결이 됩니다. 관리 페이지 > 꾸미기 > 스킨 편집 으로 이동합니다. html 편집을 클릭 합니다. 그럼 다음과 같은 HTML 에디터가 뜨는데, 여기에 실제 동작에 필요한 소스 코드를 작성을 해 보겠습니다. body 태그 안쪽 제일 하단 script 태그에 다음과 같이 작성을 합니다. $.. 정보/블로그 운영팁 2020. 11. 14.

• 

  티스토리 블로그(홈페이지) GTranslate 구글 번역 위젯 적용 Select Language Afrikaans Albanian Arabic Armenian Azerbaijani Basque Belarusian Bulgarian Catalan Chinese (Simplified) Chinese (Traditional) Croatian Czech Danish Dutch English Estonian Filipino Finnish French Galician Georgian German Greek Haitian Creole Hebrew Hindi Hungarian Icelandic Indonesian Irish Italian Japanese Korean Latvian Lithuanian Macedonian Malay Maltese Norwegian Persian Polis.. 정보/블로그 운영팁 2020. 11. 12.

• 

  티스토리 블로그 폰트 크기 변경 버튼 만들기 폰트가 너무 작거나 커서 블로그 컨텐츠 보기가 불편할 경우가 있을 거 같아서 추가한 기능입니다. 관리 페이지 > 꾸미기 > 스킨 편집 으로 이동합니다. html 편집을 클릭 합니다. 그럼 다음과 같은 HTML 에디터가 뜨는데, 여기에 실제 동작에 필요한 소스 코드를 작성을 해 보겠습니다. 하단에 script 태그 안쪽에 다음과 같은 코드를 작성합니다. script 태그가 없으면 body 태그 안쪽 끝 부분에 작성을 하시는 걸 추천드립니다. function changeFontSize(type) { var fontSize = $('html').css('font-size'); fontSize = Number(fontSize.substr(0,fontSize.length-2)); if(type === '+') {.. 정보/블로그 운영팁 2020. 11. 8.

• 

  티스토리 북클럽 스킨 글 목록 더보기(more) 스크롤 내리면 자동 로딩하기 더 보기(more) 버튼을 일일이 클릭하기 귀찮은 사람 많을 거라 생각하고 고안한 방법입니다. 위와 같이 Book Club 스킨 기준으로 설명을 드리고자 합니다. 스크롤을 아래로 내리면 자동으로 다음 글이 보이도록 할 생각입니다. 먼저 크롬에서 F12를 눌러 개발자 모드에 진입합니다. article 태그를 잘 살펴보면 하위에 view-more class를 활용한 a 태그가 하나 보입니다. 스크롤을 아래로 내렸을 때 이 부분이 자동 클릭되도록 이벤트를 걸어주면 될 거 같습니다. 그럼 관리 페이지 > 꾸미기 > 스킨 편집 으로 이동합니다. html 편집을 클릭 합니다. 그럼 다음과 같은 HTML 에디터가 뜨는데, 여기에 실제 동작에 필요한 소스 코드를 작성을 해 보겠습니다. 하단에 script 태그 안쪽에 .. 정보/블로그 운영팁 2020. 11. 8.

• 

  티스토리 블로그 배경음악 직접 넣기 (초급 버전) 안녕하세요. 블로그를 하다 보니 은근 배경음악 욕심이 생겨서 한 번 넣어 보았습니다. 목차 음악 파일 등록 먼저 비공개 게시물을 하나 만듭니다. 그리고 위에 보이는 파일 메뉴를 통해 배경음악으로 넣고 싶은 음악 파일을 업로드 합니다. 그럼 게시물에 다음과 같이 mp3 파일이 등록된 것을 볼 수 있습니다. 그리고 업로드 한 파일의 링크 주소 복사를 해줍니다. 오디오 태그 작성 관리 페이지 > 꾸미기 > 스킨 편집 으로 이동합니다. html 편집을 클릭 합니다. 그럼 다음과 같은 HTML 에디터가 뜨는데, 여기에 실제 동작에 필요한 소스 코드를 작성을 해 보겠습니다. 어차피 컨트롤러는 보이지 않게 할 것이기 때문에 적당한 위치에 작성을 해 줍니다. audio 태그를 활용하면 됩니다. loop 옵션을 통해 반.. 정보/블로그 운영팁 2020. 10. 31.