워드프레스에서 한글 폰트 적용하는 3가지 방법 (폰트 업로드, 플러그인 활용)

워드프레스에서 한글 폰트를 사용자 정의하여 적용하는 방법에 대해 알아보겠습니다. 기본적으로 워드프레스 테마에서 제공하는 폰트나 구글 폰트만 사용이 가능하지만, 웹사이트 디자인의 통일성과 개성을 살리기 위해서는 추가적인 한글 폰트를 직접 적용해야 할 필요가 있습니다.

이 글에서는 웹폰트 IMPORT 방식, 플러그인을 활용한 방식, 그리고 테마에 직접 폰트를 업로드하는 방식까지 3가지 방법을 단계별로 소개하겠습니다. 또한, 각 방식에 따른 사이트 속도 변화까지 비교하여 최적의 방법을 선택하는 데 도움을 드리겠습니다.

---

📌 포스팅 개요

• 테스트 테마: GeneratePress
• 폰트 적용 방법
  • 웹 폰트 IMPORT 방식
  • Use Any Font 플러그인 활용
  • Rocket Font 플러그인 활용
• 포스팅 진행 순서
  1. 폰트 적용 방법 소개
  2. 각 방법별 폰트 적용 후 사이트 속도 비교

웹사이트 로딩 속도는 모바일 환경에서 더욱 중요한 요소이므로, 테스트 시 CSS 및 폰트 관련 성능 옵션을 모두 비활성화한 후 진행하였습니다.

---

1️⃣ 웹 폰트 적용 방법 (나눔 고딕 폰트)

🔹 나눔고딕 폰트 IMPORT 방식 적용하기

웹폰트 IMPORT 방식은 외부 사이트에서 폰트를 불러와 적용하는 방법으로, 사용이 간편하다는 장점이 있지만, 로딩 속도에 영향을 줄 수 있다는 단점도 있습니다.

1. 무료 폰트 사이트 눈누 방문
2. 원하는 한글 폰트를 검색 후, "웹폰트로 사용" 버튼 클릭
3. 제공되는 @import 코드를 복사하여 적용

✅ CSS에 폰트 적용하기

1. 워드프레스 관리 페이지 접속 → [외모] → [사용자 정의하기] 이동
2. [추가 CSS] 메뉴 클릭 후, 아래 코드 추가

@import url(//fonts.googleapis.com/earlyaccess/nanumgothic.css);

.nanumgothic * {
    font-family: 'Nanum Gothic', sans-serif;
}

폰트 적용할 범위를 추가로 지정하고 싶다면 다음과 같이 설정할 수도 있습니다.

body, h1, h2, h3, h4, h5, h6, p, button {
    font-family: 'Nanum Gothic' !important;
}

📊 웹 폰트 적용 후 사이트 속도 비교

웹 폰트 방식은 외부 사이트에서 폰트를 불러오는 과정이 포함되기 때문에 사이트 속도가 다소 느려질 수 있습니다. 특히 모바일 환경에서 로딩 속도의 차이가 발생할 수 있으므로, 속도 개선이 필요한 경우 플러그인 방식도 고려해보는 것이 좋습니다.

---

2️⃣ 워드프레스 한글 폰트 업로드 플러그인 활용

웹 폰트 방식이 로딩 속도에 부담이 될 경우, 플러그인을 사용하여 폰트를 직접 업로드하는 방법을 고려해볼 수 있습니다. 가장 많이 사용되는 플러그인 중 하나가 Use Any Font입니다.

🔹 Use Any Font 플러그인 적용 방법

1. 워드프레스 관리자 페이지 이동 → [플러그인] → [새로 추가] → "Use Any Font" 검색 후 설치 및 활성화
2. 좌측 메뉴에서 Use Any Font 클릭
3. API Key 생성 후 "Verify" 버튼 클릭하여 인증 완료
4. "Upload Font" 탭에서 폰트 파일을 업로드한 후 적용

📌 적용할 폰트와 적용 범위 선택 → "Assign Font" 탭에서 원하는 태그(h1, h2, p 등)를 선택하여 적용 가능

📊 Use Any Font 적용 후 사이트 로딩 속도 비교

• 장점: 폰트를 직접 업로드하여 사용하므로, 외부 사이트에서 불러오는 과정이 없어 속도가 개선됨
• 단점: API Key를 생성해야 하고, 폰트 파일을 직접 업로드해야 하는 번거로움이 있음

---

3️⃣ 워드프레스 한글 폰트 내장 플러그인 활용 (Rocket Font)

Rocket Font는 한국인이 개발한 한글 폰트 플러그인으로, 자체 내장된 폰트를 활용하여 폰트를 변경할 수 있습니다.

🔹 Rocket Font 플러그인 적용 방법

1. [플러그인] → [새로 추가] → "Rocket Font" 검색 후 설치 및 활성화
2. 활성화 후 설정 → "로켓 폰트" 메뉴 이동
3. 드롭다운 메뉴에서 원하는 폰트 선택 → "저장" 버튼 클릭
4. "각 태그 별 크기 및 글 간격 설정"에서 크기, 색상, 간격 등 조절 가능

📌 지원 폰트 목록

• 나눔 고딕, 나눔 바른고딕, 나눔 붓글씨
• 제주 고딕, 제주 명조, 제주 한라산
• Ko Pub 바탕, 노토 산스, 스포카 한 산스 등

📊 Rocket Font 비동기 호출 적용 전, 후 속도 비교

Rocket Font는 비동기 호출(Async Load) 기능을 제공하여 사이트 로딩 속도를 최적화할 수 있습니다.

• 비동기 호출 설정 방법: 설정 페이지에서 "속도(Beta)" 항목으로 이동 → "비동기 호출 사용" 활성화
• 비동기 호출 후 속도 변화: 폰트가 웹사이트 로딩 완료 후 불러와지므로, 초기 페이지 렌더링 속도가 개선됨

---

🎯 마무리: 한글 폰트 적용 방법 비교 및 추천

방법 장점 단점

웹 폰트 IMPORT 방식	간편한 설정, 빠른 적용	외부 사이트에서 폰트를 불러오기 때문에 속도 저하 가능
Use Any Font 플러그인	직접 업로드 가능, 속도 개선	API Key 필요, 설정 과정이 다소 번거로움
Rocket Font 플러그인	한글 폰트 내장, 간편한 설정	제공되는 폰트만 사용 가능, 업데이트 중단 가능성

👉 추천 방법:

• 사이트 속도를 고려할 경우, Rocket Font 플러그인(비동기 호출 설정) 또는 Use Any Font 플러그인 사용을 권장합니다.
• 설정이 간단한 방법을 원한다면 Rocket Font 플러그인이 가장 쉬운 대안이 될 수 있습니다.
• 웹 폰트를 자유롭게 활용하고 싶다면 웹 폰트 IMPORT 방식도 괜찮은 선택이 될 수 있습니다.

워드프레스 사이트에 맞는 최적의 한글 폰트 적용 방법을 선택하여, 보다 아름답고 최적화된 웹사이트를 구축해 보세요! 🚀