이번에는 티스티로 무료 스킨을 제작했습니다. 사실 이전부터 조금씩 수정하며 사용하고 있었고, 기존의 판다스킨보다 훨씬 예쁘고 성능도 좋다고 생각합니다. 그 이전의 스킨은 빠르긴 빨랐지만, 티스토리 볼륨을 키우는 것엔 간과했고 여러가지 기능이 빠지다보니 다소 아쉬운 부분이 있었습니다.
티스토리 무료스킨 구름 1.1
이번 스킨의 경우에는 예시를 보시면 알겠지만, 상당히 깔끔하고 예쁜 스킨입니다. 여러 버전으로 제작이 되었는데, 이번에 배포하는 무료스킨은 배포용 버전입니다. 다른 스킨들과 별 차이는 없습니다. 차이가 있다면, 일부분 디자인이 살짝 다른 정도입니다.
사용방법에 대해서도 사실 스킨을 설치하고 커버로 전환하면 끝입니다. 아무래도 많은 사람들이 이용했으면 하는 마음이 있고, 그러다보면 스킨 편집 부분에 있어서 어려움이 있을 수 있기 때문에 대부분 치환자값으로 알아서 표시되도록 작업을 했습니다. 또한, 아무래도 광고 위치라던가 그런 부분에 있어서 광고를 조금 넣으면서도 수익은 크게 향상될 수 있도록 최적의 위치를 많이 고민했던 것 같습니다.
1. 스킨 제작의 목적
스킨의 속도도 중요하고 구글 검색과 네이버 검색 엔진에서도 선호할 수 있는 요소들을 추가했습니다. 예를 들면, 구글 검색엔진에 도움을 주는 이동경로나 목차와 같은 부분들도 추가되었습니다. 목차(TOC)의 경우에는 제목태그를 활용하면 알아서 목차가 본문에 추가 됩니다.
2. 스킨 이름과 적용모습
이번에 배포하는 스킨의 이름은 구름 1.0 입니다. 저와 함께 사는 강아지 이름을 따왔습니다. 별 다른 이유는 없습니다. 사실 스킨에 대해 설명을 많이 해야하는데, 설명할 부분도 마땅치 않고 설정할 것도 없어서 어떤 이야기를 풀어나가야 할 지 모르겠습니다.
스킨을 적용하면 위와 같은 모습입니다. 좌측에는 버튼형식의 카테고리가 예쁘게 자리잡고 있고, 인기글과 최신글 사이드바가 심플하게 꾸며져 있습니다. 그 다음 티스토리의 관리자 페이지에서 메뉴에 추가되는 링크가 사이드바에 노출됩니다.
최근 댓글과 공지사항 등도 추가할 수 있는데, 최근댓글의 경우 텍스트가 모두 가림처리 되었습니다. 의도한 것은 아니지만, 훨씬 깔끔해보이고, 오히려 궁금증을 유발할 수 있는 것 같아서 그대로 뒀습니다.
3. 스킨 편집 부분
별도로 수정해야 할 것도 없고, 설정해야 할 부분도 없습니다. 모든 옵션은 하나입니다. 별다른 설정을 하지 않아도 검색에 아주 잘 노출이 될 수 있게 되어있습니다. 깔끔하고 높은 가독성을 위해 나눔스퀘어 힌팅 웹폰트가 적용되어 있습니다. 많은 웹폰트는 필요하지 않습니다.
홈 설정과 기본 설정의 보여질 글 수를 설정할 수 있습니다. 댓글 기능 또한 있습니다. 공감 버튼도 참 예쁘고, 맨 위로 갈 수 있는 버튼도 오른쪽 하단에 배치되어 있습니다. 깔끔하고 예쁩니다. 방명록 기능도 추가되어 있습니다.
4. 저작권 관련 및 저작권 표시
하단에 저작권 표시가 있습니다. 디자인적인 요소를 해치지 않고 깔끔하게 구분되어 있습니다. 구름 스킨을 이용하시는 분들은 저작권을 삭제하지 말아주세요. 더 많은 분들이 이 스킨을 사용했으면 좋겠습니다. 또한, 자신의 블로그 링크와 블로그명도 하단에 표기가 되니, 변경하실 필요가 없습니다.
5. 버그 제보 및 스킨 적용 문의
스킨 적용에 어려움을 겪으시는 분들은 카카오톡 채팅방 또는 방명록을 통해서 문의 해주시면 감사하겠습니다. 해당 웹사이트는 댓글 기능을 지원하지 않습니다. 어지간하면 어려움 없이 설치할 수 있을 것이며, 압축파일 내에 있는 파일들을 모두 스킨등록 시 추가해주시면 됩니다. 그래봤자 이미지 파일 포함 10개가 전부입니다.
오픈채팅방의 경우에는 수익을 향상시키거나 티스토리 운영에 대한 자유로운 이야기를 나눕니다. 누구나 들어오셔서 자유롭게 대화에 참여해주세요. 어쩌면, 다른 사람들이 알지 못하는 새로운 사실과 정보를 알게 될지도 모릅니다.
6. 버그픽스 및 업데이트
- 카테고리 페이지 내의 글 목록이 보이지 않는 이슈
스킨 편집에서 기본 설정 - 목록 구성 요소를 [목록+내용]으로 변경해주시면 됩니다. 이 부분은 별도로 스킨 업데이트로 해결할 수 없는 문제이기 때문에 스킨 설치 시 위의 내용으로 변경해주시길 바랍니다. 새롭게 설치하시는 분들은 새로운 파일로 업데이트를 했기 때문에 그대로 적용해보시면 됩니다.
- 이동경로(브레드크럼) *‘id’ 입력란의 URL이 잘못되었습니다.
<!-- 이동경로 시작 -->
<nav role="navigation" aria-label="Breadcrumbs" class="bf-breadcrumb clearfix bc-top-style"><div class="container bf-breadcrumb-container"><ul class="bf-breadcrumb-items" itemscope="" itemtype="http://schema.org/BreadcrumbList"><meta name="numberOfItems" content="3"><meta name="itemListOrder" content="Ascending">
<li itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem" class="bf-breadcrumb-item bf-breadcrumb-begin"><a itemprop="item" href="https://creativestudio.kr/" rel="home"><span itemprop="name">라이브러리 브랜드</span><meta itemprop="position" content="1"></a></li>
<li itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem" class="bf-breadcrumb-item"><a itemprop="item" href="https://도메인.tistory.com/category/Tistory/User%20Skin"><span itemprop="name">Tistory/User Skin</span><meta itemprop="position" content="2"></a></li>
<li itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem" class="bf-breadcrumb-item bf-breadcrumb-end"><span itemprop="name">티스토리 무료스킨 구름 1.1 배포 다운로드</span><meta itemprop="position" content="3"><meta itemprop="item" content="https://도메인.tistory.com/3058"></li></ul>
</div></nav>
구글 콘솔에서 위와 같이 이동경로 문제가 발생한다면 스킨편집 HTML에서 위의 주석처리 된 부분을 찾아 자신의 티스토리블로그 도메인 주소를 추가해주시길 바랍니다. 위의 코드에서 '도메인'이라고 작성되어 있는 부분을 자신의 티스토리 도메인으로 변경해주시면 되겠습니다.
7. 추가
복사방지를 위해 드래그 기능을 막아놓았습니다만, 만약 드래그 방지를 해제하고 싶다면 아래와 스타일을 제거해주세요. 스킨편집 › CSS에서 아래 부분을 모두 제거하시고 적용하시면 되겠습니다.
* {user-select: none;}
'Tistory > User Skin' 카테고리의 다른 글
제너레이트 프레스(GeneratePress) 티스토리 스킨 + 댓글 기능 추가 (5) | 2022.11.11 |
---|---|
제너레이트 프레스(GeneratePress) 티스토리 스킨 무료 배포 (22) | 2022.11.11 |
티스토리 개인배포용 '인스타그램' 스킨제작(미배포용) (0) | 2022.08.02 |
수익형 블로그를 위한 스퀘어(SQuare) 스킨 (10) | 2021.09.05 |
세상에서 제일 빠른 티스토리 스킨, 판다스킨(Panda) 무료배포 (3) | 2021.07.16 |