티스토리 HTML 코드 수정하는법

티스토리 메뉴 설명 가이드가 벌써 중반정도 온 것같습니다. 저번 포스팅까지 콘텐츠 메뉴 활용하는 법과 댓글, 방명록 효과적으로 관리하는 법, 통계 분석하는 법, 스킨 변경하는 법에 대해서 소개를 해드렸는데요.

이번 포스팅에서는 티스토리 꾸미기 메뉴의 꽃이라고 할 수 있는 HTML/CSS 편집 부분입니다. HTML/CSS 코드에 대해서 설명드리기에는 분량도 방대하고, 저 또한 많이 아는 것이 없기때문에 티스토리 블로그 내에서 HTML 코드 편집을 하는 법에 대해서 설명드리겠습니다.

티스토리 HTML

▼관련포스팅

코드 수정만으로 티스토리 최적화 만들기

티스토리가 다른 블로그보다 나은점

티스토리 블로그 유용한 단축키 모음

HTML/CSS 편집을 위해서는 꾸미기 메뉴의 스킨 편집 메뉴를 선택해주시면 됩니다. 메인화면에서 설정화면으로 가는 방법은 메인화면에서 키보드 [Q] 를 누르시면 토글형식으로 메인화면과 설정화면을 왔다갔다하실 수가 있습니다. 아마 티스토리 단축키 중에서 가장 많이 쓰는 단축키가 아닐까 싶습니다.

스킨 편집 메뉴를 선택하시면 위 이미지와 같은 화면을 만나실 수 있습니다. 예전에는 바로 HTML편집 모드로 들어갔었지만, 티스토리 메뉴 개편 이후에는 한가지 기능이 더 추가되었습니다. 이곳에서 홈 화면 꾸미기인 티에디션까지 설정하실 수가 있습니다.

티에디션은 반응형 스킨을 쓰시는 분들은 잘 사용하지 않는 메뉴이긴 합니다. 그렇지만 스킨들이 채워주지 못하는 2%를 티에디션을 이용해 보충할 수가 있습니다. 또한 저처럼 HTML코드에 대해서 잘 모르시는 분들이라면 메인 화면을 티에디션으로 꾸미시는 것도 훨씬 보기 좋게 꾸밀 수가 있습니다.

이 화면에서는 홈 화면 글 수, 글 목록 글 수, 글 목록 형태 등등의 글 기본 설정에 대한 부분도 선택해줄수 있습니다.

HTML소스편집을 위해서는 오른쪽 위의 빨간 박스 안의 HTML편집 버튼을 눌러주시면 됩니다.

HTML코드를 편집, 수정한 내 블로그 화면이 어떻게 보여지는지 왼쪽 화면에 직관적으로 바로바로 확인하실 수가 있습니다. 디스플레이 또한 다양하게 제공하고 있어서 PC화면, 태블릿 화면, 모바일 화면에서 어떻게 보여지는지 각각 확인하실 수가 있습니다.

HTML편집을 누르셔서 들어갈 수 있는 HTML편집 화면입니다. 영어로 솰라솰라 많이 써있습니다. 이곳에서 HTML코드와 CSS를 내 입맛에 맞게 편집하실 수가 있습니다. HTML코드가 기본적인 뼈대라고 한다면, CSS는 디자인이라고 생각하시면 됩니다.

네이버 웹마스터 도구의 소유자 확인 코드 삽입과 애드센스 코드 삽입같은 간단한 편집부터 블로그가 검색 포털사이트에 이쁨을 받을 수 있는 전반적인 설정까지 HTML편집창에서 모두 가능합니다.

HTML코드를 수정, 편집하실 경우에는 꼭!! 꼭!!! 백업을 해두신 후 작업을 하시길 권장합니다. 백업은 간단하게 스킨 변경 메뉴에서 스킨 보관이나 스킨 다운로드를 이용하시면 됩니다.

▲

유익하셨다면 링크를 추가해주세요

공감 버튼은 로그인이 필요없습니다.

저에게 큰 힘이 됩니다.

▼이전포스팅

티스토리 콘텐츠 메뉴 살펴보기

블로그 댓글, 방명록 관리하기

티스토리 통계 분석하는 방법

꾸미기 메뉴 파헤치기

티스토리 스킨 변경 및 추천