티스토리 글쓰기 시 제목 1 제목 2 CSS 편집으로 이쁘게 디자인하기

티스토리 블로그의 글쓰기에서 제목 1, 제목 2, 제목 3에 대한 디자인을 CSS 편집으로 통해 이쁘게 바꿀 수 있습니다. 초보자의 경우 글쓰기의 HTML에 코드를 삽입해서 이를 지정하는 분들이 많은데, 이렇게 지정하면 구글에서 문제가 있다고 판단하며, 크롤러 오류를 띄우는 경우도 종종 발생하게 됩니다. 그러므로, HTML이 아닌 CSS에서 값을 변경해주시는게 이를 방지할 수 있습니다.

 

 

티스토리 제목 1, 제목 2 부분 이해하기 (CSS 편집)

제목의 경우 h1, 제목 1의 경우 h2, 제목 2의 경우 h3, 제목 3의 경우 h4로 일반적으로 지정되어 있어, 이에 맞게 끔 출력되게 되어 있습니다. CSS에서 .post-content h1 혹은 .entry-content h1로 이 부분이 코딩되어 있는데 이 부분을 변경해주시면 글쓰기 화면에서 출력되는 값들이 바뀌게 됩니다.

 

단, 이미 HTML에 코딩을 넣어버렸다면 이에 대한 부분은 글쓰기의 HTML 부분이 후발 주자로 읽히기 때문에 CSS 편집을 한다고 바뀌지 않게 됩니다.

 

 

티스토리 제목 1, 제목 2 부분 이쁘게 설정하기 (CSS 편집) - entry의 경우

CSS 편집을 하고 상황에 맞는 값으로 변경해주어야 하며 스킨마다 이 부분이 다르게 지정되어 있어 응용을 하셔서 변경하셔야 합니다.

 

티스토리 CSS 이쁘기 바꾸기 - entry의 경우.txt

0.00MB

 

 

 

1. 티스토리 관리자 > 꾸미기 > 스킨 편집 > CSS로 이동합니다.
2. Ctrl + F를 눌러 ".post-content h1 혹은 .entry-content h1"를 검색합니다.
3. 이 영역을 아래와 같이 바꿔주시면 됩니다. 아래는 .entry-content의 경우입니다.
4. .entry-content h1 ~ .entry-content h4까지 값을 바꿔주시면 됩니다.
5. 글로 변경 → 새로고침하여 변경됐는지 확인합니다.
6. 이상이 없으면 적용을 눌러줍니다.

 

 

.entry-content

 

 

티스토리 제목 1, 제목 2 부분 변경 후 견본

각 스킨마다 CSS의 코드가 다르기 때문에 새로고침을 통해 확인을 하셔야 합니다. 응용해서 이 부분은 바꿔주셔야 합니다.

 

• 디자인 : Copyright © 잡다한지식 고어웨이 All rights reserved.
• 특징 : 제목 1의 경우 가운데 설정이 되어 조금 더 눈에 띌 수 있도록 만들었습니다.

 

 

티스토리 제목 1, 제목 2 부분 변경 후 견본