이 블로그에 스피드스타 스킨을 적용한 후에 몇 가지 커스텀을 적용했습니다. 티스토리 스킨의 경우 스킨 파일을 수정하면 추후 업데이트 시 수정된 부분을 다시 적용해주어야 하는 번거로움이 있습니다. 워드프레스는 차일드 테마를 설치하여 수정하면 테마가 업데이트되어도 수정 사항이 유지되는데, 티스토리에는 이러한 기능이 없어 불편한 것 같습니다. 이 때문에 업데이트가 나와도 다시 수정 사항을 적용해야 하기 때문에 업데이트된 스킨을 설치하는 것이 엄두가 나지 않는 경우가 많은 것 같습니다. 추후 스피드스타 스킨 업데이트 시에 참조할 수 있도록 여기에 정리해보았습니다. 티스토리 스피드스타 스킨 커스텀 공감 버튼 및 구독하기 버튼 스타일 변경 다음 CSS 코드로 스타일 변경 가능. .Please2,.urlurl2{di..

구글 서치 콘솔의 코어 웹 바이탈 보고서는 실제 사용 데이터(필드 데이터라고도 함)에 따라 페이지의 성능을 보여 것으로, 사이트 속도가 느릴 경우 방문자 이탈률에 심각한 영향을 미치게 되어 SEO에 불리하게 됩니다. 이 블로그의 코어 웹 바이탈 보고서를 체크해보니 다행히 모바일과 데스크톱 모두 느린 URL과 개선이 필요한 URL이 없는 것으로 나오네요. 티스토리 블로그 코어 웹 바이탈 보고서 구글의 코어 웹 바이탈 점수를 높이기 위해서는 사이트 속도 최적화가 필요합니다. 티스토리의 경우 속도와 관련하여 최종 사용자가 건드릴 수 있는 것이 제한적이어서 사이트 속도를 높이는 데 한계가 있을 수 있습니다. 사용자 입장에서는 이미지를 압축하여 이미지 크기를 줄이는 등의 노력을 할 수 있습니다. 그리고 무엇보다 ..

이 블로그에는 미니멀스타라는 유료 티스토리 스킨이 적용되어 있었습니다. 스킨 판매자께서 스피드스타 스킨 업데이트를 보내주셔서 미니멀스타에 추가한 커스텀 코드와 CSS를 스피드스타 스킨에 적용했습니다. 별다른 이상 없이 작동하는 것 같으므로 이제부터는 스피드스타 스킨을 사용해야 할 것 같습니다. 티스토리 스킨 업데이트 vs. 워드프레스 테마 업데이트 워드프레스에서는 차일드 테마(자식 테마)를 만들어서 커스텀하면 테마가 업데이트되더라도 추가로 할 작업은 없습니다. 초기에 이러한 점을 이해하지 못한 개발자나 사용자들이 부모 테마 파일을 직접 수정하는 바람에 업데이트를 하지 못하는 문제가 발생하기도 했습니다. 자식 테마를 만들어서 제대로 작업하면 워드프레스 테마가 업데이트되더라도 문제가 발생하지 않습니다. 하지..

지난주 월요일에 티스토리 스킨을 미니멀스타로 변경하여 약 일주일 동안 세팅을 하였습니다. 미니멀스타는 많은 옵션을 제공하기 때문에 세부 옵션을 살펴보면서 세팅해야 하지만 저는 필수 설정을 한 후에 마음에 들지 않는 부분을 조금씩 수정했습니다. 추후에 미니멀스타 스킨이 업데이트되어 다시 수정해야 하는 경우를 대비하여 이 블로그를 커스텀하면서 수정이 필요한 부분을 정리해보았습니다. 워드프레스의 경우 차일드 테마를 만들어 작업하면 추후에 테마가 업데이트되더라도 수정 부분을 다시 추가할 필요가 없지만 티스토리의 경우 그런 시스템이 안 되어 있어 조금 불편한 것 같습니다. 티스토리 미니멀스타 스킨 커스텀 (개인 정리용) 1년 이상 무료 티스토리 스킨인 고래스킨을 사용하다 미니멀스타 스킨으로 변경했습니다. Mini..

티스토리 블로그의 모든 글에 자동으로 목차를 표시하는 방법을 이 블로그에서 설명한 적이 있었습니다. 해당 방법대로 해보면 Square 스킨에서는 클래스를 제대로 변경해도 목차가 제대로 표시되지 않습니다. Square 목차를 사용하는 경우 아래 내용대로 하면 목차가 자동으로 표시될 것입니다. 티스토리 Square 스킨에 자동 목차 표시하는 방법 티스토리 스킨에 목차를 자동으로 표시하는 기본적인 방법은 다음 글을 참고할 수 있습니다. 티스토리 블로그의 모든 글에 자동으로 목차 표시하는 방법 티스토리 블로그에 목차를 표시하려는 경우 목차 스크립트 파일을 이용하여 목차를 추가할 수 있습니다. 보통의 경우 목차를 표시할 자리에 수동으로 HTML 코드를 추가해야 하는데, 그러면 번거 avada.tistory.com..

저는 티스토리 스킨을 바꾸거나 워드프레스 테마를 바꾸면 글자 크기를 키우는 작업부터 시작합니다. 이제 노안이 진행되고 있어서 글자 크기가 작으면 눈이 금방 피로해집니다.ㅠ 글자 크기를 키우는 작업은 그리 어렵지 않습니다. 기본적인 CSS만 알면 누구나 할 수 있습니다. 이 글에서는 티스토리 오디세이 스킨에서 본문 글자 크기를 조정하는 방법에 대해 살펴보겠습니다. 티스토리 Book Club 스킨 수정: 본문 글자 크기 변경하는 방법 이 블로그에는 현재 최근 공개된 Book Club (북 클럽)이라는 스킨이 적용되어 있습니다. 북 클럽 스킨에서는 본문 글자 크기가 0.9375em으로 설정되어 글자가 다소 작게 느껴질 수 있습니다. 북클럽 avada.tistory.com 티스토리 오디세이 (Odyssey) 스..

이 블로그에서 티스토리의 소제목 스타일을 변경하는 방법에 대해 설명한 적이 있어 중복이라서 굳이 다루지 않았지만 고래 스킨에서 소제목 스타일을 지정하는 방법에 대한 문의가 간혹 있어 정리해보았습니다. 티스토리 고래 스킨 소제목 스타일 변경하기 (머리말 스타일) 소제목 스타일을 지정하는 방법은 기본적인 CSS를 알면 그리 어렵지 않게 가능합니다. 현재 이 블로그에는 다음과 같은 스타일로 소제목(머리말)이 표시됩니다. 이 스타일은 어떤 티스토리 블로그를 통해 공개된 CSS를 기반으로 한 것입니다. 지금은 그 블로그를 찾아보려고 하니 검색이 잘 안 되네요. 티스토리 고래 스킨에서 위와 비슷하게 소제목 (머리말, 헤딩) 스타일을 지정하려면 다음과 같은 CSS 코드를 사용하면 됩니다. /* 티스토리 고래 스킨 소..

어제 티스토리에 어떤 작업이 있었는지 몰라도 어제부터 일부 티스토리 스킨이 제대로 작동하지 않는 문제가 발생하고 있습니다. 북클럽 스킨에서도 일부 문제가 발생하고 있습니다. 가령 검색이 안 되는 문제와 프로필 클릭 시 무반응 문제 등이 발생하고 있습니다. 해결 방법으로 다음과 같은 조치를 취할 수 있습니다. 티스토리에서 시스템을 점검하여 티스토리 내부에서 사용하는 라이브러리에서 원인 현상을 발견하여 수정했다고 합니다. 이제 스킨에서 문제가 발생하지 않을 것 같습니다. 다른 스킨으로 변경했다가 다시 북클럽 스킨 선택 북클럽 스킨이 오류를 일으키는 문제가 발생하자 티스토리에서 오류를 해결한 업데이트를 내놓은 것 같습니다. 먼저 백업을 한 후에 스킨을 다른 스킨으로 일시 변경했다가 다시 북클럽(Book Clu..

티스토리 고래 스킨에 브레드크럼을 표시하려는 경우 참고해보세요. 브레드크럼(Breadcrumb)은 빵부스러기라는 의미로 헨젤과 그레텔에서 유래한 용어로 웹사이트에서 이동 경로를 표시하여 SEO 개선에 도움이 됩니다. 티스토리 고래 스킨에 브레드크럼 표시하기 이전 글에서 매거진 스킨에 브레드크럼을 표시하는 방법을 설명한 적이 있습니다. 스킨이 달라져도 브레드크럼을 추가하는 방법은 비슷합니다. 원리만 이해하면 다른 스킨에서도 쉽게 가능할 것입니다. 티스토리 Magazine 스킨에 브레드크럼을 추가하는 방법 브레드크럼(Breadcrubmb; 이동 경로)을 추가하면 SEO(검색엔진 최적화)에 도움이 될 수 있습니다. 지난 달에 이 티스토리 블로그의 스킨을 Magazine으로 변경했습니다. 티스토리의 신규 스킨 ..

티스토리 포스터 스킨에서 포스트의 제목과 본문의 글자 크기를 변경하고 싶은 경우 간단한 CSS로 변경이 가능합니다. 다른 티스토리 스킨에서도 비슷한 방법으로 글자 크기, 색상 등을 변경할 수 있습니다. (스킨에 따라 실제 코드는 조금씩 다를 수 있습니다.) 티스토리 Poster 스킨: 제목, 본문 글자 크기 변경하기 포스터 스킨 포스트 제목 글자 크기 및 색상 변경하기 글 제목 글자 크기를 변경하려면 꾸미기 > 스킨 편집 > HTML 편집 > CSS 탭으로 이동하여 맨 아래에 다음과 같은 코드를 추가하도록 합니다. /* 포스터 스킨 포스트 타이틀 */ .hgroup h1 { font-weight: 600; font-size: 1.5em; line-height: 1.4444em; color: #1587cc..