JB SKIN-폰트크기 16pt 초과 크기로 설정 방법
- bLOG/JB SKIN 167 조정
- 2018. 10. 1.
몇 일전에 많다면 많고 적다면 적은 5만원을 써서 티스토리 유료 스킨인 JB SKIN 167을 구매 했다. 깔끔하고 아무래도 구글 애드센스를 잘 이해하고 있는 것으로 보여 좋았다. 기존에 쓰던 스킨은 무료 스킨인 FASTBOOT 1.6.2로 그것도 좋았지만 그냥 분위기 전환상 바꿔 보았다. 일단은 우려했던 방문자 수는 급감하지 않았고, 기존과 비슷하게 찾아 왔다. (워낙에 방문자 수가 적어서 그럴 수도 있다.)
스킨을 바꾼 후 이것저것 배우면서 만지다가 폰트 크기를 일괄로 변경하려는데 아뿔싸~ 운영자님 공지에는 16pt까지만 바꿀수 있다고 나와 있었다.
티스토리에 글을 쓰다 보니 마음에 딱 드는 폰트 크기는 17pt인데, 처음 보는 스킨에 그것도 티스토리 블로그에서 폰트 크기에 한계가 있다고 하니 살짝 멘붕이 오려 했지만 열심히 찾고 또 찾아서 16pt를 초과하는 폰트 크기로 일괄 변경하는 방법을 알아 냈다. 나도 HTML 루져인데 바꿨다. 어렵지 않으니 꼭 따라 오시길 바란다.
※JB SKIN 폰트 크기 17pt 이상으로 적용하는 방법
1. 티스토리의 HTML 수정으로 들어 가서 가운데 있는 CSS를 클릭한다.
2. ctrl+F (찾기)를 누르고
위의 사진과 같이 검색어에
font size 16
이라고 엔터를 친다.
3. 그러면 아래와 같은 구문이 나온다.
/* Font Size 14 */ /* Font Size 15 */ .jb-font-size-15 body { font-size: 15px; } /* Font Size 16 */ .jb-font-size-16 body { font-size: 16px; } /* Typography - Heading Type 01 */ /* Typography - Heading Type 02 */ |
4. 그럼 우리가 해 줄 일은 뭐?다?
/* Font Size 16 */
.jb-font-size-16 body { font-size: 16px; }
위의 두 줄을 복사해서 아래에 붙여 넣고
/* Font Size 17 */
.jb-font-size-17 body { font-size: 17px; }
이런 식으로 변경해서 붙여 나가기를 해 나가는 것이다. 20pt까지 만들면 아래와 같은 HTML이 만들어 진다.
/* Font Size 14 */ /* Font Size 15 */ .jb-font-size-15 body { font-size: 15px; } /* Font Size 16 */ .jb-font-size-16 body { font-size: 16px; } /* Font Size 17 */ .jb-font-size-17 body { font-size: 17px; } /* Font Size 18 */ .jb-font-size-18 body { font-size: 18px; } /* Font Size 19 */ .jb-font-size-19 body { font-size: 19px; } /* Font Size 20 */ .jb-font-size-20 body { font-size: 20px; } /* Typography - Heading Type 01 */ /* Typography - Heading Type 02 */ |
직접치기 힘들면 아래의 코드 중 추가된 빨간색만 복사해서 붙여 넣어주면 된다.
빨간색 부분이 CSS에 새로 추가한 코딩이다. 이제 16pt를 초과하는 일괄변경 폰트크기 만들기 준비는 끝이 났다.
HTML편집으로 넘어 가면 아래와 같이
19번째 줄에 jb-font-size-16이라는 코딩이 있는데요. 숫자가 폰트 크기 이다. 방금전에 20pt까지 만들었으니까 숫자를 바꾸면 영자님이 밝힌 16pt 한계를 넘는 글자 크기가 생겨 난거다. 글자 크기 변경까지 사진을 넣어서 보여 주면 복잡하니까 16pt부터 20pt까지의 크기 변화를 gif로 올리면서 글을 마치겠드아.
좋은 스킨 더 좋게 쓸 수 있는 방법들을 알게 되면 계속 글을 쓰도록 하겠다.
감기 조심!
