본문 바로가기

티스토리 스킨 변경 방법 & 베이스캠프 스킨 설정

팁라이브러리 발행일 : 2023-09-07

티스토리 스킨 변경 방법을 정리한 글입니다. 티스토리 블로그 스킨을 교체하였습니다. 몇 년 만에 변경한 것인지 기억나진 않습니다. 블로그를 운영하고 있다는 것조차도 까맣게 잊고 살았는데 스킨 변경 날짜를 기억할리 없습니다. 웹 기술도 유행이 있습니다. 요즘 유행하는 최신 기술과 최신 디자인이 적용된 티스토리 스킨을 찾아 블로그에 적용했습니다. 무료로 배포되는 베이스캠프 스킨의 디자인이 마음에 들어 블로그에 적용했습니다.

 

 

이렇게 티스토리 블로그 스킨 변경하는 방법을 글로 작성하게 되었습니다. 감 잡을 때까진 티스토리 관련 글이 많을 것 같습니다.

 

티스토리 스킨 변경 작업은 3단계로 나눠진다고 볼 수 있습니다. 3단계 작업으로 나눠 진행되지만, 복잡하거나 어려운 부분은 없습니다. 다만, 변경할 스킨 선택하는 것은 정말 어렵습니다. 그리고 복잡하고 어려운 것은 스킨을 변경한 후에 시작됩니다.

 

티스토리 블로그 스킨을 변경하게 되면 수정해야 할 일이 산더미만큼 쌓이게 됩니다. 이 글에서는 티스토리 스킨 변경 방법과 필수급 베이스캠프 스킨 설정 해야 하는 부분들만 설명하겠습니다.

 

 

 

티스토리 스킨 변경

티스토리 관리 페이지에스 스킨 변경 클릭

 

우선 티스토리 관리자 페이지에서 꾸미기 하위 메뉴 스킨 변경으로 진입합니다.

 

사용 중인 스킨 보관한 다음 새 스킨 등록

 

티스토리 스킨 변경 작업은 3단계로 진행됩니다.

 

1단계는 건너뛰어도 무방합니다. 하지만 문서 작업과 같이 원본 파일은 백업해 놓고 작업해야 마음이 놓일 것입니다. 스킨 파일을 백업해 놓으면 자칫 잘못될 경우 보관함의 백업파일로 복구할 수 있습니다.

 

1단계에서 사용 중인 스킨을 저장한 후에는 2단계 작업으로 새로운 티스토리 스킨을 등록할 것입니다. 그리고 3단계로 새로 등록한 스킨을 블로그에 적용하면 스킨 변경 작업은 완료됩니다.

 

 

 

사용 중인 스킨 보관

사용중인 스킨 저장

 

스킨 편집 상단에 현재 사용 중인 스킨이 표시됩니다.

 

사용 중인 스킨에 표시된 보관 버튼을 클릭하면 스킨명을 입력한 후 저장시킬 수 있습니다. 문서 작업할 때처럼 구분하기 쉽게 날짜 및 버전을 표시하여 저장하면 좋습니다.

 

새 스킨 등록

티스토리 스킨 파일 업로드

 

스킨 편집에서 스킨 목록 우측의 스킨 등록 버튼을 누르면 스킨 등록 화면이 열립니다.

 

스킨 등록에서 압축을 풀어 준비한 스킨 파일들을 모두 선택하여 업로드하면 됩니다. 파일이 적은 스킨의 경우 파일 및 images 폴더가 한 번에 모두 업로드됩니다.

 

하지만 베이스캠프 스킨과 같이 images 폴더 내에 파일이 많을 경우에는 두 번 나눠서 업로드해야 할 수 있습니다.

 

티스토리 스킨 파일 추가

 

만약 한 번에 모든 파일이 업로드되지 않을 경우에는 images 폴더 내의 파일들을 별도로 업로드해 주어야 합니다.

 

스킨명 입력한 후 확인 버튼 클릭하여 티스토리 스킨 저장

 

