내 블로그에 닥친 큰 위기, 새삼 느낀 스킨 백업의 중요성

갑자기 바뀐 내 블로그, 소스코드가 바뀌었다?

벌써 두어달 전 이야기입니다.

 

하루 1포스팅 원칙을 실천하고 있던 저는 캠핑장에서 올릴 포스팅도 티스토리의 예약 발행을 통해 준비해둔 상태였습니다.

 

그 날은 캠핑장에서 맞는 제 생일로 마눌님께서는 코펠에 미역국을 끓이느라 여념이 없었고 저는 티스토리 예약 발행이 잘 되었는지 확인하기 위해 스마트폰 테더링을 이용, 노트북으로 제 블로그를 열어봤습니다.

 

어라?? 그런데 제 블로그 화면이 뭔가 이상합니다. 평소와는 다른 화면이 뜨는군요.

 

간혹 외부에서 스마트폰 테더링으로 인터넷에 접속할 때, 연결 상태가 고르지 않아 화면이 깨지는 경우가 있었기에 별 생각없이 새로 고침을 반복하는데, 화면이 돌아올 생각을 않습니다.

 

노트북에 깔린 인터넷 익스플로러 문제인가 싶어 크롬이나 파이어폭스로 접속을 해봐도 화면이 이상합니다.

티스토리 애드센스 블로그 tistory adsense

 

망가져버린 내 티스토리 블로그 레이아웃, 원인은?

깨져버린 레이아웃을 자세히 살펴보면 이렇습니다.

이미지로 만들어 두었던 상단 메뉴바가 삐뚤빼뚤 어긋나 있었고, 상단 애드센스 자리가 에러 메시지와 함께 텅비어있었습니다.

 

뭔가 큰 일이 났구나 싶었습니다.

애드센스가 저런식으로 표시된 다는 것은 애드센스 코드를 잘못넣은 경우거나 애드센스 계정이 정지된 경우인데, 제 경우는 어제밤까지만해도 잘 돌아가던 상황이었으니 애드센스 계정이 정지된 것이겠죠.

내가 뭘 잘못했기에 경고도 없이 애드센스 계정이 정지된건가?

허겁지겁 애드센스 계정으로 로그인해보니, 어라? 애드센스 계정에는 아무런 문제가 없습니다.

티스토리 애드센스 블로그 tistory adsense메뉴들이 틀어지고 애드센스 코드가 표시되지 않는다

 

애드센스 계정에는 문제가 없는데, 그럼 뭐지? 싶어 티스토리 관리자로 접속해 HTML/CSS 상태를 확인해봤습니다.

그랬더니, 평소와는 전혀 다른 화면이 뜹니다.

티스토리 스킨을 자주 바꾸진 않지만, 그래도 나름 최적화를 위해 신경쓰고 있었고, 티스토리 스킨의 HTML/CSS 코드를 알아보기 쉽게 깔끔하게 정리해두었는데, 갑자기 소스코드에 엔터가 다 사라지고 다닥다닥 붙은 상태로 바뀌어 있습니다.

티스토리 애드센스 블로그 tistory html css

 

메모장으로 코드를 복사하니 이런식으로 뜨는 것입니다.

웹사이트 최적화를 위해 일부러 이렇게 코드 사이의 엔터를 없애 압축하는 경우도 있다고 하지만 저는 티스토리 스킨을 가끔 들여다봐야하는 상황이라 그런 시도는 생각한 적도 없었는데 어떤 과정을 통해 HTML 소스 코드가 이리 바뀌어버린 것인지, 정말 귀신 곡할 노릇이네요.

티스토리 애드센스 블로그 tistory html css 메모장 notepad손대지 않았는데 저절로(?) 바뀐 소스코드

티스토리 스킨 백업하고 백업한 스킨 사용하는 법

천만 다행인 것은, 평소 스킨 백업1~2주에 한 번씩, 혹은 HTML/CSS 코드에 뭔가 손을 대기 전에 한 번씩 하는 것입니다.

