티스토리 2단 레이아웃 스킨 변경 및 편집

Q_ 더 예쁘고 보기 좋은 블로그는 없을까?

네이버 블로그를 운영했을때는 매우 쉬웠다.

아시는 분들은 아시겠지만 네이버의 경우 정해진 틀 내에서 변경을 진핸하는 방식이다.

때문에 많은 사람들이 틀 안에서 간편하게 변경을 진행하였고, 더 나아가 다양한 활용방법에 대해서 사용을 진행했다. 하지만....

티스토리의 경우에는 조금 전문적인 느낌이 다분하다. < HTML > 와 < CSS > 를 잘 다루지 못해서 할 수 있던 네이버와 달리 좀 만져야한다.

물론 과거 초창기와 달라 왠만한 것은 검색을 하면 나오지만 뭘? 검색해야하는지 모르는 정도라면 안타깝게도 쓰기가 불편하다.

그래서 이번에 변경해보았습니다.

차이점이라면 보시는 것과 같이 < 사이드바 > 를 활용할 수 있다는 것 뿐입니다.

물론 기본적으로 스킨이 가지고 있는 폰트의 종류나 크기, 도는 줄간격... 그리고 다른 레이아웃의 차이도 있습니다.

하지만 이 부분의 경우에는 티스토리 설정을 통해 간편하게 변경이 가능한 부분이기에 논외로 두기로 하죠.

글쓰는 방식 역시나 < 중앙정렬 > 방식에서 < 좌측정렬 > 방식으로 다시 되돌아 갑니다.

일반적으로 중앙정렬의 경우 짧은 문장을 작성하기에 적합합니다. 

또한 모바일과 PC 가로폭을 맞출 수 있죠. 때문에 작성하면서 어떻게 글이 보여질지에 대해서 어느정도 감안할 수 있습니다. 단! 단점이라면 역시나 모바일에 중점을 두고 있기 때문에 PC 기준으로 보면 여백이 굉장히 많이 남을 수 밖에 없는 구조인 셈이죠.

현재 제가 작성하는 글들이 대부분 가벼운 글이 아니라는 점을 감안하고 PC 유입 비중이 생각보다 높은 것을 생각해보았을때 좀 더 나은 방향으로 변경을 진행하는 것이라고 생각해두시면 좋을것 같네요.

▼ 변경 방법

언제 또다시 마음이 변할지 모르기 때문에 일단 기존 티스토리 스킨은 저장해두죠.

설정 > 스킨변경 > 사용중인스킨 > 스킨보관

이것을 활용하여 세부적으로 변경했던 내용까지 모조리 저장합니다.

여기서 무작정 스킨을 바꾸면 안되죠. 왜냐하면 플러그인으로 저장한 것들도 있으나 직접 HTML에 넣은 코드도 있으니 보관해야겠죠.

일반적으로 티스토리에 사용되는 코드는 < 네이버애널리틱스 / 구글애널리틱스 / 구글콘솔 / 구글애드센스 > 등 광고 또는 통계코드입니다. 

< head > 영역에 넣어두기 때문에 잘 모아서 넣어두면 나중에 옮길떄도 그냥 한꺼번에 옮기면 되죠.

* 이걸 하지 않더라도 광고의 경우에는 플러그인이 그대로 따라가기 때문에 꺼지진 않습니다.

스킨의 경우 로고나 기본타이틀 이미지를 샘플형태로 제공하기 때문에 변경이 필요하죠.

이러한 이미지는 < 파일업로드 > 에 그 파일이 저장되어 있기 때문에 스킨편집에서 해당 이미지 파일명을 찾아보시면 변경이 빠릅니다.

파일업로드에서 해당 파일을 삭제하고 동일한 파일명으로 올리고 저장을 해도 이미지가 자동으로 변경되고, 아니면 HTML에 새로 저장한 파일의 파일명을 넣는 것도 상관없죠. 중요한 것은 기존 이미지 크기를 맞춰서 넣어줘야 여백이나 깨짐 등의 문제가 생기지 않습니다.

현재 사용하는 티스토리 스킨의 경우 본문의 가로폭이 500으로 설정되어있습니다. 이를 변경해야만 PC에서도 넓게 사용할 수 있는 것이죠.

이는 간단하게 변경이 가능합니다.

블로그관리 > 콘텐츠(설정) > 가로폭 조절

이미지 폭인 900으로 설정을 해두었지만 실제 스킨의 가로폭이 그만큼 나오지 않기 떄문에 실제로는 적용되지 않습니다. 다만 글을 쓸때 이만큼으로 나오는 것이죠.

가장 좋은 것은 실제 노출되는 가로폭과 동일한 PX 수를 넣어주는 것이 글을 쓸때 편리하긴 합니다.

---

티스토리 스킨 변경 사유 : 애드센스 및 광고배너 삽입

- 1차 변경 후 광고의 노출도나 수입률을 체크하려고 코드를 별도로 삽입하여 테스트 진행 중

- 모바일 노출이 되지 않기 때문에 하단 광고에 대한 위치 변경에 따른 광고 수익의 변화 체크 중

- 그냥 내 마음에 들지 않들지 몇일 일단 사용해보는 중 ㅋㅋㅋㅋ