모든 파일을 업로드한 후에는 스킨명을 입력하여 저장하면 됩니다. 구분하기 쉽게 스킨명, 날짜, 버전 등으로 구성하면 좋습니다.

 

 

스킨 보관함에 등록된 스킨 적용

스킨 보관함에서 적용 버튼 클릭하여 티스토리 스킨 적용

 

등록한 새 스킨 파일은 스킨 보관함에 저장됩니다. 편집 작업 또는 사용 중 백업 차원으로 보관한 스킨도 모두 스킨 보관함에 저장됩니다. 무한정 저장되는 것은 아니며, 30개까지만 저장할 수 있습니다.

 

스킨 보관함에 등록된 스킨에 마우스 커서를 올린 후 적용 버튼을 클릭하면 해당 스킨이 블로그에 적용됩니다.

 

스킨 변경 시 홈 커버, 사이드바 설정 초기화

 

안내에는 '설정이 초기화될 수 있습니다'로 안내되고 있습니다.

 

스킨을 변경하면 100% 홈 커버, 사이드바 설정이 초기화됩니다. 스킨 변경 전에 홈 커버, 사이드바 설정 확인하고 백업하세요.

 

사용중인 티스토리 스킨 베이스캠프

 

스킨 변경이 완료되면 사용 중인 스킨으로 표시됩니다.

 

블로그에 적용한 스킨은 베이스캠프 1.0.0-rc10 버전입니다. 스킨 소개는 이미 이전 베이스캠프 스킨 글에 하였으니 이동하여 확인하면 됩니다.

 

베이스캠프 스킨은 기본 설정 상태로 사용하더라도 큰 문제는 없습니다. 별도로 설정하면 좋긴 하겠지만 하지 않고 사용하더라도 문제는 없습니다.

 

이 블로그의 경우는 스킨 편집의 추가 설정에서 사이드바 위젯 일부 해제하고, 브랜드 컬러(푸터 저작권자 폰트 컬러) 변경한 것이 전부입니다. css 편집과 html 편집은 열지도 않았습니다.

 

css와 html을 열지 않은 이유는 한 번에 편집 작업을 하기 위함입니다. 한 동안 기본 상태로 사용하며 수정해야 할 곳들을 찾아 정리할 것입니다. 정리가 끝나면 그때 한 번에 편집 작업을 할 예정입니다.

 

하지만 관리자 페이지에서 사이드바 설정은 확인해야 합니다. 사이드바에 공지사항, 최근에 올라온 글, 이 블로그 인기글, 최근에 달린 댓글, 태그 클라우드가 기본으로 표시됩니다. 원치 않는 것들은 비활성 시켜야 사이드바에 노출되지 않습니다.

 

메뉴도 홈, 태그, 미디어로그, 위치 로그, 방명록이 기본 설정입니다. 블로그마다 메뉴 상태가 다르겠지만 사용을 원치 않는 것들은 직접 삭제해야 합니다.

 

베이스캠프는 반응형 스킨이기에 모바일 설정도 확인해야 합니다. 모바일 설정에서 '티스토리 모바일 웹 자동 연결을 사용하지 않습니다.'로 설정해야 합니다. 다만 설정하더라도 직접 모바일 주소로 접속할 경우 모바일 웹으로 접속됩니다.

 

플러그인은 꼭 필요한 것이 아니라면 사용하지 않는 것이 좋습니다. 구글 애널리틱스, 서치콘솔, 네이버 웹마스터 도구 연결하기 위해 두 가지 플러그인을 켜는 것은 낭비입니다. 스킨에 메타 태그 2 줄 하고 3~4줄짜리 자바스크립트 소스 넣으면 끝나는 간단한 일을 플러그인 2개로 하려 하지 마세요. 그리고 변경된 구글 애널리틱스 4 속성 만들기 글도 참고하세요.

 

 

티스토리 스킨 베이스캠프는 링크한 깃허브 페이지에서 다운로드할 수 있습니다. 티스토리 스킨 베이스캠프 회원 가입하지 않고 무료로 다운로드할 수 있습니다.

댓글