워드프레스 폰트 애플 산돌고딕으로 바꾸기

블로그에 네이버 [나눔고딕]이나 구글 [Noto Sans KR] 같은 유명 무료 폰트를 사용해 봤는데 개인적으론 별로였습니다. 그러다 가독성 좋은 아이폰이나 구글 검색 결과의 폰트가 [Apple SD 산돌고딕 Neo]인 것을 알게 됐고 블로그에 적용해 만족하고 있습니다. 이 포스팅에서는 워드프레스에 폰트를 적용하는 방법과 폰트의 두께에 따른 명칭을 정리했습니다.




애플 산돌고딕을 사용하는 이유?

  1. 무료 : 라이선스는 애플이 갖고 있지만, 상업적/비상업적인 용도 모두 무료로 사용할 수 있습니다.
  2. 둥글둥글한 느낌 : 개인적인 느낌입니다만 너무 각지지도, 너무 둥글지도 않아 가독성이 좋았습니다.
  3. 낮은 해상도에도 선명함 : PC 모니터는스마트폰이나 태블릿보다 해상도가 떨어지는데 그런 상황에서도 잘 보였습니다.
  4. Bold의 차이가 명확함 : 다른 폰트보다 두꺼울 때와 얇을 때의 차이가 명확하게 구분됩니다.
  5. 검증된 폰트 : 아이폰을 쓰거나 구글 검색 시 사용되는 폰트가 애플 산돌고딕입니다.



내장 폰트 vs 웹 폰트

내장 폰트는 사이트에 직접 ttf 같은 파일을 탑재하는 방법입니다. 이 방법은 폰트 파일을 업로드하는 번거로움이 있지만, 로딩이 짧아 사이트의 속도가 빨라집니다.

웹 폰트는 [Google Fonts] 같은 사이트에서 해당 폰트의 URL을 가져오는 방법입니다. 업로드가 필요 없어 편리하지만, 사이트에 없는 폰트는 사용할 수 없고, 페이지가 그려질 때마다 URL을 불러오기 때문에 속도가 느려집니다.

워드프레스 폰트 애플산돌 고딕으로 바꾸기 (1)
워드프레스 폰트 애플산돌 고딕으로 바꾸기 (2)




워드프레스 폰트 바꾸기

1. [Apple SD 산돌고딕 Neo] 파일을 다운로드하세요. 각 TTF 파일 이름의 의미는 아래와 같습니다.

단축어명칭CSS Weight
TThin100
UL, ELUltra Light200
LLight300
R, NRegular400
MMedium500
SBSemi Bold600
BBold700
EBExtra Bold800



2. 폰트를 적용하는 3가지 방법의 우선순위는 아래와 같습니다. 제가 사용하는 [Astra] 테마는 1순위 방법이 없기 때문에 2번째의 보조 플러그인을 사용해 폰트를 바꿉니다.

1순위 : 테마의 [사용자 정의하기]에서 폰트 변경
2순위 : 테마 개발사의 보조 플러그인 활용
3순위 : 범용 폰트 플러그인 활용

워드프레스 폰트 애플산돌 고딕으로 바꾸기 (3)



3. 폰트의 정보를 입력합니다. [1]은 폰트의 이름, [2]는 폰트의 두께, [3]은 폰트의 TTF 파일을 올리거나 URL을 입력합니다.

워드프레스 폰트 애플산돌 고딕으로 바꾸기 (4)



4. 하지만 TTF 파일을 올리면 아래 같은 오류가 나는데 이유는 워드프레스가 보안을 위해 특정 확장자만 업로드를 허용하기 때문입니다.

워드프레스 폰트 애플산돌 고딕으로 바꾸기 (5)



5. TTF나 다른 확장자의 업로드를 허용해 주는 플러그인 [WP Extra File Types]를 설치합니다.

워드프레스 폰트 애플산돌 고딕으로 바꾸기 (6)



6. [설정] > [Extra File Types]에서 TTF 확장자를 허용해 줍니다.

워드프레스 폰트 애플산돌 고딕으로 바꾸기 (7)



7. [테마] > [사용자 정의하기]에서 폰트 변경 시 추가한 애플 산돌고딕이 보여집니다.

워드프레스 폰트 애플산돌 고딕으로 바꾸기 (8)




참조 사이트

[폰트 두께 및 명칭]
폰트 종류, 굵기, 가족, 웨이트, 스타일 – 준폰트

[확장자 제한 확대 플러그인]
워드프레스 업로드 제한 파일… – 워드프레스 정보꾸러미


관련글

guest
0 Comments
Inline Feedbacks
모든 댓글 보기