워드프레스 일기의 북클럽 스킨 6

티스토리 소제목 꾸미기

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

티스토리 북클럽 (Book Club) 스킨: 이미지에 링크가 있을 경우 라이트박스 비활성화하기

티스토리 북클럽 스킨을 사용 시 이미지를 클릭하면 이미지들이 라이트박스로 표시됩니다. 라이트박스의 경우 일반적으로 이미지에 링크가 설정되어 있지 않을 경우에만 작동해야 합니다. 하지만 북클럽 스킨에서는 이미지에 링크가 있든 없든 상관없이 모두 라이트박스가 트리거(Trigger)됩니다. 이미지에 링크가 있으면 링크된 곳으로 이동한 다음 본래 페이지로 돌아오면 라이트박스가 표시되어 있습니다. 콘텐츠를 보려면 사용자가 라이트박스 이미지를 닫아야 하는 번거로움이 있습니다.이 블로그에는 오디세이(Odyssey) 스킨이 사용되고 있으며 이런 현상이 발생하지 않습니다. 아마 북클럽 스킨의 버그 같습니다.북클럽 스킨에서 이미지에 링크가 걸려 있을 경우 이미지를 클릭해도 라이트박스가 발동하지 않도록 하는 코드를 만들어 ..

티스토리 북클럽 스킨: 커버 아이템 타이틀 (소제목) 스타일 변경하는 방법

티스토리 북클럽 (Book Club) 스킨에서 스킨 편집 시 커버 아이템을 설정하고 각 커버 아이템의 타이틀을 지정할 수 있습니다. 커버 아이템 타이틀 (소제목)의 기본 스타일이 마음에 들지 않는 경우 CSS를 사용하여 커버 아이템 제목 스타일을 변경할 수 있습니다. ☞참고로 티스토리 소제목 스타일을 변경하고 싶은 경우 다음 글의 "티스토리 소제목 (헤딩) 스타일 변경" 부분을 참고해보세요. 티스토리에 목차 표시하는 방법 (북클럽 스킨) 티스토리에는 모든 글에 자동으로 목차를 표시하는 방법은 없지만, 원하는 글에 자동으로 목차를 삽입할 수 있습니다. 헤딩 태그를 인식하여 자동으로 목차를 생성하는 jQuery를 사용할 수 있습�� avada.tistory.com 티스토리 북클럽 스킨의 커버 아이템 타이틀 ..

티스토리 북클럽 스킨: 커버 뉴스레터 아이템 썸네일 위치 변경 (오른쪽에서 왼쪽으로)

티스토리 북클럽 스킨의 스킨 편집에서 홈 설정을 커버로 지정하고 뉴스레터 아이템을 배치하면 썸네일이 오른쪽에 표시됩니다. 뉴스레터 아이템의 썸네일 위치를 오른쪽에서 왼쪽으로 변경하고 싶은 경우 간단한 CSS 코드를 사용할 수 있습니다. 티스토리 북클럽 스킨: 커버 뉴스레터 아이템 썸네일 위치 변경 방법 티스토리 북클럽(Book Club) 스킨에서 홈 설정을 커버로 설정하고 뉴스레터 아이템을 추가하면 다음 그림과 같이 썸네일이 오른쪽에 표시됩니다. 바로 옆에 사이드바가 있기 때문에 답답해 보인다면 썸네일을 왼쪽으로 이동시키는 것을 고려해볼 수 있습니다. 뉴스레터 아이템의 썸네일을 오른쪽에서 왼쪽으로 이동시키려면 다음과 같은 CSS 코드를 사용할 수 있습니다. /* 북클럽 스킨: 첫 페이지 썸네일 위치 변경..

티스토리 북클럽 스킨에서 새로운 글을 발행할 때 레이아웃이 제대로 적용되지 않는 문제가 발생하는 경우

티스토리 Book Club(북 클럽) 스킨에서 가끔 새로운 글을 작성하면 레이아웃이 제대로 적용되지 않는 현상이 발생하는 것을 발견했습니다. 가령, 다음 그림과 같이 사이드바가 오른쪽에 표시되지 않고 푸터 아래에 표시되었습니다. 특정 글에서 이런 현상이 발생하고, 동일한 콘텐츠로 글을 다시 발행해도 문제가 해결되는 경우도 있고 그렇지 않은 경우도 있었습니다. 티스토리 글 편집기를 새 편집기로 바꾸어서 글을 작성하여 발행해보니 또 문제가 해결되기도 합니다. 에러를 체크해보니 다음과 같은 오류가 발생하는 것이 확인되었습니다. GET https://tistory2.daumcdn.net/tistory/2828172/skin/images/script.js net::ERR_ABORTED 404 아마 script.j..

티스토리 Book Club 스킨 수정: 글 제목 아래에 댓글 개수 및 링크를 표시하는 방법

티스토리 북클럽(Book Club) 스킨을 적용하면 그림과 같이 포스트 제목 아래에 글쓴이 이름과 글 발행 날짜가 표시됩니다. 저는 사용자 이름은 삭제하고 글 작성 일자 옆에 댓글 개수를 표시했습니다. 그리고 클릭하면 댓글 섹션으로 이동하도록 수정했습니다. 티스토리 북클럽 (Book Club) 스킨 수정: 글 제목 아래에 댓글 개수 및 링크를 표시하는 방법티스토리 북클럽 스킨에서 글 제목 아래에 댓글 개수 및 링크를 표시하도록 변경하려는 경우 스킨을 약간 수정하면 됩니다. 먼저 티스토리에 로그인한 후에 꾸미기 > 스킨 편집 > html 편집 >HTML으로 이동합니다. 위와 같은 화면이 표시되면 Ctrl + F를 눌러 background-image:url()을 검색합니다. 바로 아래에 보면 다음과 같은 코..