재테크

기존 블로그를 티스토리 블로그로 이사하기

블루씰 2024. 9. 6. 12:13
반응형

다른 블로그를 이용하시는 분들이 애드센스 수익을 위해 티스토리로 이사하실 경우를 위해 만든 포스팅이에요. 전체적인 티스토리 블로그의 구성을 볼 수 있는 포스팅으로 준비했습니다.

 

  1. 콘텐츠 영역 지정하고 컨텐츠 옮기기
  2. 블로그 콘텐츠 옮길 때 팁! (인터넷 주소창 이용법)
  3. 스킨 편집하기 (스킨 편집 전체 화면)
  4. 새창에서 크롬 브라우저 F12눌러 화면 테스트하기
  5. 티스토리 스킨편집에 CSS버튼 눌러 영역을 수정하기

 

 

 

1. 콘텐츠 영역 지정하고 컨텐츠 옮기기

콘텐츠 > 카테고리 관리 영역에 들어가셔서 대메뉴부터 분야를 잘 맞춰서 하나하나 잘 지정해 주세요!

일단 콘텐츠를 넣으려면 마땅한 카테고리가 있어야 되겠죠. 콘텐츠 메뉴의 카테고리 관리를 통해 카테고리를 만들어줍니다. 네이버 블로그의 카테고리 관리와 다르지 않으니 대 메뉴와 소 메뉴를 적절히 나누어 분배해 동일하게 만들어 주시면되고, 카테고리에 맞게 주제를 선택해 주면 세팅이 끝납니다.

 

 

 

2. 블로그 콘텐츠 옮길 때 팁! (인터넷 주소창 이용법)

기존에 네이버 블로그에서 사용하는 컨텐츠 글을 옮긴다면 복사해서 붙여넣는 순간 글이 제대로 붙지 않으실 거에요.터넷에 있는 글들은 개발언어로 묶여서 싸여있기 때문에 벗겨서 다시 새 공간인 티스토리 블로그에 넣어주어야 하는데요. 한 번에 글을 붙여 넣기보다는 문단으로 잘라서 붙여넣기를 추천드립니다.

 

 이미지는 복사해 붙여넣기가 가능하기 때문에 이미지 복사해서 붙여넣어주시구요, 글 등은 메모장이나 인터넷 주소창을 이용하시면 편하게 넣으실 수 있습니다.

 

 

반응형

 

 

3. 스킨 편집하기 (스킨 편집 전체 화면)

스킨은 추후 업데이트 될 가능성도 있습니다. 본인 블로그와 맞는 타입을 잘 설정해 주세요.

다음은 스킨을 세팅합니다. 어려울 것 없이 기존에 제공된 무료 스킨중 반응형과 목록광고를 지원하는 영역 모두 확인 하신 후에 자신의 기존 블로그와 영역이 맞는 적절한 스킨을 선택해 주시면 돼요. 데스크톱에서 보여지는 화면과 모바일로 보여지는 화면이 적절한 환경으로 잘 보여지는지를 확인하시는게 중요합니다. 미리보기를 통해 블로그를 확인 해 주세요.

 

 

스킨 편집하기 (스킨 편집 전체 화면)

 

스킨 편집하기 (좌측 화면)

 

 

스킨 편집하기 (우측 화면)

 

 

 

4. 새창에서 크롬 브라우저 F12눌러 화면 테스트하기

모든 홈페이지들은 크롬브라우저에서 F12버튼을 눌러 개발자 모드로 전환 후 직접 html을 수정 및 테스트해볼 수 있습니다.

 TIP 

크롬 브라우저에서 F12버튼을 눌러 변경한 CSS내용은 티스토리에 적용되지는 않나요???

맞습니다. 구글 개발자 모드라고 해서 크롬 브라우저에서 개발자들을 위해 수치를 미리 변경해 적용해 볼 수 있는 하나의 도구 같은 영역입니다. 수치를 미리 적용 시켜보고 최종적으로 맞는 수치를 직접 스킨편집에 똑같이 넣어 유저 친화적인 PC와 모바일 스타일로 만들어 준다고 생각하시면 돼요

 

 

 

5. 티스토리 스킨편집에 CSS버튼 눌러 영역을 수정하기

! 우리는 이제 티스토리 스킨 편집으로 들어왔습니다. 티스토리 관리자 > 꾸미기 > 스킨편집에 들어가셔서 아까 1250번 빨간색 박스를 기억하라고 말씀드렸죠??

스킨편집 CSS버튼을 눌러 몇 번에 코드가 있는지를 알려주는 번호입니다. 그래서 1250번을 찾으면 똑같은 코드가 있을텐데 그 곳에서 크롬 브라우저에서 F12버튼을 눌러 자유자재로 실행했던

바꾸고 싶은 영역을 찾아 바꾸고 저장하면 됩니다. (만약을 대비해) 기존스킨은 꼭 저장해 두세요!

 

 

  TIP  바꾸고 싶은 영역이 나오지 않거나 값이 틀려요.

나타나지 않는 영역이라면  티스토리 자체의 수정할 수 없게 만든 값의 코드이기 때문에 유저가 수정할 수 있는 부분은 글을 쓰는 영역과 보이는 영역만 해당됩니다. 해당 번호에 맞는 이름이 없다면 수정이 되지 않는 걸로 쉽게 이해하시면 됩니다.

 

다음 포스팅에서는 꼭 수정하고 넘어가야 할 티스토리 스킨 편집부분에 대해서 알아볼게요

 

 

반응형