지난 12월말..호기심에 백업도 안하고 적용했다가 기존 블로그 스킨을 통째로 날려먹은 사연에 관한 이야기를 했었죠? 그 이후 지금의 웹반응형 스킨을 적용하고 잘 사용중에 있습니다.
그래서 웹반응형 스킨 적용기를 조금씩 올려볼까해요^^ 다른 분들 블로그에서 많은 도움을 받았지만 나름대로 제 블로그에 어떻게 적용을 했는지에 대해서도 되도록 알기 쉽게 설명할 예정이에요.
이번 시간에는 티스토리용 웹반응형 스킨중 하나인 SKELETON을 어디서 다운로드 받고 어떻게 티스토리에 적용을 하는지에 대해서만 간단히 알려드릴까 합니다.
혹시 웹반응형 스킨에 관심이 있으시면 이 스킨 정말 추천하고 싶어요~ 적용을 원하신다면 반드시 기존 스킨은 필수적으로 백업을 하신 다음에 테스트로 적용하세요.
티스토리 블로그를 위한 웹반응형 스킨은 공식적으로 티스토리에서는 제공을 하지 않고 있습니다..(언젠가는 제공이 될꺼라고 믿지만^^)
그래서 검색을 통해서 웹반응형 블로그 스킨을 아주 전문적으로 개발하시는 분을 발견했는데 '마크쿼리'라는 분이에요.. 홈페이지 주소는 markquery.com이구요.
이 분의 홈페이지에 접속해보면..이 홈페이지 자체도 웹반응형 스킨이 적용되어 있더라구요~ 티스토리 웹반응형 스킨 skeleton을 다운받으려면 오른쪽 상단의 'download'를 클릭합니다.
다운로드 페이지가 나타나면 왼쪽 사이드바에 skeletons 스킨이라는 메뉴가 보이는데..여기서 wordpress용,docpad용...그리고 tistory용이 따로 개발되었다는 사실을 확인할 수 있어요~
우리가 원하는 버젼은 티스토리용 스킨이기 때문에 다른 버젼은 신경쓰지마시고 티스토리용 skeleton 웹반응형 스킨만 다운로드 하면 되겠죠^^ 여기서 'tistory'를 클릭하면...
이렇게 티스토리용으로 개발된 웹반응형 스킨 skeleton이 두 종류가 나타납니다. 하나는 spider's web이구요 하나는 Doo Be Doo인데..조금씩 다르겠지만 지금 이 블로그 같은 경우 spider's web을 적용했답니다^^
티스토리 웹반응형 스킨(SKELETON) 다운로드와 적용
두 가지의 정확한 차이는 해보지 않아서 저도 잘 모르겠네요~
마크쿼리님의 홈페이지를 살펴보면 각각의 스킨 종류를 적용했을때의 예제를 직접 확인할 수도 있으니 본인 취향에 맞는 스킨을 선택하는 것도 좋은 방법이겠죠.
밑으로 마우스를 드래그 해서 내려보면 위와 같은 다운로드 버튼을 볼 수 있는데요..역시 이 부분도 spider's web과 Doo Be Doo가 따로 나누어져 있습니다.
위 캡쳐화면속의 설명처럼 다운로드하면 윈도우의 '다운로드'폴더에 자동으로 저장이 되는데..티스토리에 스킨등록을 할때는 grunt폴더만 제외하고 나머지만 올리면 된다고 합니다.
윈도우 다운로드 폴더에 저장된 티스토리 웹반응형 스킨 skeleton 'spider's web'의 세부 파일들..
여기서 grunt라는 폴더만 빼고 나머지만 티스토리에 업로드하면 되는데 images폴더같은 경우는 폴더를 열어서 내부에 있는 파일을 따로 올려줘야 업로드됩니다. (그냥 폴더통째로 업로드가 안되더라구요 ㅠ)
웹반응형 스킨의 등록은 티스토리 관리자 모드옆에 있는 꾸미기-스킨 메뉴에서 할 수 있습니다.
저기 오른쪽에 '스킨등록' 버튼이 보이죠? 여기서 반드시 유의해야 할 점은 스킨등록 버튼을 누르기전에 반드시 기존 스킨은 '스킨저장'버튼을 눌려서 백업을 시켜둬야 한다는 사실이죠.
(예전에 그러지 않고 무턱대고 스킨등록 버튼을 눌렀다가..한방에 기존 스킨을 날려먹었죠ㅠ)
그리고 티스토리 웹반응형 스킨을 등록했다고 바로 제대로 적용이 되는 건 아니구요...보관함에 들어가서 '적용'버튼을 눌러줘야 정상적인 모습으로 적용이 됩니다~
지금 로렌과오뚜막 블로그에 적용되어 있는 스킨이 마음에 드시고 앞으로 웹반응형 스킨으로 변경해보려고 한다면 'skeleton'스킨을 써보세요~
아주 깔끔하면서도 심플한 스킨이거든요^^ 지금은 개발자분이 무료로 배포중이지만..언제 유료로 바뀔지는 아무도 모름.
✅웹반응형 블로그 스킨 skeleton '카테고리' 오류 해결
✅웹반응형 스킨 'skeleton' 상단메뉴 버튼(드롭다운) 만들기
✅웹반응형 스킨 'skeleton' 본문상단에 구글번역기 넣는 방법