티스토리 사이드바 글자 크기 폰트 수정하기

블로그를 관리하다가

문득 사이드바에서 상위폴더와 하위폴더가 구분이 안가는것을 느꼈다.

그래서 사이드바내의 상위폴더의 차이점을 주고싶었다.

 

다음을 통해서 수정하였다.

 

먼저 나의 블로그가 어떤 구조로 되어있는지 확인해야 했다.

다음처럼 sidebar라는 id값을 가지고 있었다.

이 sidebar는 상위 id값이다.

 

sidebar를 타고 들어가면 내가 바꿔주고자 하는 프로젝트라는 게 보였고,

link_item이라는 class로 감싸져 있었다.

약간 복잡해 보이지만 차근차근 타고 들어가면 다음과 같은 구조다

<div>sidebar --> <div>mCSB_1 --> <div>MCSB_1_container --> <div>widget category

--> <ul>tt_category --> <li> --> <ul>category_list --> <li> --> <a> link_item

혹시 몰라서 내가 찾은게 맞은지 확인하기 위해 다른 <li>태그도 확인해 보았다.

확인 해 보니 맞다.

 

구조가 확인해 되었으니 실질적으로 코드를 주입해 주어야 한다.

스킨편집 --> CSS 추가 클릭한다음 --> ctrl +F4 눌러서 sidebar를 검색하면 다음화면처럼 

#sidebar가 뜰것이다.

코드라인 64를 보게되면 위에서 우리가 타고들어간 경로를 .category> ul > li > ul > li > a 로 표현을 해준것이고

{  } 이 안에 폰트의 굵기를 설정해 주었다.

 

사이드바의 맨 상단인 dailycoding도 글자의 크기를 변환해 주고 싶었다.

알아보니 h1의 태그로 감싸져 있었고, 40px로 크기를 키워주었다.

 

결과적으로 다음처럼 수정된걸 확인할 수 있었다.