티스토리 스킨 변경 :: square 스킨에서 jb skin 131 변경 후 해야 할일

IT/블로그 팁
2019. 11. 15. 13:34

티스토리 스킨 변경 이후에 해야 할 일 간단 정리.

안녕하세요, gapsoo life blog의 gapsoo 입니다. 오늘은 티스토리 스킨을 변경 이후에 첫 포스팅 이기도 하고 스킨 변경 후 무엇을 해야하는지 간단하게 목록화 하여 정리한 포스팅 이기도 합니다.

안에 세부사항은 이미 구글과 다른 블로거 또는 유튜버 분들이 아주 많이 올려놓아 주셨답니다. 한 번 검색 하셔서 세부 정보를 찾아보시기 바랍니다. 물론 저도 나중에 해당 주제에 대하여 포스팅을 하겠지만, 지금은 어제 스킨 변경 한 내용을 잃어버리지 않기 위해 그리고 스킨을 변경하고자 하시는 분들을 위해 도움이 되고자 이렇게 글로서 남겨봅니다. 그럼 지금부터 티스토리 블로그 스킨 변경에 관한 짦은 내용을 포스팅 해보도록 하겠습니다.

-목차-

티스토리 블로그 스킨 변경 이전에 해야 할일.

티스티리 블로그 스킨 변경 이후에 해야 할일.

이외에 스킨을 변경하면서 얻게 된 정보들.

연관글.

티스토리 스킨변경 이전 할일.

티스토리 스킨변경 이후 할일.

티스토리 스킨 변경 이전.

이전에 할일 목록.

- 구글 애드센스 사이트 연결 코드 메모장에 복사.

- 구글 웹마스터(서치콘솔) 도구 메타태그 코드 메모장에 복사.

- 네이버 웹마스터(서치어드바이저) 도구 메타태그 코드 메모장에 복사.

- 구글 애드센스 자동광고 설정 코드 메모장에 복사.

- ms bing 도구 메타태그 코드 메모장에 복사.

위 화면은 제가 약 1년 정도 사용하던 square 스킨의 마지막 모습입니다. 저의 첫 티스토리 블로그 이기도 하고 많은 과제와 웹 지식을 안겨주었던 squre 스킨 이었습니다. 하지만 유료 스킨에 대한 갈증이 있었고 포스팅을 하면서 유료 스킨에 대한 장점에 대해서 알게 되다 보니 자연스럽게 스킨을 변경 하게 되었습니다.

스킨을 변경 하기 전에는 위 와 같이 5가지 코드를 [html 편집]에 가서 복사 하여 메모장에 붙여 넣어 코드를 확보 해야 합니다. 위 코드 중 가장 중요한 코드는 구글 애드센스 사이트 연결 코드 입니다. 이 코드는 다시 확보하는데 많은 어려움이 있다는 다른 블로그니들의 경험담이 있습니다. 그러니 꼭 확보하시기 바랍니다. 이 외에 자신이 등록하였던 메타 태그와 자동광고 설정 코드등을 메모장에 복사-붙여넣기 해주시기 바랍니다. 스킨을 변경 하기 전에 저와는 다르게 구글 자동광고 설정을 하지 않으셨던가, 웹마스터 태그 작업을 하지 않으셨던 분들은 당연히 자신의 스킨에 코드가 없으니 위 5가지 목록과 동일하지 않더라도 크게 신경 쓰지 않으셔도 됩니다.

티스토리 스킨 변경 이후에 해야 할일.

티스토리 스킨변경 이후에 해야 할일 목록.

1. 이전에 복사해둔 코드들을 변경 이후 스킨의 <head>...</head> 사이 상단에 붙여넣기.

2. 새로운 스킨 설정하기.(카테고리, 사이드바, 광고배치, 플러그인 등)

3. 네이버 웹마스터(서치어드바이저) 도구 rss 다시 제출.

4. 구글 웹마스터(서치콘솔) 도구 rss 다시 제출.

5. 네이버 웹마스터(서치어드바이저) 도구에 사이트맵 다시 제출.

6. 구글 웹마스터(서치콘솔) 도구에 사이트맵 다시 제출.

