본문 바로가기

티스토리스킨/팁.활용.확장

티스토리 스킨 적용시 주의사항과 문제 해결 방법, 그리고 티스토리 버그 안내

1. 

스킨 적용을 위해 index.xml 파일을 업로드하면 모래시계가 무한으로 돕니다.


티스토리 시스템 버그입니다.

100년을 기다려도 모래시계는 풀리지 않습니다.

xml 파일을 업로드 하면 1-2초 안에 xml 파일 업로드는 완료되고 스킨 편집기에 xml 파일안의 설정값과 옵션 항목들이 바로 표시됩니다.


작년 가을 무렵 티스토리 패치가 되고 나서부터 새롭게 나타나는 버그 현상이며, 아직 패치는 되고 있지 않습니다.


모래시계가 돌기 시작하면 화면 갱신을 그냥 하거나, 스킨 편집기 옵션 설정 화면으로 이동해서 옵션값들이 보이는지 확인하면 됩니다.





2.

스킨에 포함된 이미지 파일들을 업로드했는데 블로그에 적용되지 않습니다.


티스토리 시스템은 페이지 로딩 속도 향상과 시스템 부하를 줄이기 위해 서비스 단에 캐시(웹브라우저 캐시처럼 서비스 서버단에 적용하는 캐시)를 사용합니다.

스킨 편집기에서 업로드하는 파일은 업로드는 되지만, 캐시에 반영되기 까지는 일정 시간이 지나야 합니다.

평균적으로는 5~10분 안쪽입니다.

이미지 파일을 업로드한 후 블로그 화면을 갱신했는데도 업로드한 이미지가 적용되어 보이지 않는 것은 이것 때문입니다.

잠시 기다리면 이미지가 적용된 것을 확인할 수 있습니다.

캐시에 즉시 반영되도록 하려면, 웹브라우저 캐시를 한번 소거해주면 됩니다.




3.

스킨을 모두 적용했는데 레이아웃이 깨지고, 사이드바 메뉴가 나타나지 않습니다.


스킨 적용을 위해서는 필수 파일이 3개가 필요합니다.

