Binnamoo Studio

티스토리 #2 스킨 수정해서 사용하기 - 티에디션, 카테고리 글 갯수, 새 글 표시 색상, top 버튼 만들기, 본문 넓히기 등 본문

Study Note/Blog & SNS

티스토리 #2 스킨 수정해서 사용하기 - 티에디션, 카테고리 글 갯수, 새 글 표시 색상, top 버튼 만들기, 본문 넓히기 등

binnamoo 2019. 4. 20. 16:46

    얼마 전에 티스토리 블로그를 다시 시작하고부터 어느 정도의 적응 시간을 가진 뒤, 스킨을 약간 수정하기로 했다. 이틀 동안 티스토리에서 제공하는 모든 스킨을 적용해보았는데 대부분 몇 개씩은 결정적인 아쉬움이 있었다. 물론 기본형이 완벽할 리가 없을 터이고 알아서 고쳐서 쓰는 것일 터이고... 그 중에서 그나마 반응형 #2가 그나마 가장 맘에 들어 이것으로 결정했다. 또 하나의 비공개 사진전용 블로그는 반응형 심플 포토블로그5 를 선택하였다. 

    처음으로 대하는 반응형 스킨은 재미있으면서 좀 성가시기도 했다. 아주 오래 전에 티스토리 블로그를 할 때 스킨 일부는 만질 수 있었는데 다시 html, css를 보려니까 눈이 아른거리고 도무지 자신이 없었다. 그래서 열심히 검색했다. 티스토리에는 역시나 고수들이 많이 포진하고 있구나~ 하는 걸 새삼 느꼈다. 덕분에 하나하나 풀어 나갈 수 있었다.

1. 티에디션 장착하기

관리자 기능에서 안보이다가 관리자 스킨편집 화면에서 갑자기 나타난 티에디션 덕분에 #2 스킨에 대한 아쉬움을 어느 정도 커버할 수 있었다. 그런데 왜 처음에는 안보였지? 아무튼 이상한 점은 다른 스킨을 들여다봐도 티에디션 기능이 안보인다는것이다. 임시블로그를 만들어 같은 #2 스킨을 적용해봐도 역시 티에디션이 안보인다. (혹시 이 내용을 아시는 분 좀 알려주세요~)

2. 카테고리에 글 개수 넣고, 새 글 기호 색상 바꾸기

카테고리에 글 개수가 표시되지 않으니 블로그가 마치 텅 빈 것처럼 보였다. 그리고 새 글을 표시하는 기호의 색상도 회색이라서 눈에 띄지 않는다. 그래서 검색을 통해 두 블로그를 찾아 해결하였다. 

반응형 스킨, 카테고리 글 개수 

근황, 티스토리 new 색 바꾸기


3. 블로그 본문 폭 넓히기

#2 스킨이 왼쪽 사이드바가 넓게 자리를 차지하는 바람에 본문이 약간 폭이 좁은 느낌이라서 기존 800px에서 820px로 약간 늘려 주었다. 티에디션의 폭과 일치시켰다. 이 역시 아래 블로그를 참조하였다.

티스토리 #2 반응형 스킨 본문 폭 넓히기

4. 블로그 하단에 Top Scroll 버튼 장착하기

글을 쓰다보면 블로그의 글이 길어질 경우가 많다. 이 경우 위로 스크롤을 하기가 곤란해서 어쩌다 방문하는 귀한 방문객들에게 예의가 아니다. 스크롤을 위로 하느니 그냥 블로그를 빠져나가 버리기 십상이지 싶다. 이 역시 아래 블로그를 찾아 해결했다. 그런데 top 버튼 png 이미지를 구하는 일이 너무 어려웠다. 포토샵으로 50px로 리사이즈하고 색상을 바꿨더니 픽셀이 뭉게졌다. 씨름하다가 대충 포기했다. 벡터로 깔끔하게 만들고 싶은데 일러스트는 꽝이다. (혹시 괜찮은 이미지 파일 가지고 계신 분은 도와주세요~)

블로그 꾸미기 맨위로 가기 TOP버튼 가장 쉽게 적용하기

   

     이제 스킨에 대한 고민은 일단 정리되었다. 스킨은 만지면 끝이 없다. 적당한 선에서 끊어줘야 한다. 앞으로 할 일이 있다. 블로그 파비콘과 아이콘 만들어 등록해 주는 것과 그동안 완전 바뀐 애드센스를 제대로 이해하는 일이다. 애드센스는 "텍스트 및 디스프레이 광고"를 선택해서 티스토리 플러그인에서 본문 하단에 위치를 정해줬는데 왠일인지 본문 상단과 하단, 그리고 맨 아래 관련 글 아래에 또 하나, 모두 세 군데나 광고가 뜬다. 아무리 만져봐도 딱 본문 아래에만 광고가 위치하도록 정할 수가 없다. 이러다가 블로그에 글쓰기보다 블로그 만지기에 취미를 붙이게 되는 건 아닌지 모르겠다. 아무튼 블로그는 많은 공부를 요구한다. 

2019. 4월 토요일 오후에
binnamoo™

Comments