7. 마무리된 자신의 블로그 보면서 뿌듯해 하기.

두 번째 사진은 티스토리 스킨을 변경 이후에 첫 모습 입니다. 아직 정리가 덜 된 모습이 많이 보입니다. 제가 선택한 스킨은 jb factory에서 구매 가능한 jb skin 131 스킨 입니다. 확실히 광고도 많이 넣을 수 있고, 속도도 빠르고 기존 스킨 보다는 깔끔하다는 느낌을 많이 받습니다.

하지만 느낌만 받고 있기엔 할 일이 많았습니다. 처음 스킨을 변경하는 거다 보니 엄청 떨면서 바꿨거든요. 그래서 후다닥 설정을 했습니다. 티스토리 스킨 변경 이전에 할일과 다르게 이후에 할일 목록에는 숫자가 적혀 있습니다. 그 이유는 가능한 순서대로 하시길 바라기 때문입니다. 먼저 복사한 코드들을 변경한 스킨에 붙여넣기를 하고, 새로운 스킨을 설정하고 각 포털의 웹 도구에 rss와 사이트맵을 제출하는 순서 입니다.

스킨을 변경하면서 얻게 된 소소한 정보들.

1. 인피드 광고의 정의와 선택방법.

인피드 광고는 목록 사이에 넣는 광고 입니다. 인피드 광고 설정시 자동광고와 수동 광고가 있는데 자동광고는 모바일과 데스크탑으로 나뉘어져 있습니다. 이 때 그냥 자동광고 모바일로 선택하고 사용 해도 데스크탑, 모바일 두 군데에서 다 나옵니다. 수동광고는 약간의 이질감이 있으니 자동광고 모바일을 추천드립니다.

2. jb factory :: jb skin 131 본문 폰트 본고딕(Noto Sans KR)으로 변경하는 방법.

이건 반은 좋은 정보이고, 반은 나쁜 정보 인데요, jb skin 131 폰트(글씨체)를 본고딕(Noto Sans KR)으로 변경 하고 싶으신 분들은 [html 편집]->CSS 부분에서 /* Typography */ 의 body 부분에서

font-family: "Malgun Gothic", sans-serif; xxx...

위 부분을

font-family: "Noto Sans KR", "Malgun Gothic", sans-serif; xxx... 이런식으로 연두색 부분을 추가하면 변경이 됩니다.

jb skin 131 폰트 글씨체를 본고딕으로 변경 하는 정보를 반은 좋고 반은 나쁘다고 하는 이유는 위 방법이 폰트는 변경 해주긴 하는데 코드를 변경하는 것이 제 블로그에 어떤 나비효과로 다른 영향을 주는지 아직 모르기 때문입니다. 개발자님에게 문의 해볼 예정이긴 한데 코드 변경건은 답변을 잘 안해주신다는 소문도 있고 해서 저는 일단 폰트를 변경 하지는 않고 써보기로 했습니다. 추후에 한번 문의 드려 보고 확실 하다면 다시금 포스팅 해볼 예정 입니다. 혹시 위 문제에 대해 코드 변경해도 큰 문제 없거나 문제가 있어도 해결책을 알고 계신 독자 분들은 댓글 남겨 주시기 바랍니다. 저는 본고딕으로 본문을 꾸미고 싶습니다.

3. 해당 웹사이트 또는 블로그가 사용하는 폰트 글자체 종류 알아내는 방법.

이 정보는 위 2번과 연관이 있습니다. 바로 해당 사이트 또는 블로그의 글자체가 무엇인지 알아 내는 방법입니다. F12를 눌러 개발자 도구에서 왼쪽 위에 마우스 로고가 있는 부분(Select an element in the page to inspect it Ctrl+Shift+C)을 클릭 후 해당 사이트 또는 블로그의 글자를 클릭 하면 개발자 도구 중간쯤에 Styles 칸 오른쪽에 네모난 그림들이 있을 거에요. 그 부분을 내려보면 font-family 란 목록이 나옵니다. font-family를 클릭 하면 해당 웹사이트 또는 블로그가 사용하는 글자체의 종류를 알 수 있습니다.