본문 바로가기
디지털마케팅

[티스토리] 블로그 폰트 적용 방법

by 퍼포먼스마케팅코더 2022. 8. 15.
반응형

티스토리 블로그 폰트 적용 방법

오늘은 티스토리 분들에게 브로폰트를 적용하는 방법에 대해 이야기해보도록 하겠습니다. 제가 사용하고 있는 이 티스토리의 스킨이 북클럽이라는 스킨을 사용하고 있습니다. 이 스킨을 기준으로 여러 블로그를 탐독받았는데 좋네요. 깨끗해지고 있습니다. 전에 제가 했던 거는 작업바도 추가해놨으니까 밑에 거의 css라고 보시면 돼요. 

 

css 중에 추가해야 할 것, 그걸 넣어서 했거든요. 예를 들어서 아까 제가 말씀드린 대로 북스킨 있잖아요. 북스킨 테마를 씌워놓고 다음에 아래와 같이 내용을 html 편집안에 들어가서 css 밑에 내용을 이렇게 복사 붙여넣기로 넣어두시면 됩니다. 깨끗해지고 있습니다. 특별한 내용은 없습니다.그냥 이것만 추가해 놓으시면 됩니다. 제 티스토리를 방문해 보시면 아시겠지만 그런 형식으로 깔끔하고 예쁘게 바꾼다고 보시면 됩니다. 제가 만들어놓은 티스토리는 다 넣어놨거든요. 좋았어요. 이걸로 많이 참고가 됐으면 좋겠어요.

 

/* Web Font Load */ 해당 란에 밑에 내용 넣기(폰트는 지마켓 산스)

@font-face {
    font-family: 'GmarketSansLight';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansLight.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'GmarketSansMedium';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
<!------ 해당 공란에 font-family 추가>
/* Type Selector Reset */

font-family: 'GmarketSansMedium' 

<!------ 해당 공란에 font-family 추가>
#header h1  

font-family: 'GmarketSansMedium'; 

<!------ 해당 공란에 font-family 추가>

.list-type-thumbnail .post-item .title

font-family: 'GmarketSansMedium';
반응형

댓글