[웹폰트] 티스토리 블로그 나눔바른고딕 폰트 적용

하루에 적지않은 양의 글들(주로 웹페이지)을 읽게 되는데 이따금씩 글꼴의 중요성을 실감하게 됩니다. 

저는 글꼴 중에도 "나눔바른고딕"을 선호하는데요. 티스토리 블로그를 시작하면서 블로그 디폴트 폰트로 나눔바른고딕으로 설정했습니다.

웹폰트로 폰트를 적용시켰고, 적용시키는 법에 대해서 이설명하도록 하겠습니다 !

HTML / CSS를 모르는 초심자를 대상으로 쉽게 설명할 예정이니 이 글을 쭉 따라서 적용하시면 쉽게 적용하실 수 있을 겁니다.

왼쪽 중간쯤에 있는 HTML / CSS 편집을 들어가면

이렇게 HTML/ CSS을 편집할 수 있는 에디터를 보실 수 있습니다.

이제 여기서 몇 가지 코드를 적용을 시켜야 되는데요.

오른쪽 HTML 문서 파일에 </head> 부분이 있을겁니다. 그 바로 위에 아래에 코드를 집어 넣도록 하겠습니다.

저는 이쯤에 넣었습니다.

다음은 CSS 편집을 하도록 하겠습니다.

위에 있는 코드를 CSS 파일 최 상단에 넣어주도록 합니다

.

저는 상단 저부분에 임포트 시켜줬습니다 ㅎ

이제 나눔바른고딕 폰트를 사용할 준비가 끝났습니다. 이제 폰트를 적용시켜보도록 할게요.

css 편집기를 들어가보시면 저런 부분이 있을겁니다. 핵심은 body태그에 font-family 부분입니다 !

font-family란 어떤 폰트를 사용할지를 정해주는 태그인데요. 위의 예시처럼 "Nanum Barun Gothic"을 넣어줍니다.

이제 저장하고, 적용이 잘 되었는지 확인을 한번 해볼까요.

F12 크롬 개발자모드로 들어가서 확인한 결과 나눔바른고딕 폰트가 잘 적용이 되었음을 확인할 수 있습니다.

이 방법으로 다른 웹폰트도 동일하게 적용시킬 수 있습니다

티스토리와 관련된 또 다른 팁이 궁금하다면?

티스토리 검색엔진 최적화(SEO) 시키는 방법

티스토리 검색엔진 최적화(SEO) 시키는 방법

티스토리 애드센스 자동광고가 나오지 않을 때 해결방법

티스토리 애드센스 자동광고가 나오지 않을 때 해결방법

티스토리 highlight.js를 활용해서 코드 하이라이팅을 적용하는 방법

티스토리에 highlight.js를 활용하여 코드 하이라이트 추가하는 방법