워드프레스에 구글 웹폰트 (나눔 고딕) 적용하기

1. 구글 폰트에서 폰트 고르기

Google Fonts 에 들어가 마음에 드는 폰트를 고르자.

난 네이버의 Nanum Gothic (나눔 고딕)을 선택.

선택 전, 영문과 한글로 글을 작성해보고

폰트 사이즈 조절과 Regular, Bold, Extra-Bold 등의 옵션을 넣었을 때의 

폰트 느낌을 미리 확인하면 좋다.

 

2. Easy Google Fonts 플러그인 설치

구글 웹폰트를 워드프레스 css에 간단하게 입력할 수도 있지만,

Easy Google Fonts 플러그인을 통해 구글 웹폰트를

내 입맛에 맞게 다양하게 수정할 수 있다.     편하다.

설치 후 설정 -> Google Fonts -> Advanced 에서 Google Fonts API Key 를 입력 후

(Google Fonts API Key가 없다면, 여기서 발급)

Edit Font Controls 메뉴에서 원하는 이름으로 Control 을 생성하자.

 

 

3. 세팅

외모 -> 사용자 정의하기로 들어가면

‘Typography’ 메뉴가 추가된걸 확인할 수 있다.

클릭하면 ‘Default Typography’ 와 ‘Theme Typography’ 메뉴 2개가 있고

각 메뉴를 선택해 원하는 폰트와 스타일을 설정할 수 있다.

 

 

‘Default Typography’를 선택하면 하위 메뉴로 넘어가는데

‘Paragraphs’ 를 포함해 Heading 1 ~ 6 까지의 폰트를 직접 설정 할 수 있다.

내 기준에서,

일반 폰트 (메인을 비롯한 각 페이지에서 보여지는) 를 설정할 수 있는

‘Paragraphs’ 의 Styles 메뉴에서 ‘Font Family’ 를  Nanum Gothic 으로 선택 후

 

 

‘Appearance’ 에서 폰트 사이즈만 12px로 설정했는데

개인취향에 따라 폰트 컬러, BG 컬러, Margin, Padding, Border 등 다양한 세팅을 할 수 있다.

 

 

‘Theme Typography’ 에서는 아까 생성한 Control 이 자동 선택되어 있고,

‘Paragraphs’ 의 Styles 메뉴에서 ‘Font Family’ 를  Nanum Gothic 으로 선택 후

별도의 설정은 하지 않았다.

Total
6
Shares
답글 남기기

이메일 주소는 공개되지 않습니다. 필수 필드는 *로 표시됩니다

Previous Post

아마존 AWS 라이트 세일 이용시 참고 할 것들

Next Post

08.13 끄적, TMI

Related Posts