반응형 - 티스토리 이야기95 티스토리 북클럽 스킨 사이드바 카테고의 타이틀에 배경색 넣기. 카테고리의 타이틀에 배경색 넣기.이번에는 티스토리 북클럽 스킨의 사이드바 카테고리 타이틀에 배경색을 추가하는 방법을 살펴보겠습니다.이 작업은 카테고리에 밑줄을 추가하는 CSS코드에서 배경색과 좌측 여백을 추가한 간단한 작업입니다.하지만 여기서는 밑줄 코드까지 포함된 통합 CSS코드를 소개합니다. 적용 예제는 아래 미리 보기를 참고하면 됩니다. [📌 코드 수정 시 주의사항은 아래 '더보기'를 참고하세요.]더보기1. 스킨 저장.스킨을 변경하기 전에 가장 먼저 해야 할 일은 현재 사용 중인 스킨을 백업하는 것입니다. 스킨 변경 후 문제가 발생하면 변경 전 스킨으로 돌아가야 하기 때문에 백업이 필요합니다.스킨을 백업하려면, 블로그 관리자 > 꾸미기 > 스킨 변경을 클릭합니다. 상단에 사용 중인 스킨을 확인할 .. 2025. 3. 17. 북클럽 스킨 글 제목의 이미지를 없애고, 글 제목을 본문에 넣어 깔끔하게 만들기 글 제목의 이미지를 지우고 본문에 넣기. 오래전부터 사용해 온 티스토리 스킨인 Book Club은 심플하고 깔끔한 디자인 덕분에 많은 사용자들에게 인기를 끌고 있습니다. 그러나 블로그 본문에서 글 제목이 상단에 크게 노출되는 구조로 인해, 대표 이미지가 배경으로 자동 설정되면서 이미지에 따라 글 제목이 잘 보이지 않는 문제가 발생하곤 합니다. 이에 따라, 글 제목의 배경 이미지를 제거하고 크게 노출되는 글 제목을 본문에 포함하여 보다 깔끔하고 가독성 높은 디자인으로 정리해 보겠습니다. [📌 코드 수정 시 주의사항은 아래 '더 보기'를 참고하세요.]더보기1. 스킨 저장.스킨을 변경하기 전에 가장 먼저 해야 할 일은 현재 사용 중인 스킨을 백업하는 것입니다. 스킨 변경 후 문제가 발생하면 변경 전 스킨으로.. 2025. 3. 12. 티스토리 북클럽 스킨 본문 상단 '글 제목 커버' 꾸미기 #1 북클럽 스킨 본문 '글 제목 커버' 꾸미기티스토리 북클럽 스킨의 본문 'post-cover'를 수정하는 이유는 다음과 같습니다:시각적인 일관성: 본문 첫 번째 이미지나 썸네일을 제목 박스의 배경으로 설정할 경우, 길쭉하게 잘린 이미지가 불규칙하게 보일 수 있습니다. 이를 수정함으로써 보다 깔끔하고 일관성 있는 시각적 경험을 제공할 수 있습니다.페이지 로딩 속도: 배경 이미지가 많은 경우 페이지 로딩 속도가 느려질 수 있습니다. 배경 이미지를 제거하면 페이지 로딩 속도를 향상시킬 수 있습니다.가독성 향상: 배경 이미지가 제목의 가독성을 저하할 수 있습니다. 특히, 이미지의 색상이나 패턴이 복잡할 경우 제목 텍스트가 잘 보이지 않을 수 있습니다. 배경 이미지를 제거하고 색상을 변경하면 제목의 가독성을 크게 .. 2025. 3. 10. 티스토리 북클럽 스킨 꾸미기 모음집 '북클럽 스킨' 꾸미기 모음. 티스토리 블로그를 더욱 멋지고 매력적으로 꾸미고 싶으신가요? 이 글에서는 티스토리를 처음 시작하는 분들을 위해 다양한 '티스토리 꾸미기' 팁을 한곳에 모아 소개합니다. 모든 내용은 티스토리 '북클럽' 스킨을 기준으로 진행합니다. [📌 코드 수정 시 주의사항]1. 스킨 저장.스킨을 변경하기 전에 가장 먼저 해야 할 일은 현재 사용 중인 스킨을 백업하는 것입니다. 스킨 변경 후 문제가 발생하면 변경전 스킨으로 돌아가야 하기 때문에 백업이 필요합니다.스킨을 백업하려면, [블로그 관리자] > [꾸미기] > [스킨 변경]을 클릭합니다. 상단에 사용 중인 스킨을 확인할 수 있으며, [보관]을 클릭하면 됩니다. 2. [Ctrl] + [F]를 사용할 때.먼저 코드 탭의 빈 곳을 클릭한.. 2025. 3. 7. 티스토리 꾸미기 | 홈 프로모션 이미지 및 본문 상단 글 제목에 물결 효과 만들기 홈 프로모션 및 본문 상단에 물결 효과 만들기오늘은 '홈 프로모션 이미지 및 본문 상단 글 제목에 물결 효과 만들기'에 대해 이야기해보려고 합니다. 이 효과는 웹 서핑 중, 홈 화면과 본문 글 제목에 물결 효과를 사용하는 웹사이트를 보고, 여기저기 검색하여 꾸며본 코드입니다. 비록 사용 중인 스킨이 다를 수 있지만, 흡사한 효과를 보여줄 수 있습니다.📌 알림 웹서핑을 하다 보면 제가 만든 코드, 태그 속성, 그리고 오탈자까지 그대로 가져가 본인 작성한 글인 것처럼 사용하는 경우가 있습니다. 코드를 가져가는 것까지는 막을 수 없지만, 제 자료를 사용해 관련된 포스팅을 할 때는 출처를 꼭 밝혀 주시기 바랍니다.그 외 개인적인 사용은 자유롭게 하시면 됩니다. [📌 코드 수정 시 주의사항은 아래 '더보기'를.. 2025. 3. 5. 티스토리 꾸미기 | 프로그레스바 탑(TOP) 버튼 만들기 프로그레스바 탑(TOP) 버튼의 장단점.장점:가시성 향상: 사용자가 페이지를 스크롤할 때에도 좌측에 있는 '프로그레스바 탑 버튼'은 항상 보입니다. 이를 통해 사용자에게 현재 작업의 진행 상황을 지속적으로 알릴 수 있습니다.사용자 집중 유도: 죄측에 위치한 '프로그레스바 탑 버튼'은 눈에 잘 띄어 사용자가 작업을 완료하는 데 집중할 수 있도록 도와줍니다.단점:공간 제약: '프로그레스바 탑 버튼'을 배치하면 다른 중요한 UI 요소를 위한 공간이 줄어들 수 있습니다. 특히 모바일 환경에서는 공간이 제한적이므로 주의가 필요합니다.시각적 방해: 모든 사용자가 좌측에 위치한 '프로그레스바 탑 버튼'을 긍정적으로 받아들이는 것은 아닙니다. 일부 사용자는 이를 방해 요소로 인식할 수 있습니다.프로젝트의 목적과 사용자.. 2025. 3. 2. 티스토리 자동목차 만들기 part 5 (초간단 버전) 티스토리 자동목차 만들기. 📌 알림 웹서핑을 하다 보면 제가 만든 코드, 태그 속성, 그리고 오탈자까지 그대로 가져가 본인 작성한 글인 것처럼 사용하는 경우가 있습니다. 코드를 가져가는 것까지는 막을 수 없지만, 제 자료를 사용해 관련된 포스팅을 할 때는 출처를 꼭 밝혀 주시기 바랍니다.그 외 개인적인 사용은 자유롭게 하시면 됩니다.목차를 구성하면 웹사이트 방문자가 원하는 정보를 쉽게 찾을 수 있어 체류 시간이 길어지고 이탈률이 줄어듭니다. 따라서 사용자 참여 지표가 개선되며, SEO 점수도 상승합니다. 아래에서 설명할 자동 목차는 북클럽 스킨뿐만 아니라 모든 스킨에 적용할 수 있습니다. 티스토리 자동목차 미리보기티스토리 블로그를 서핑하다 보면 다음과 같은 목차를 사용하는 블로그를 많이 보셨을 겁니다... 2025. 2. 25. 티스토리 자동목차 HTML 서식 모음집 #2 | 북클럽 스킨 TOC 자동목차(HTML) 서식 모음. '자동목차 만들기 (TOC) part 2, part 4'에 적용 가능한 서식 스타일 모음본 서식은 '자동목차 만들기 part 2' 또는 'part 4'를 설정한 후에 사용할 수 있습니다.기본 코드와 CSS 코드는 part 2와 part 4에서 모두 동일하게 사용됩니다.자동목차 서식 스타일 모음은 CSS를 수정하지 않고 HTML 코드를 서식으로 저장 후, 필요한 페이지나 위치에 넣거나 본문에 바로 넣어 사용할 수 있습니다.CSS 코드 변경 대신 서식을 사용하는 이유간편한 사용: 기존에 작성한 목차에 영향을 주지 않고 쉽게 적용할 수 있습니다.개별 수정 가능: 코드 내 색상 등을 약간만 수정하여 각 포스팅에 어울리는 자동목차를 만들 수 있습니다.📌 알림 웹서핑을 하다.. 2025. 2. 22. 티스토리 자동목차 HTML 서식 모음집 #1 | 북클럽 스킨 TOC 자동목차(HTML) 서식 모음. '자동목차 만들기 (TOC) part 2, part 4'에 적용 가능한 서식 스타일 모음본 서식은 '자동목차 만들기 part 2' 또는 'part 4'를 설정한 후에 사용할 수 있습니다.기본 코드와 CSS 코드는 part 2와 part 4에서 모두 동일하게 사용됩니다.자동목차 서식 스타일 모음은 CSS를 수정하지 않고 HTML 코드를 서식으로 저장 후, 필요한 페이지나 위치에 넣거나 본문에 바로 넣어 사용할 수 있습니다.CSS 코드 변경 대신 서식을 사용하는 이유간편한 사용: 기존에 작성한 목차에 영향을 주지 않고 쉽게 적용할 수 있습니다.개별 수정 가능: 코드 내 색상 등을 약간만 수정하여 각 포스팅에 어울리는 자동목차를 만들 수 있습니다.📌 알림 웹서핑을 하다.. 2025. 2. 22. 이전 1 2 3 4 ··· 11 다음 반응형