(일부 스킨은 css, xml 파일이 없을 수도 있습니다. 옵션설정이 필요없을 경우 xml 파일은 불필요하며, html 안에 css 구현을 모두 한 경우 css 파일은 필요가 없을 수 있습니다.

skin.html, style.css, index.xml 파일 3개가 필요합니다.

skin.html, style.css 파일은 파일을 텍스트 편집기에서 복사&붙여넣기로 적용하고, index.html 파일은 파일 업로드 기능으로 업로드를 하면 됩니다.


이 3개의 파일은 대부분 배포되는 스킨에서는 압축파일 루트에 있기 때문에 쉽게 찾아 적용할 수 있습니다.

대부분의 스킨, 그리고 커버 기능을 지원하는 스킨들은 이 3개의 파일 외에 자바스크립트 파일과 이미지 파일들을 추가로 필요로 하게 됩니다.

스킨 제작 가이드에서 이런 파일들은 images 폴더 안에 따로 모아서 저장하는 것을 권장하며,

티스토리 스킨 편집기의 파일 업로드 탭에도 images 폴더와 함께 자바스크립트 파일과 이미지 파일은 이 폴더로 자동 업로드가 됩니다.

(별도 폴더를 지정하지 않아도 파일 확장자에 따라서 자동으로 images 폴더 안으로 업로드 됩니다.)

특히 자바스크립트 파일은 html과 css만으로는 구현할 수 없는 복잡한 레이아웃이나, 기능을 구현할 수 있게 해주기 때문에 일부 스킨에서는 자바스크립트 파일이 없을 경우 블로그 메뉴가 엉뚱한 곳으로 이동하거나, 레이아웃이 어긋나 보이게 되는 경우가 있을 수 있습니다.


스킨을 다운로드 받아 적용하는 경우

images 폴더 안에 있는 모든 파일은 반드시 모두 업로드해야 합니다.


그리고 가장 중요한 점이 하나 있습니다.


이렇게 업로드한 파일들(자브스크립트, 이미지 파일)은 적용한 블로그에 실시간으로 적용되어 보이지 않습니다.

티스토리 캐시 시스템으로 인해 일정 시간이 지나야(약 5-10분) 반영되어 보이게 됩니다.

즉시 반영된 결과를 보고 싶으면, 웹브라우저 캐시를 한번 소거해주면 됩니다.




4. 

스킨을 적용했는데, 한글이 모두 깨지고 특수문자(이상한 문자)로 표시됩니다.


skin.html, style.css 파일 내용을 복사해서 스킨 편집기의 각 탭에 붙여넣을 때 잘못 붙여넣은 것입니다.


skin.html, style.css 파일은 utf-8  인코딩이 되어 있으며, 티스토리 시스템도 utf-8을 기본으로 해서 서비스 및 화면 출력이 이루어집니다.


배포되는 티스토리 스킨들은 대부분 utf-8로 인코딩된 텍스트 파일입니다

이 파일을 사용하는 편집기에서 열었을 때 utf-8로 인코딩된 문서를 제대로 해석하지 못해 euc-kr, 또는 ansi로 인코딩이 변경 될 수 있습니다.

이렇게 인코딩이 변경된 skin.html, style.css 내용을 티스토리 스킨 편집기 화면에 복사&붙여넣기를 해서 적용하면 한글이 모두 깨지게 됩니다.


가장 빠르고 간단한 방법은 윈도우 운영체제는 윈도우 메모장 프로그램, 기타 운영체지는 가장 많이 사용하는, 또는 운영체제에서 제공하는 기본 텍스트 편집기 프로그램으로 skin.htnl, style.css 파일을 열어서 복사&붙여넣기를 하는 것입니다.




5. 

스킨 옵션 설정 항목들이 모두 보이지 않고 레이아웃이 깨져 보입니다.


스킨 옵셜 설정 항목들, 특히 스킨 제작자가 별도로 만든 스킨 옵션 항목들은 모두 index.xml 파일안에 정의됩니다.

이 항목들은 스킨제작자의 의도에 따라 만들어지는 항목들이기 때문에 스킨에 따라서 보여지는 옵션 항목들이 모두 다릅니다.

또한. index.xml 파일을 업로드하지 않을 경우 스킨 제작자가 설정한 옵션 항목들의 기본값이 적용되지 않으면서 레이아웃이 깨져보일 수 있습니다.

적용하려는 스킨에 index.xml 파일이 포함된 경우 반드시 업로드 해야 합니다.

스킨에 따라서는 스킨제작자가 별도의 옵션 설정을 하지 않는 경우가 있기 때문에 index.xml 파일을 업로드 하지 않아도 스킨이 잘 동작하는 경우도 있지만

기본적으로 스킨 적용시에는 index.xml 파일은 반드시 업로드를 하는 것이 좋습니다.




6.

스킨에 포함된 모든 파일은 기본적으로 모두 블로그 스킨에 사용되는 파일이다!


index.xml, skin.html, style.css, images 폴더안의 이미지 파일들, 그리고 자바스크립트 파일

스킨에 포함된 이렇게 5가지 파일들은 기본적으로 모두 적용, 또는 업로드를 해야하는 파일입니다.

특히, 대부분의 신스킨들은 index.xml, 자바스크립트 파일을 업로드하지 않는 경우 스킨이 제대로 적용되지 않고

레이아웃이 깨져보이거나, 스킨 옵션 기능들이 정상 동작하지 않게 됩니다.


반드시 모든 파일들을 적용, 업로드 한 후, 

웹브라우저 캐시를 한번 소거하고, 

화면 갱신을 해서 블로그에 스킨이 적용되었는지를 확인해야 합니다.


닫기