티스토리 스킨 백업은 티스토리 스킨에 사용된 이미지와 HTML, CSS 코드 등이 저장되는 기능입니다.

티스토리 관리자의 [스킨]-[스킨저장] 버튼을 클릭하여 간단하게 티스토리 스킨을 백업할 수 있습니다.

티스토리 애드센스 블로그 tistory 스킨 백업

 

[스킨저장] 버튼을 클릭하면 스킨 이름을 입력하게 되는데, 저는 알아보기 쉽게 날짜를 함께 적어두곤 합니다.

[확인] 버튼을 클릭하면 티스토리 서버에 스킨이 백업됩니다.

티스토리 애드센스 블로그 tistory 스킨 백업

 

저장해 둔 티스토리 스킨은 [스킨]-[보관함]에서 확인할 수 있습니다.

저장된 스킨 목록들 중에서 원하는 것을 골라(아무래도 가장 최근에 적용한 스킨을 쓰게 되겠죠?) [적용] 버튼을 클릭해 티스토리에 블로그에 바로 적용할 수 있습니다.

티스토리 애드센스 블로그 tistory 스킨 백업

 

다만 저는 습관적으로 [스킨 다운로드]를 클릭해 저장된 스킨을 내 컴퓨터로 다운로드 합니다.

스킨은 압축 파일 형태로 저장되는데 압축을 열어보면 skin.html과 style.css 파일이 보이고, 이 파일을 메모장 등으로 열어 복사한 후 티스토리의 HTML/CSS 편집에 적용해주면 됩니다.

티스토리 애드센스 블로그 tistory 스킨 백업 반디집

백업한 스킨 적용 후 블로그 복구 완료, 하지만 원인은 알수 없다

HTML/CSS 코드에 손을 대지 않았음에도 코드에 엔터가 모두 사라지고 바뀌어버린 이유는 알 수 없습니다.

티스토리측에 문의를 해보니 특별한 이상징후는 없으며 로그인 기록과 비밀번호 누출을 확인해보라는 답변만 들을 수 있었습니다.

 

하지만,  문제가 되었던(엔터가 사라진) 소스코드를 찬찬히 살펴보다가, 제가 끼워넣은 것이 아닌, 외부 서버에 올려진 자바스크립트 두 개가 들어가 있는 것이 확인되었습니다.

그 자바 스크립트는 다른 사람의 구글 analytics 코드를 제 블로그에 끼워넣은 역할을 하는 것이었는데 여기서 자세한 설명을 하기는 어렵지만 누군가 어떤 의도를 가지고 제 블로그에 해당 자바 스크립트를 끼워넣었다고 밖에 설명이 안되는 상황이었는데요,

티스토리 애드센스 블로그 tistory 데이터 백업

정황상 무언가 진행된 과정이 있는데, 티스토리 로그인 기록을 아무리 확인해봐도 제가 접속한 기록 밖에 남아 있지 않으니, '이거다'하고 단정짓기가 참 애매한 상황입니다. 평소 비밀번호 관리도 철저했고, 공공 장소의 컴퓨터로, 혹은 공개된 와이파이 신호로 티스토리 관리자를 접속한 적도 없었습니다.

 

결국 이 해프닝의 원인 파악은 불가능 했고 티스토리 비밀번호를 바꾸고, 스킨을 다시 한번 내 컴퓨터로 저장하고, 내친김에 티스토리에 올려진 데이터를 모두 백업하여 내 컴퓨터에 저장하는 과정까지 마친 후 마무리가 되었습니다.

또 뭔가 이상한 징후가 있을까 싶어 며칠간 철저히 감시(?)를 했지만 별다른 이상 징후는 없었네요.

 

평소 백업이 중요하다는 것을 늘 인지하고 다른 사람들에게도 자주 말하곤 했지만, 정말 백업 덕분에 한숨을 돌릴 수 있었던, 아찔한 기억입니다.

 

이 글을 공유하기

댓글 :: 질문 댓글은 공개글로 달아주세요. 특별한 이유없는 비밀 댓글에는 답변하지 않습니다

Designed by JB FACTORY