쏘야의 소소한 이야기 :)


티스토리 블로그 머리말 적용및 색상변경방법

 (색상코드 확인방법)

 

안녕하세요 쏘야입니다 :)

티스토리를 운영하면서 수익을 위한 블로그의 시작은 아니였지만

방문자들이 블로그를 통해 유용한 정보를

얻어 갈 수 있는 것이 블로그 운영자들에게는

 가장 큰 힘이 될 것입니다. 

그렇게 블로그 운영자들에게 중요시 생각되는 것은

 아무래도 방문자 수 일텐데요.

 

방문자 수와 직결되는 것은 당연 가독성 이라 할 수 있습니다.

가독성을 높히기 위해 추천할 만한 방법은 티스토리 머리말을

적용하는 부분이며, 강조하고 싶은 키워드를 두드러지게 나타낼 수 있고, 여러 검색엔진에서 키워드 검색시 제목다음으로 노출 될 수 있기때문에

더욱 잘 띄우기 위한 방법에 속하기도 하며, 티스토리는 통해 글을 쓰다보면

독자들을 위해 조금 더 깔끔하고 정리된 느낌을

들게할 수 있어 머리말을 활용하기도 합니다.


블로그 머리말 적용 방법을 배우기 전에

티스토리 블로그 글쓰기창이 변경되었습니다.

해당 내용은 옛날방식의 편집창을 사용하는 방법으로 설명드리려고 합니다.

편집창을 바꾸는 방법을 모르시는 분들을 위해 하단의 링크보시고

편칩창 변경 먼저 하시고 보시면 이해가 편하실 것 같습니다.

 

2019/08/08 - 티스토리 블로그 글쓰기화면 변경 (장단점)

 

 

그럼 지금부터 머리말 적용 방법 및 색상 변경방법에 대해 알려드리도록 하겠습니다^^

 

블로그 머리말 적용방법

 

티스토리 글쓰기를 눌러 들어가면 상단에 글쓰기 메뉴에서 머리말의 설정이 가능합니다.

티스토리 [글쓰기 화면] 으로 이동합니다.

글을 쓰고나서 머리말을 적용하고 싶은 부분의 글을 [드래그] 합니다.

좌측상단에 "본문"부분을 클릭하면 머리말 1~4까지 나오는데

여기서 원하는 크기의 머리말을 선택하여 적용시켜줍니다.

 

 

저는 여러가지 크기의 머리말을 사용하지 않아

머리말 크기조정을 해놓고 머리말 1번으로 통일해서 한가지만 사용하고 있습니다.

 

머리말 수정방법 (크기,색상 변경방법)

 

기존의 머리말을 적용하여 미리보기를 해보면 다음과 같이 머리말이 적용이됩니다.

 

 

이것이 현재 상태의 머리말 효과인데

조금더 눈에 잘들어오고 이쁜 글을 쓰기 위해서

이 머리말을 꾸며주는 방법을 알려드리도록 하겠습니다.


티스토리 [관리자 모드]로 들어갑니다.

 

 

좌측 하단으로 내려가다보면 [스킨편집]을 클릭합니다.

 

 


클릭을하면 우측에 [HTML편집]이 나오는데 클릭합니다.

 

 


그럼 HTML과 CSS 두가지 탭이나오는데 우리는 [CSS]탭에서 수정을 해줄거에요~!

Ctrl+F 를 사용해서 " .article h1 " 을 타이핑해 엔터를 눌러주어 검색을 합니다.

 

 

각자의 티스토리 스킨에 따라서 위치는 조금씩 다릅니다.

여기서 "빨간부분과 파란부분" 을 수정을 해줍니다.

 

 

- 빨강색 " border-bottom " - 머리말 밑줄 두께와 컬러

- 파란색 " border-left " - 머리말 왼쪽 직선으로 되어있는 사각형의 두께와 컬러

- 두께변경- "숫자 px" 부분의 숫자부분을 수정

- 컬러변경- "#555" 부분을 수정

 

컬러 코드 확인방법

 

원하는 컬러의 코드를 쉽게 찾는 방법을 알려드리도록 하겠습니다.

티스토리 글쓰기 화면에서 클씨 컬러를 변경하는 부분을 클릭해준다음

원하는 컬러는 선택하면 컬러 코드가 나옵니다.

 

 

표시된 코드를 복사하여 아까 배웠던 css 수정 부분에 넣어준뒤

수정하시면 다음과같이 색상이 변하는 것을 확인하실 수 있습니다.

 

 


어렵지않게 이쁜 머리말을 만들 수 있습니다.

 

2019/08/01 - 블로그 망설이지마세요. 시작하세요

2019/08/05 - 네이버 웹 마스터 등록방법

2019/08/08 - 티스토리 블로그 글쓰기화면 변경 (장단점)

2019/08/09 - 글쓰기 서식 만들기

2019/08/14 - 구글 웹마스터 등록방법

2019/08/16 - 티스토리 블로그 이전 글(관련 글, 링크) 삽입하기

 

TOP