워드프레스 일기의 티스토리 스킨 43

티스토리 오디세이 스킨 스크롤 시 사이드바를 고정시키는 방법

이 티스토리 블로그에는 티스토리의 최신 공식 스킨인 오디세이(Odyssey) 스킨이 적용되어 있습니다. 스크롤 시 사이드바가 고정되지 않아서 자바스크립트를 사용하여 사이드바를 고정시켜 붙박이 사이드바로 만들어 보았습니다. 2년 전에도 JS를 사용하여 사이드바를 고정시켰지만 자연스럽게 고정되지 않아서 코드를 제거했다가, 최근 개선된 코드를 사용하여 이전보다 스무드하게 고정되도록 했습니다.티스토리 오디세이 스킨: 스크롤 시 사이드바를 고정시키는 방법티스토리 규제가 강화되면서 팝업 배너를 표시해도 제재를 받을 수 있고, 일부 사용자에 의하면 자동 목차를 표시해도 정지 조치를 내린다고 합니다. 그래서 이 블로그에서는 자동 목차를 제거하고 가능하면 순정 상태로 이용하려고 노력하고 있습니다.😄사이드바의 경우 스크..

티스토리 소제목 꾸미기

티스토리는 HTML/CSS/JS 사용이 가능하기 때문에 소제목(H2, H3, H4, H5 태그)을 꾸밀 수 있습니다. 스킨 편집의 CSS 탭에서 기존 CSS 스타일을 수정하거나 새롭게 추가가 가능합니다. 저는 CSS 탭 하단에 CSS 스타일을 추가하여 스타일을 변경하는 편입니다. 기존 CSS를 수정하는 것은 유지보수 측면에서 바람직하지 않고, 가급적이면 기존 CSS는 유지하고 하단에 새로운 CSS를 추가하는 것이 관리적인 측면에서 조금 편리할 수 있습니다.참고로 워드프레스 블로그의 경우 테마의 스타일시트 파일은 건드리지 않고 관리자 페이지나 차일드 테마의 스타일시트에 코드를 추가하여 변경하기 때문에 추후 테마가 업데이트되어도 추가한 스타일이 유지되고, 테마 파일을 수정하더라도 차일드 테마에서 진행하면 수..

티스토리 소제목 스타일 변경하기 (오디세이 스킨 & 북클럽 스킨)

티스토리에서 소제목 스타일을 변경하고 싶은 경우 CSS 코드를 사용하여 원하는 대로 설정하는 것이 가능합니다. 이 블로그의 경우 기본 스킨 중 하나인 오디세이(Odyssey) 스킨을 사용하고 있으며 CSS 코드를 추가하여 헤딩 태그(H2, H3, H4)의 스타일을 변경했습니다. 이 글에서는 오디세이 스킨과 북클럽 스킨에서 티스토리 소제목 스타일을 변경하는 방법에 대하여 살펴보겠습니다.티스토리 소제목 스타일 변경하기티스토리 소제목 설정티스토리 소제목(H2, H3, H4 등) 스타일은 사용자 CSS를 사용하여 원하는 대로 설정할 수 있습니다.티스토리에서 헤딩 태그는 글 편집 화면에서 본문2로 표시된 드롭다운을 클릭하여 제목1, 제목2, 제목3을 선택할 수 있습니다.여기에서 제목1~제목3은 H2~H4 태그에 ..

"애드센스 무효 클릭 공격 감지되었습니다" 기능을 사용하는 경우 코드를 제거하세요

일부 티스토리 사이트를 방문하면 아래 그림과 같이 "애드센스 무효 클릭 공격 감지되었습니다. IP 추적 진행합니다" 경고가 표시되고, 확인 버튼을 누르면 아OO 홈페이지로 이동하는 경우가 있습니다.티스토리는 공지를 통해 다른 사이트로 강제로 전환하도록 하는 이런 방식을 금지하는 공지를 어제 올렸습니다. 상기 그림과 같이 작동하는 스킨을 사용하거나 코드가 추가된 경우 다른 스킨으로 변경하거나 코드를 제거하시기 바랍니다.티스토리: 다른 사이트로 강제 전환 금지어제 티스토리에서 새로운 공지 하나를 게시했습니다. 다른 사이트로 강제 전환 금지 안내안녕하세요. 티스토리팀입니다.  최근 "티스토리 방문 중 갑자기 다른 사이트로 납치됐다"라는 사용자 문의가 있어 살펴본 결과 '무효 트래픽 방지를 위한 코드 내용 중 ..

티스토리 오디세이 스킨에서 블로그 글 제목 글자 크기 조정하기

티스토리 공식 스킨 중 하나인 오디세이(Odyssey)를 사용하는 경우 블로그 글 제목이 길어지면 제목 일부만 표시됩니다. 특히 모바일에서 이런 현상이 두드러집니다. 제목이 긴 경우에도 모두 혹은 일정 길이 이상 표시되도록 하고 싶은 경우에는 CSS를 사용하여 제목 글자 크기를 조정하는 것을 고려할 수 있습니다. 티스토리 오디세이 스킨에서 블로그 글 제목 글자 크기 조정하기 이 티스토리 블로그에는 현재 오디세이(Odyssey)라는 스킨이 적용되어 있습니다. 깔끔한 스킨을 원하는 경우 괜찮은 선택 같습니다. 이 스킨을 사용하는 경우 블로그 제목이 긴 경우 그림과 같이 제목 일부만 표시되고 나머지는 생략 기호(...)로 표시됩니다. 특히 모바일에서 이 현상이 두드러집니다. 모바일에서 블로그 글에 접속하더라도..

