티스토리 서식보다 편하게 소제목 꾸미기

요즘 서식으로 티스토리 소제목 꾸미기에 댓글을 다시는 분들이 있어 

제가 처음 티스토리 시작할 때 다른 분들 소제목보고 궁금했던 생각이 들었습니다.

 

최근에 댓글로 서식을 수정하고 싶다는 분이 계셔서

생각해 보니 저는 요즘 서식을 사용하고 있지 않습니다.

 

간단하게 제목변경으로 설정하고 있습니다.

제목

한번 설정할때는 번거럽지만 한번 해 놓고 나면 아주 편해서 알려드리고 싶습니다. 스킨편집이 어렵다고 생각되시면 기존 서식 사용방법을 추천해드리고 스킨편집을 한번이라도 해 보신 분이 이 방법을 써 보셨으면 합니다.

티스토리 서식으로 소제목 꾸미기

제목의 변화를 주고 싶으면 적용하시면 좋을 듯 합니다.

 

스킨 보관

html편집을 해야하기 때문에 잘못하면 스킨을 갈아야하는 위험이 생기기 때문에 잘못했을 때를 대비해서 스킨을 보관해야 합니다.

블로그 관리-꾸미기-스킨변경을 선택합니다.

스킨보관

사용중인 스킨에 보관을 클릭합니다. 이름을 적당히 적고 확인을 클릭하고 바로 아래의 스킨 보관함에 보시면 지금 저장한 이름으로 스킨이 보관되어 있습니다.

혹시 잘못되면 이 스킨을 다시 등록하면 지금 상태로 돌아오기 때문에 꼭 이 과정을 해 주세요.

 

제목의 css 찾기

제목 2를 설정하기 때문에 제목2를 표현해 주는 css를 찾아야 합니다.

블로그 관리-꾸미기-스킨편집을 선택합니다.

편집

오른쪽 위에 사용 스킨이 보이고 아래에 있는 html편집을 클릭합니다.

 

나온 html의 아무곳이나 클릭후 ctrl-F를 누릅니다.

htlm에서 단어찾기

검색이라고 나오는 옆에 

article_rep_desc

를 입력하고 엔터를 누릅니다. 

저도 제대로 배운게 아니고 경험으로 찾는 것이라 정확한 의미는 모르지만 소제목과 관련이 있는 것 같습니다. 

소제목

소제목을 표현해 주는 방식이 바로 위의 class로 ""속의 entrry-content인 것 같습니다.

 

css 수정

앞에서 소제목의 class를 찾았으니 이번에는 위의 빨갛게 표시해 놓은 HTML 옆의 CSS를 클릭합니다. 역시 CSS에서도 ctrl-F를 눌러 노란창이 뜨면 검색 옆에 entry-content를 입력합니다.

css 편집

주로 소제목 하나만 사용하기 때문에 제목2에만 설정해 줍니다.

제목2는 .entry-content h3입니다.

{}속 아래 부분에 다음 코드를 입력합니다.

 

border-style: solid;
border-width : 0px  0px  1px 15px; 
border-color: #757575; 

background-color: #fff; 
padding: 7px; 

 

이 부분을 txt 파일로 첨부합니다.

소제목코드.txt

0.00MB

 

코드 추가

이렇게 입력하면 오른쪽 위의 "적용"이 까맣게 변해 있습니다. 적용을 눌러줍니다.

 

글쓰기

글쓰기로 들어가서 그냥 글을 적습니다.

소제목부분을 블럭지정하고 제목2를 설정합니다. 에디터에서는 글자만 조금 커지고 변화가 없습니다. 발행을 눌러 비교해 보겠습니다.

소제목 꾸미기

설정없는 글자와 서직으로 불러와서 제목을 다시 쓴 것과 블럭지정해서 제목설정만 해준 것입니다.

티스토리의 몇개 스킨을 비교해 보니 이런 방법으로 가능하네요.

 

이전의 글에서 만든 서식1도 같은 방법으로 적용해도 되고 소제목에 다양한 변화를 주어 좀 더 보기 편한 글로 만들 수 있습니다.