최근 한달간 사용하던 블로그 스킨을 갑자기 바꾸고 싶어, 몇몇 스킨들을 적용해보고 수정하다.. FastBoot 스킨으로 다시 돌아오면서 메인 홈화면만 티에디션으로 갤러리 형식처럼 변경하였는데, 이때 블로그 폰트도 나눔고딕에서 다른 폰트로 바꿀까 알아보다 이전에는 몰랐던 구글 한글 웹폰트들이 여러가지가 있어 소개해드립니다.
테스토로 적용 해본 <주아체 / 귀여운 폰트체>
■ 다양한 구글 한글 웹폰트
https://fonts.google.com/?subset=korean
지원하는 서체 종류는 크게 고딕체 / 명조체 / 손글씨 및 장식체가 있습니다.
자세하게는
검은고딕체, 고딕 A1체, 나눔고딕체, 나눔 고딕 코딩체, 나눔명조체, 감자꽃마을체, 개구쟁이체, 구기체, 귀여운 폰트체, 기랑해랑체, 나눔 손글씨 붓체, 나눔 손글씨 펜체, 대한민국독도체, 도현체, 독도체, 서툰이야기체, 송명체, 스타일리시체, 연성체, 주아체, 하이멜로디체, 해바라기체 등이 있으며 앞으로 계속 추가될 것 같습니다.
■ 아래는 블로그에 적용하는 방법입니다.
※ 스킨 보관을 꼭 먼저 하시고 변경하세요
▲ 사용하고자 하는 폰트 우측 상단 +(플러스) 버튼을 클릭합니다.
▲ 그러면 하단에 Family Selected 라고 나타나는데 이 부분을 클릭합니다.
▲ 빨간 박스 안에 표시된 <link href="https......생략..."> 이 부분을 복사해줍니다.
▲ 관리자 페이지 - 꾸미기 - 스킨 편집 - HTML 편집으로 들어가 HTML에서 <head> 아래 조금 전 복사한 것을 붙여 넣어주고 우측 상단 저장 버튼으로 저장해줍니다.
▲ 구글 한글 웹폰트로 돌아와 font-family 부분에 적힌 자신이 사용하고자 하는 폰트 이름을 따옴표부터 쉼표 부분까지 복사해줍니다.
▲ 관리자 페이지 - 꾸미기 - 스킨 편집 - HTML 편집으로 들어가 CSS에서 font-family 부분에 조금 전 복사한 폰트 이름을 붙여 넣어주고 우측 상단 저장 버튼으로 저장해줍니다. 자신의 블로그로 들어가 제대로 적용되었는지 확인하면 됩니다.
추가로 FastBoot 스킨 기준 사이드바 공지사항, 카테고리 등은 폰트가 변경되지 않는데, 이 부분도 적용하고 싶으면 해당 영역에도 위와 같이 폰트 이름을 넣어주면 됩니다. CSS에서 "돋움"으로 검색하면 사이드바 영역 부분이 몇 군데 나타나니 이곳에 넣어주면 됩니다. 참고하세요.
▲ 폰트를 여러 개 사용하고 싶을 때는 +(플러스) 버튼으로 폰트를 여러 개 선택하면 됩니다.
▲ 폰트를 다운로드하고 싶으시면 우측 상단 화살표가 아래로 표시된 버튼을 클릭하면 됩니다.
■ 아래는 감자꽃마을체를 적용해 모바일에서 봐본 모습입니다. (이미지 용량 압축을 해 다소 선명하지 않습니다.)
■ 한글 웹폰트 관련 글
[정보 & Tip/블로그] - Fastboot 스킨 나눔고딕 폰트 적용 (웹폰트 이용)
[정보 & Tip/무료폰트] - 명료한 숫자 모양과 가독성 좋은 스포카 한 산스 폰트
[정보 & Tip/블로그] - 이롭게 바탕체 웹폰트 적용하기
정보 & Tip/블로그 다른 글
블로그 인기 글블로그 최신 글