블로그스팟 레이아웃 깨짐 테마 변경 후 복구 방법 후기
- 공유 링크 만들기
- X
- 이메일
- 기타 앱
📋 목차
블로그스팟 테마를 바꿨더니 레이아웃이 통째로 무너져서 멘붕이 왔다면, XML 백업과 위젯 재배치로 거의 복구할 수 있거든요.
솔직히 처음 겪으면 진짜 당황스럽더라고요. 분명 예쁜 테마 골라서 적용했는데, 사이드바가 통째로 사라지고, 글 목록은 한쪽으로 쏠려 있고, 애드센스 위젯은 오류를 뿜고. 블로그 자체가 망가진 것 같은 느낌이었어요. 근데 찾아보니까 이게 블로그스팟에서 테마 바꿀 때 거의 모든 사람이 한 번씩은 겪는 문제더라고요.
제가 직접 복구하면서 삽질한 과정을 그대로 정리했어요. 특히 XML 백업을 안 해둔 상태에서 테마를 바꿔버린 경우까지 포함해서요. 같은 상황이라면 이 글 하나로 해결될 거예요.
테마 변경 후 레이아웃이 깨지는 진짜 이유
블로그스팟 테마는 결국 하나의 XML 파일이에요. 이 XML 안에 레이아웃 구조, 위젯 배치, CSS 스타일이 전부 들어가 있거든요. 테마를 바꾼다는 건 이 XML을 통째로 교체하는 거라서, 기존 테마에서 세팅했던 위젯 영역(Section)의 이름이 새 테마와 다르면 위젯이 갈 곳을 잃어버려요.
예를 들어 기존 테마에서 사이드바 영역 이름이 sidebar-right-1이었는데, 새 테마에는 그 이름의 섹션이 아예 없으면? 해당 위젯은 레이아웃 페이지에서 완전히 사라져요. 코드상으로는 남아 있을 수도 있지만 화면에는 안 보이는 거예요.
거기다 테마마다 CSS 클래스 이름이 다르니까, 같은 HTML 구조라도 스타일이 안 먹혀서 글이 화면 밖으로 밀려나거나 겹치는 현상이 생기기도 하고요. 이걸 모르고 "테마만 바꾸면 알아서 예뻐지겠지" 했다가 낭패를 보는 경우가 정말 많아요.
무료 테마 사이트에서 받은 XML일수록 이런 문제가 심한 편이에요. 공식 블로거 테마끼리는 섹션 이름이 비교적 통일되어 있는데, 외부 테마는 제작자마다 구조가 제각각이거든요.
테마 교체 전에 반드시 해둬야 할 백업
이미 깨진 상태라면 이 부분이 안타깝겠지만, 혹시 아직 테마를 안 바꿨거나 다음을 위해서라면 꼭 읽어두세요. 블로그스팟에서 테마 백업은 두 가지를 따로 해야 돼요.
첫 번째는 테마 XML 백업이에요. 블로거 대시보드에서 왼쪽 메뉴의 '테마'로 들어가면, '맞춤설정' 버튼 오른쪽에 점 세 개짜리 메뉴가 있어요. 거기서 '백업'을 누르면 현재 테마가 XML 파일로 다운로드돼요. 이 파일 하나면 위젯 배치까지 포함된 상태 그대로 복원이 가능하거든요.
두 번째는 콘텐츠 백업이에요. '설정' 메뉴에서 '블로그 관리' 섹션으로 내려가면 '콘텐츠 백업'이 있어요. 이건 글과 댓글 전체를 XML로 받는 건데, 테마 변경과는 직접 관련 없지만 만약의 사태에 대비하는 차원에서 같이 해두는 게 좋아요.
💡 꿀팁
테마 XML 백업 파일은 날짜를 넣어서 저장해두면 나중에 구분이 쉬워요. 저는 "theme_backup_20260420.xml" 이런 식으로 저장하는데, 테마를 여러 번 바꿔보다 보면 어떤 시점 파일인지 헷갈리거든요. 구글 드라이브에 블로그 전용 폴더 하나 만들어서 모아두면 편해요.
사라진 위젯과 사이드바 되살리기
테마를 바꾸고 나서 레이아웃 페이지에 들어가보면 위젯이 몽땅 사라져 있는 경우가 있어요. 근데 실제로 삭제된 게 아니라 "배치할 섹션이 없어서 숨겨진" 상태인 경우가 대부분이에요.
확인하는 방법이 있어요. 테마 메뉴에서 'HTML 수정'으로 들어가서 Ctrl+F로 기존 위젯 ID를 검색해보세요. 예를 들어 HTML/자바스크립트 위젯을 추가했었다면 HTML1, HTML2 같은 ID로 검색하면 코드상에 남아 있는지 확인할 수 있거든요.
코드에 남아 있다면 그 위젯을 새 테마의 적절한 섹션(b:section) 안으로 옮겨주면 돼요. 이게 좀 기술적인 부분이라 부담스러울 수 있는데, 사실 XML 코드에서 해당 위젯 블록을 잘라내기(Ctrl+X) 해서 원하는 섹션 안에 붙여넣기(Ctrl+V) 하는 게 전부예요.
만약 코드에도 없다면 위젯 자체가 테마 교체 과정에서 날아간 거예요. 이 경우엔 레이아웃 페이지에서 '가젯 추가' 버튼으로 다시 만들어야 해요. 이래서 백업이 중요한 거거든요.
사이드바가 아예 안 보이는 경우는 좀 다른 문제예요. 새 테마의 레이아웃 구조 자체가 사이드바 없는 1단 레이아웃일 수 있어요. 이때는 테마 HTML에서 사이드바 섹션을 직접 추가하거나, 사이드바가 포함된 테마를 다시 선택하는 게 빠르고요.
HTML 편집으로 깨진 구조 직접 잡기
레이아웃이 깨졌을 때 가장 흔한 증상이 본문이 화면 전체를 차지하면서 사이드바가 아래로 밀려나는 거예요. 이건 대부분 CSS의 width 값 문제거든요.
블로거 대시보드에서 테마 → HTML 수정으로 들어가세요. Ctrl+F를 눌러서 .main-wrapper나 .content-wrapper를 검색해보면, 본문 영역의 너비를 지정하는 부분이 나와요. 보통 width: 100%로 되어 있으면 사이드바가 밀려나는 거라서, 이걸 width: 70% 정도로 줄이고 사이드바 wrapper에 width: 28% 정도를 주면 나란히 배치돼요.
💬 직접 써본 경험
처음에 HTML 수정이 무서워서 Ctrl+A로 전체 선택한 다음 메모장에 복사해놓고 작업했어요. 혹시 저장 후에 더 심하게 깨지면 복사해둔 코드를 다시 붙여넣으면 되니까요. 실제로 한 번은 닫는 태그를 실수로 지웠다가 블로그 전체가 하얀 화면이 됐는데, 메모장에서 다시 붙여넣기 해서 살렸어요. 그때 심장이 진짜 쿵쾅거렸거든요.
테마에 따라 float: left가 누락되어 있는 경우도 있어요. 본문과 사이드바가 나란히 오려면 둘 다 float 속성이 있어야 하는데, 외부 테마 중에 이걸 빠뜨린 경우가 간혹 있더라고요. .sidebar-wrapper에 float: right를 추가하면 해결되는 경우가 꽤 있어요.
글 제목에 큰따옴표가 포함되어 있으면 목록이 깨지는 문제도 있어요. 테마의 자바스크립트가 포스트 제목을 따옴표로 감싸는 구조인데, 제목 자체에 큰따옴표가 있으면 코드가 끊겨버리거든요. 이 경우 HTML 수정에서 Ctrl+F로 "를 찾아서 백틱(`)이나 작은따옴표로 바꿔주면 돼요.
| 증상 | 원인 | 해결법 |
|---|---|---|
| 사이드바가 아래로 밀림 | 본문 width 100% 또는 float 누락 | main-wrapper width 축소 + float 확인 |
| 위젯 완전히 사라짐 | 새 테마에 해당 섹션 ID 없음 | HTML에서 위젯 블록을 적절한 섹션으로 이동 |
| 글 목록 썸네일 안 뜸 | jump break 또는 이미지 경로 문제 | 포스트별 <!--more--> 제거 또는 재삽입 |
| 전체가 하얀 화면 | XML 문법 오류 (닫는 태그 누락 등) | 백업 XML 재업로드 또는 기본 테마 복원 |
애드센스 위젯 오류 잡는 법
테마 바꾸고 나서 HTML 수정을 하려는데 "AdSense1 위젯의 설정이 유효하지 않습니다"라는 오류가 뜨면서 저장이 안 되는 경우가 있어요. 이거 진짜 많이들 겪는 문제더라고요.
원인은 기존 테마에 있던 애드센스 위젯이 새 테마의 XML 구조와 충돌하는 거예요. 해결 방법은 레이아웃 페이지에서 AdSense 위젯을 먼저 제거한 다음에 HTML 수정을 하는 거예요. 레이아웃에서 AdSense 가젯을 찾아서 삭제 → 저장 → 그다음에 HTML 편집으로 가서 원하는 수정 작업을 진행하면 오류 없이 저장돼요.
근데 레이아웃 페이지에서 AdSense 위젯이 안 보이는 경우도 있어요. 이때는 HTML 수정에서 Ctrl+F로 AdSense1을 검색해서 해당 위젯 블록 전체를 삭제해야 해요. <b:widget id='AdSense1'로 시작해서 </b:widget>으로 끝나는 부분을 통째로 지우면 돼요.
삭제 후에 애드센스 광고는 레이아웃에서 다시 추가하거나, 자동 광고를 쓰고 있다면 별도 위젯 없이도 광고가 노출되니까 크게 걱정 안 해도 돼요.
⚠️ 주의
HTML 수정에서 위젯 블록을 삭제할 때 <b:section> 태그까지 같이 지우면 레이아웃 전체가 무너질 수 있어요. 반드시 <b:widget>...</b:widget> 범위만 정확히 지워야 해요. 자신 없으면 삭제 전에 전체 코드를 메모장에 복사해두는 게 안전하고요.
원래 테마로 롤백하는 확실한 방법
이것저것 건드려봤는데 도무지 해결이 안 될 때가 있어요. 그때는 깔끔하게 롤백하는 게 나아요.
백업 XML 파일이 있다면 정말 간단해요. 테마 메뉴에서 점 세 개 버튼 → '복원' → 저장해뒀던 XML 파일 업로드. 이러면 테마 변경 전 상태로 완전히 돌아가요. 위젯 배치, CSS, 전부 다요.
백업이 없다면 좀 번거로워져요. 우선 블로거 기본 제공 테마 중 하나를 적용해서 상태를 안정시키세요. 대시보드의 '테마' 메뉴에서 공식 테마(Contempo, Soho, Emporio, Notable 등) 아무거나 클릭하면 바로 적용돼요. 기본 테마는 위젯 섹션이 표준화되어 있어서 레이아웃 페이지에서 위젯을 다시 추가하고 배치하기가 훨씬 수월하거든요.
그다음에 외부 테마를 다시 적용하고 싶다면, 이번에는 적용 전에 반드시 백업부터 하고, 적용 후 레이아웃 페이지에서 위젯 상태를 바로 확인하는 습관을 들이면 돼요.
한 가지 더, 구글 테이크아웃(Google Takeout)에서 블로거 데이터를 별도로 내보낼 수도 있어요. 이건 글과 댓글 데이터 위주라 테마 복원에는 직접 도움이 안 되지만, 최악의 상황에서 콘텐츠라도 건질 수 있는 보험이에요.
다음번 테마 변경 때 깨지지 않게 하려면
한번 깨져본 사람은 다음부터 무서워지잖아요. 근데 몇 가지 순서만 지키면 테마를 바꿔도 레이아웃이 깨질 일이 거의 없어요.
먼저 현재 테마 XML을 백업하세요. 그다음 레이아웃 페이지에서 현재 위젯 목록을 스크린샷으로 찍어두세요. 어떤 위젯이 어디에 배치되어 있는지 기록해두는 거예요. HTML/자바스크립트 위젯에 직접 코드를 넣어뒀다면 그 코드도 따로 메모장에 복사해두고요.
그리고 새 테마를 적용한 직후, 블로그 메인 화면부터 확인하지 말고 레이아웃 페이지부터 열어보세요. 위젯이 제대로 있는지, 섹션 구조가 어떻게 되어 있는지 먼저 파악하는 거예요. 문제가 있으면 이 단계에서 바로 롤백하면 되니까 피해가 최소화돼요.
📊 실제 데이터
구글 블로거 커뮤니티 포럼에서 테마 관련 문의를 보면, 위젯 사라짐과 레이아웃 깨짐이 가장 빈번한 질문이에요. 공식 지원 페이지에서도 테마 변경 전 백업을 강하게 권장하고 있고, 특히 외부 테마 적용 시에는 HTML/자바스크립트 가젯과 애드센스 위젯을 미리 제거한 후 테마를 적용하고 다시 추가하는 방식을 안내하고 있어요.
외부 테마를 고를 때는 데모 사이트에서 레이아웃 구조를 미리 살펴보는 것도 도움이 돼요. 사이드바가 있는 2단 구조인지, 사이드바 없는 1단인지, 푸터 영역은 몇 칸으로 나뉘어 있는지 등을 확인하면 적용 후 깨질 가능성을 미리 가늠할 수 있거든요.
그리고 테마 제작자가 설치 가이드를 제공하는 경우가 있어요. gooyaabitemplates, btemplates 같은 사이트에서 테마를 받으면 함께 올라온 설치 방법 문서를 꼭 확인해보세요. 테마마다 레이아웃 설정에서 따로 조정해야 하는 부분이 다르거든요.
마지막으로, 테스트용 블로그를 하나 만들어두면 진짜 편해요. 블로거는 구글 계정당 블로그를 여러 개 만들 수 있으니까, 본 블로그에 적용하기 전에 테스트 블로그에서 먼저 테마를 넣어보는 거예요. 이 습관 하나로 본 블로그 레이아웃이 깨지는 사고를 거의 완벽하게 예방할 수 있어요.
FAQ
Q. 테마 변경 후 기존 글이 삭제되나요?
아니요, 테마 변경은 디자인과 레이아웃만 바꾸는 거라서 작성한 글과 댓글은 그대로 남아 있어요. 다만 글 안에 테마 고유 CSS 클래스를 직접 사용했다면 그 부분의 스타일이 안 먹힐 수는 있어요.
Q. 기본 테마끼리 바꿀 때도 레이아웃이 깨지나요?
블로거 공식 기본 테마(Contempo, Soho, Emporio, Notable)끼리 변경하면 위젯 섹션 이름이 비슷해서 큰 문제가 없는 편이에요. 다만 사이드바 유무가 다른 테마로 바꾸면 위젯이 재배치될 수 있으니 레이아웃 확인은 필요해요.
Q. 모바일에서만 레이아웃이 깨지는 건 왜 그런 건가요?
블로거 설정에서 '모바일 테마'가 별도로 지정되어 있을 수 있어요. 테마 메뉴 하단에 모바일 설정이 있는데, '데스크톱'으로 통합하거나 모바일 전용 테마를 따로 확인해보면 해결되는 경우가 많아요.
Q. 외부 테마 XML 업로드 시 오류가 나면 어떻게 하나요?
XML 파일 자체에 문법 오류가 있는 경우예요. 오류 메시지에 줄 번호가 표시되니 해당 위치를 텍스트 에디터에서 확인해보세요. 흔한 원인은 닫는 태그 누락, 특수문자 인코딩 문제, 또는 블로거 최신 버전과 호환되지 않는 오래된 코드예요.
Q. 백업 없이 테마를 바꿔버렸는데 복구할 방법이 전혀 없나요?
완전히 이전 상태로 되돌리기는 어렵지만, 블로거 기본 테마를 적용해서 안정화시킨 뒤 위젯을 다시 추가하는 방식으로 복구할 수 있어요. 글 데이터는 테마와 무관하게 보존되니 콘텐츠 손실은 없고요. 이후 원하는 테마를 다시 적용하면서 이번에는 꼭 백업을 해두세요.
본 포스팅은 개인 경험과 공개 자료를 바탕으로 작성되었으며, 전문적인 의료·법률·재무 조언을 대체하지 않습니다. 정확한 정보는 해당 분야 전문가 또는 공식 기관에 확인하시기 바랍니다.
👉 함께 읽으면 좋은 글: 블로그스팟 가비아 도메인 연결, 직접 해보니 10분이면 끝나더라
👉 함께 읽으면 좋은 글: E-E-A-T 적용하고 검색 순위 확 바뀐 블로그 글쓰기 경험담
👉 함께 읽으면 좋은 글: 애드센스 승인 후 첫 수익이 통장에 찍히기까지, 내가 겪은 현실 타임라인
블로그스팟 테마 변경 후 레이아웃 깨짐은 XML 백업만 있으면 1분 만에 복구할 수 있고, 백업이 없더라도 기본 테마 적용 후 위젯 재배치로 충분히 살릴 수 있어요. 테스트용 블로그를 따로 운영하면서 새 테마를 미리 시험해보는 분이라면 이런 문제 자체를 겪을 일이 거의 없고, HTML에 직접 손을 대는 게 부담스러운 분이라면 블로거 기본 테마 안에서 맞춤설정 기능으로 디자인을 바꾸는 것도 안정적인 선택이에요.
테마 변경 경험이나 복구하면서 겪은 이야기가 있다면 댓글로 나눠주세요. 도움이 됐다면 공유도 부탁드려요.
- 공유 링크 만들기
- X
- 이메일
- 기타 앱
댓글
댓글 쓰기