Book Club 스킨 6

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

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

티스토리 Book Club 스킨: 모바일에서 사이드바가 표시되도록 하는 방법 (개인 정리용)

티스토리 블로그에서 Book Club 스킨을 사용하는 경우 모바일에서 사이드바가 표시되지 않을 것입니다. 사이드바가 표시되도록 하려면 다음 CSS 코드를 찾도록 합니다. #aside { position: fixed; top: 0; right: -278px; z-index: 400; float: none; overflow: auto; width: 278px; height: 100%; padding: 94px 24px 40px; background-color: #fff; box-sizing: border-box; transition: left .5s; -webkit-transition: right .5s; } 위의 코드 부분을 다음과 같이 변경합니다. #aside { width: 100%; padding-l..

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

티스토리 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()을 검색합니다. 바로 아래에 보면 다음과 같은 코..

티스토리 Book Club 스킨 수정: 구글 맞춤 검색 추가

이 블로그에는 현재 최근 공개된 Book Club이라는 티스토리 스킨이 적용되어 있습니다. 이번에 스킨을 변경하면서 수정을 최소화하기 위해 노력했습니다. 몇 가지 수정 사항 중에 하나로 티스토리 검색 아이콘을 제거하고 대신 구글 맞춤 검색 기능을 추가했습니다. Book Club 스킨을 적용하면 오른쪽 상단에 검색 아이콘이 표시되고, 아이콘을 클릭하면 그림과 같이 검색 내용을 입력할 수 있는 상자가 나타납니다. 티스토리 검색 기능보다는 구글 검색 기능을 추가하면 사용자가 검색하는 검색어에 대하여 보다 관련성 있는 검색 결과를 제공할 수 있습니다. 간단한 수정으로 쉽게 구글 맞춤 검색 기능을 추가할 수 있습니다. 구글 맞춤 검색으로 대체한 후의 스크린샷입니다. 검색할 내용을 입력한 후에 검색 아이콘을 누르면..

티스토리 Book Club 스킨에서 댓글 아바타 크기 조정하기

지난 주에 티스토리에서 새롭게 선보인 Book Club 스킨에서 댓글에 표시되는 아바타가 약간 어색하게 표시됩니다. 그림과 같이 댓글에 답변을 달면 답글 작성자의 아바타가 찌그러져서 보입니다. 자꾸 보다 보면 익숙해지겠지만, 처음 스킨을 변경한 후에 댓글 섹션의 일부 아바타가 타원형으로 표시되어 매우 어색하게 느껴졌습니다.티스토리 북클럽(Book Club) 스킨에서 댓글 아바타 크기 조정하는 방법 댓글 내의 아바타가 일정한 크기로 표시되도록 하고 싶은 경우 다음 CSS 코드를 추가하면 됩니다./* Book Club 스킨 - 댓글 아바타 크기 */ .comment-list ul li .author-meta .avatar { width: 48px !important; height: 48Px; } 위와 같이 ..