Basic Blogger Theme
다크 모드 + 자동 목차 + 관련 포스트 그리드. 한국어 수익형 블로거를 위한 깔끔한 SEO 테마.
무료 시작
Blogger 기본 테마보다 정돈된 출발점
처음부터 유료 테마가 부담스러운 블로그를 위해 자동 목차, 다크 모드, 관련 글 흐름을 담은 무료 XML 테마입니다.
반응형
모바일과 데스크톱에서 같은 테마 구조를 사용합니다.
운영 흐름
자동 목차와 관련 글로 다음 탐색을 돕습니다.
무료 시작
출처 표시 포함 무료 테마입니다.
추천 대상
- Blogger 기본 테마를 더 읽기 좋게 바꾸고 싶은 운영자
- 무료로 SEO 친화 구조와 다크 모드를 먼저 써보고 싶은 사용자
- 나중에 프리미엄 테마로 업그레이드할 가능성이 있는 새 블로그
기대할 수 있는 변화
- 본문 H2/H3 기반 자동 목차로 긴 글 탐색이 쉬워집니다.
- 관련 글 영역이 같은 라벨의 콘텐츠를 이어 보여줍니다.
- 무료 테마에는 Seed Themes 출처 표시가 포함됩니다.
포함 항목
- Blogger XML 테마 파일
- 자동 목차와 관련 글 UI
- 다크 모드와 반응형 본문 스타일
- 모바일 설정 안내
이 테마 소개
글이 길고 정보 밀도가 높은 후기·리뷰·튜토리얼 글에 어울리는 테마예요. 본문에 H2/H3로 섹션을 나누면 사이드바에 자동으로 목차가 만들어지기 때문에, 5분 이상 읽는 긴 글에서도 독자가 원하는 부분을 바로 찾을 수 있습니다. 본문이 주인공이 되도록 디자인했습니다. Cal Sans로 또박또박 떨어지는 헤딩, Inter로 한국어 자모까지 깔끔하게 보이는 본문, 한 번의 클릭으로 전환되는 다크·라이트 모드, 스크롤해도 메뉴와 모드 토글이 항상 손에 닿는 sticky 헤더. 광고와 본문이 답답하지 않도록 행간과 문단 간격도 충분히 잡았습니다. SEO·운영 관점에서도 잘 짜여 있습니다. 시맨틱 태그를 정확히 써서 검색 엔진이 본문 영역을 잘 인식하고, 목차 링크를 눌렀을 때 sticky 헤더에 헤딩이 가려지지 않도록 scroll-margin이 미리 적용돼 있습니다. 같은 라벨이 붙은 글은 본문 하단에 카드 그리드로 자동 노출되어 같은 블로그 안에서의 페이지뷰가 자연스럽게 올라갑니다. Tailwind CSS만 쓰고 외부 무거운 JS가 없어 Lighthouse 점수가 잘 나오며, 모바일 비중이 70%를 넘는 한국 블로그에 맞게 모든 폭에서 가독성이 유지됩니다. 적용 후에는 별도 설정 없이 바로 동작합니다. 본문에 H2/H3로 섹션을 나누면 목차가 자동으로 생기고, 라벨을 일관되게 사용하면 관련 포스트 그리드가 점점 풍부해집니다. 댓글도 평면 카드 스타일로 재작성돼 있어 토론이 길어져도 어수선하지 않습니다. withseed.app 가입자는 무료로 받을 수 있습니다. 다운로드한 XML에는 푸터에 "Theme by Seed Themes — withseed.app" 출처 표시가 자동으로 들어가 있고, 이 표시는 그대로 유지해 주세요. 출처 표시 없이 사용하려면 별도의 상업용 라이선스가 필요합니다.
지원 기능
별도 설정 없이 XML 적용만으로 바로 동작합니다.
다크 모드
사용자가 한 번의 클릭으로 라이트/다크 테마를 토글합니다. localStorage에 저장돼 재방문 시에도 유지됩니다.
자동 목차
본문의 H2/H3 헤딩을 자동으로 추출해 사이드바에 목차로 보여줍니다. 긴 글의 가독성이 크게 올라갑니다.
관련 포스트 그리드
같은 라벨이 붙은 게시글을 본문 하단에 카드 그리드로 자동 추천합니다.
SEO 친화 마크업
시맨틱 HTML과 스크롤 마진으로 검색 노출과 핵심 텍스트 비율을 끌어올립니다.
반응형 레이아웃
모바일·태블릿·데스크탑 모든 폭에서 가독성을 유지합니다.
Sticky 헤더
스크롤 시 상단이 고정되며 backdrop blur가 적용됩니다.
깔끔한 댓글 시스템
기본 Blogger 댓글을 평면 카드 스타일로 재작성했습니다.
라벨 검색 페이지
같은 주제의 글을 모아 보여주는 아카이브 뷰를 기본 제공합니다.
코드 블록 스타일링
JetBrains Mono로 가독성 좋은 코드 블록을 렌더링합니다.
Inter + Cal Sans 타이포그래피
본문은 Inter, 헤딩은 Cal Sans로 모던한 가독성을 제공합니다.
설치 방법
Blogger 관리자 페이지에서 약 2분이면 적용됩니다.
중요: 모바일 설정을 꼭 바꿔주세요
Blogger는 기본값으로 모바일에서 자체 단순 템플릿을 보여줍니다. 이 설정을 안 바꾸면 데스크톱은 멀쩡한데 모바일에서 디자인이 완전히 깨져 보입니다.
변경 방법
- 1. Blogger 관리자 → 테마 페이지
- 2. 화면 아래쪽 모바일 섹션의 ⚙️ 톱니 아이콘 클릭
- 3. "아니오. 모바일 기기에 데스크톱 테마 표시" 선택 → 저장
이 테마는 모바일까지 반응형으로 설계되어 있어서 데스크톱 테마를 그대로 써도 휴대폰에서 자연스럽게 보입니다.
- 1
XML 파일 다운로드
페이지 상단의 다운로드 버튼으로 XML 파일을 받습니다. 무료 테마는 자동으로 출처 표시(footer)가 삽입됩니다.
- 2
Blogger 관리자 → 테마
Blogger 관리자에서 테마 페이지로 이동 → 우측 상단 맞춤설정 옆 ▾ 버튼 → 백업/복원을 엽니다.
- 3
XML 업로드
업로드 버튼을 클릭하고 방금 받은 XML 파일을 선택합니다.
- 4
모바일 설정 변경 (필수)
같은 테마 페이지의 모바일 섹션 → ⚙️ → "아니오. 모바일 기기에 데스크톱 테마 표시"로 변경. 이걸 안 바꾸면 모바일에서 깨져 보입니다.
- 5
확인
블로그를 새로고침해 데스크톱·모바일 양쪽에서 적용을 확인합니다. 본문에 H2/H3로 섹션을 나누면 사이드바 목차가 자동으로 채워집니다.
※ 적용 전에 현재 테마를 먼저 백업해 두세요. 같은 페이지의 백업/복원 메뉴에서 다운로드로 백업이 가능합니다.
구매 전 자주 묻는 질문
테마 적용 전에 라이선스와 설치 조건을 먼저 확인하세요.
Basic Blogger Theme는 Blogger.com 전용인가요?
네. Blogger 관리자에서 업로드하는 XML 테마 파일입니다. 워드프레스, 티스토리, 쇼피파이 테마로는 사용할 수 없습니다.
무료 테마에도 라이선스 제한이 있나요?
무료 테마는 다운로드 후 사용할 수 있지만 Seed Themes 출처 표시가 포함됩니다. 출처 표시 없는 사용은 프리미엄 테마 기준으로 제공합니다.
설치할 때 코드를 직접 수정해야 하나요?
기본 적용은 XML 업로드만으로 끝납니다. 다만 Blogger의 모바일 설정은 데스크톱 테마 표시로 바꿔야 반응형 디자인이 그대로 보입니다.
구매 전에 실제 화면을 볼 수 있나요?
네. 상단의 라이브 데모 버튼으로 실제 Blogger 샘플 블로그에서 홈, 글 상세, 모바일 반응형 흐름을 확인할 수 있습니다.
적용 전에 백업만 해두면 됩니다
Blogger 관리자에서 현재 테마를 먼저 다운로드해두면, 새 테마를 적용한 뒤에도 이전 상태로 되돌릴 수 있습니다.