티스토리 스킨을 오디세이(Odyssey)로 변경했습니다

어제 제 티스토리 블로그에서 '응답 없는 페이지' 경고가 표시되면서 블로그 글들이 제대로 로드되지 않는 현상이 발생했습니다. 이 문제는 아마도 티스토리 개발팀이 티스토리를 업데이트하면서 사용 중인 스킨과 충돌을 일으켜 발생한 것 같습니다. 스킨에 포함된 자바스크립트에서 무한 루프에 걸려서 이런 현상이 발생하는 것이 아닌가 생각되네요. 스피드스타라는 유료 스킨을 사용하고 있었는데요. 지난 10월에도 티스토리 시스템 업데이트로 갑자기 댓글 영역이 표시되지 않아서 긴급히 수정한 적이 있습니다. 티스토리 스피드스타 스킨: 댓글 영역이 표시되지 않는 문제 최근 티스토리에서 시스템을 변경하면서 스피드스타 스킨에서 댓글 영역이 표시되지 않는 문제가 나타나고 있는 것 같습니다. 댓글이 달리지 않아서 살펴보니 5일 전에..

티스토리 스피드스타 스킨: 댓글 영역이 표시되지 않는 문제

최근 티스토리에서 시스템을 변경하면서 스피드스타 스킨에서 댓글 영역이 표시되지 않는 문제가 나타나고 있는 것 같습니다. 댓글이 달리지 않아서 살펴보니 5일 전에 달린 댓글을 마지막으로 댓글이 달리지 않았네요. 그리고 댓글 창과 댓글 목록이 표시되지 않아서 관심을 가지고 살펴보지 않으면 댓글창이 사라진 것을 인지하지 못할 수 있을 것 같습니다. 티스토리 스피드스타 스킨: 댓글 영역이 표시되지 않는 문제 발생 시 임시 조치 혹시 스피드스타 스킨에서 댓글 영역이 표시되지 않고 있다면 꾸미기 » 스킨 편집 » html 편집을 클릭하여 스킨 편집 화면으로 이동합니다. 상단의 CSS 탭을 클릭하고, 맨 아래로 이동합니다. 하단에 다음과 같은 코드를 추가하여 저장하시기 바랍니다. body:not(#tt-body-gu..

티스토리 스킨: 스피드스타 (Speed Star) 업데이트

이 블로그에는 현재 유료 스킨인 스피드스타(Spped Star)가 적용되어 있습니다. 스피드스타가 3.0.0으로 업데이트되어 어제 일요일에 잠시 시간을 내어 업데이트를 적용했습니다. 티스토리 스킨: 스피드스타 (Speed Star) 3.0.0 업데이트 워드프레스의 경우 올바른 방식으로 수정을 하면 테마가 업데이트되더라도 추가적인 작업이 필요하지 않습니다. 하지만 티스토리의 경우 스킨이 업데이트되면 수정 사항을 다시 적용하고 설정도 새로 해야 하는 번거로움이 있습니다. 업데이트 파일을 메일로 전달받아서, 수정 사항을 적용한 후에, 구 버전이 설치된 상태에서 파일들을 모두 제거하고 업데이트된 스킨 파일들을 업로드하니 에러가 발생했습니다. 파일들을 덮어쓰기 한 후에 JS 파일 오류가 발생하여 스피드스타 개발자..

티스토리 스피드스타 스킨에서 유튜브 영상이 올바르게 삽입되지 않는 문제 해결

이 티스토리 블로그에는 스피드스타라는 스킨이 사용되고 있습니다. 티스토리가 업데이트되면서 어느 순간부터 이 블로그에 삽입된 유튜브 영상들이 제대로 표시되지 않고 있습니다. 유튜브가 표시될 자리에 여백이 표시되거나 줄이 표시되는 현상이 발생했습니다. 티스토리 스피드스타 스킨에서 유튜브 영상이 올바르게 삽입되지 않는 문제 해결 스피드스타 스킨에서 이 문제가 발생하는 경우 꾸미기 » 스킨 편집 »HTML 편집에서 을 검색하여 다음 CSS 코드를 추가하면 문제가 해결될 것입니다. a[href*=youtu]>.resvid { padding-bottom: 56.25%!important; } 저는 살펴보니 다음 라인이 추가되어 있어 삭제하고 위의 라인을 추가하니 문제가 해결되었습니다. .resvid {padding-..

티스토리 스피드 스타 스킨: 유튜브 영상 아래 여백 제거하기

이 티스토리 블로그에는 현재 스피드 스타(Speed Star)라는 스킨이 사용되고 있습니다. 얼마 전부터 유튜브 영상 링크로 유튜브 동영상을 삽입하면 영상 아래에 여백이 표시되는 문제가 발생했습니다. 이전에는 발생하지 않았는데, 카카오 데이터센터 화재 사건 이후에 티스토리가 업데이트되면서 이런 문제가 발생하는 것 같습니다. 티스토리 스피드 스타 스킨: 유튜브 영상 아래 여백 제거하기 스피드 스타 스킨에서 유튜브 영상 삽입 시 위의 그림과 같이 아래에 여백이 표시된다면 꾸미기 » 스킨 편집 » HTML 편집 » HTML 섹션에서 [****]을 검색하여 바로 위에 다음 코드를 추가하면 문제가 해결될 것입니다. .resvid {padding-bottom:0;} 다음 그림과 같이 추가하시면 됩니다. 스피드 스타..