워드프레스를 설치한 후, 테마와 레이아웃 설정을 완료했다면 이제 사이트의 가독성을 높이는 것이 중요합니다. 가독성이 떨어지는 사이트는 방문자의 이탈률을 높일 수 있으며, 이는 SEO에도 부정적인 영향을 미칠 수 있습니다. 따라서 폰트(글꼴) 설정을 최적화하여 독자가 편안하게 읽을 수 있도록 하는 것이 필수적입니다.
이 글에서는 워드프레스에서 기본 폰트를 변경하는 방법, CSS를 활용한 세부 설정, 플러그인을 이용한 손쉬운 폰트 관리 방법, 그리고 구글 폰트를 추가하는 방법까지 자세히 알아보겠습니다.
1. 테마 별 폰트 설정 메뉴 경로
워드프레스 테마마다 폰트 설정 메뉴의 위치가 다를 수 있습니다. 하지만 대부분의 테마에서는 [외모 - 사용자 정의하기]에서 글꼴 설정을 변경할 수 있습니다. 대표적인 테마별 경로를 정리해보면 다음과 같습니다.
- Generate Press: 외모 > 사용자 정의하기 > Typography
- Astra: 외모 > 사용자 정의하기 > 글로벌 > 글자
- Neve: Neve > 사용자 정의하기 > 글자
- Avada: Avada > 테마 옵션 > Typography
- Newspaper: News Paper > Theme panel > THEME FONTS
- Enfold: Enfold > General Styling > Fonts
- Twenty Twenty-Three: 기본 폰트 설정 없음 (CSS 코드로 설정 필요)
테마에 따라 메뉴의 위치는 다를 수 있으므로, 사용하는 테마의 문서를 참고하는 것이 좋습니다.
2. 워드프레스 폰트(글꼴) 추가 및 변경 방법
워드프레스에서 폰트를 변경하는 기본적인 방법은 [사용자 정의하기] 메뉴를 이용하는 것입니다.
2-1. 폰트 설정 위치
- 워드프레스 관리자 페이지에서 외모 > 사용자 정의하기로 이동합니다.
- Typography(타이포그래피) 메뉴를 클릭합니다.
- 변경하려는 요소(본문, 제목, 메뉴 등)를 선택하고 글꼴을 변경합니다.
- 설정을 저장하면 변경된 폰트가 적용됩니다.
2-2. 폰트 크기, 굵기, 행간, 자간 수정 방법
폰트를 수정할 때 아래 항목들을 조정할 수 있습니다.
- Font Family: 폰트 종류
- Font Weight: 굵기(두께)
- Font Style: 기울기(이탤릭체)
- Font Size: 크기(사이즈)
- Line Height: 행간(줄 간격)
- Letter Spacing: 자간(글자 간격)
- Paragraph Bottom Margin: 문단 아래 여백
각 설정을 조정하여 사용자에게 최적화된 가독성을 제공할 수 있습니다.
3. 폰트 리스트가 없는 경우
일부 테마에서는 초기 설치 시 폰트 리스트가 보이지 않을 수 있습니다. 이 경우 [Add Typography] 버튼을 눌러 원하는 항목을 추가하고 설정할 수 있습니다.
3-1. 폰트 적용 부위 용어 정리
- Body or P: 본문
- Site Title: 사이트 제목
- Primary Navigation: 헤더 메뉴
- H1~H6: 글 제목 및 부제목
- Widget Title: 사이드바 위젯 제목
- Button: 버튼 텍스트
각 영역별로 폰트를 개별 설정하면 더욱 깔끔한 사이트 디자인을 완성할 수 있습니다.
4. 폰트 추가하는 방법 (+구글 폰트)
구글 폰트를 활용하면 더욱 다양한 스타일의 글꼴을 적용할 수 있습니다. 다음은 구글 폰트를 추가하는 방법입니다.
4-1. 구글 폰트 사이트에서 폰트 확인하기
- Google Fonts 사이트에 접속합니다.
- 언어(Language) 항목을 Korean(한글)로 변경합니다.
- 원하는 폰트를 검색하여 선택합니다.
4-2. 구글 폰트 추가하는 방법
- Typography 메뉴 아래에서 [Add Font]를 클릭합니다.
- 입력란에 원하는 폰트명을 입력한 후 추가합니다.
- 설정을 저장하면 변경된 폰트가 사이트에 적용됩니다.
5. 구글 폰트 쉽게 추가 및 변경하는 방법 (+플러그인)
워드프레스에서는 플러그인을 활용해 손쉽게 구글 폰트를 적용할 수 있습니다. 대표적인 플러그인은 Fonts Plugin입니다.
5-1. Fonts Plugin 설치 및 활성화
- 플러그인 > 새로 추가에서 Fonts Plugin을 검색합니다.
- 설치 후 활성화를 클릭합니다.
- 새로운 메뉴에서 글꼴 사용자 지정을 클릭하여 설정을 진행합니다.
5-2. Fonts Plugin 주요 기능
- 기본 설정: 기본 글꼴, 제목 글꼴, 버튼 글꼴 등을 사이트 전체에서 한 번에 수정 가능
- 고급 설정: 제목, 메뉴, 내용, 사이드바, 바닥글 등 개별 요소에 글꼴을 설정 가능
설정을 완료하면 구글 폰트가 적용된 새로운 스타일의 사이트를 만들 수 있습니다.
6. 맺음말
이번 포스팅에서는 워드프레스에서 글꼴을 변경하는 다양한 방법을 살펴보았습니다. 기본 설정을 활용하는 방법부터 CSS 수정, 플러그인 활용까지 다양한 방법이 있으므로 본인의 사이트에 가장 적합한 방법을 선택하시길 바랍니다.
🔹폰트 설정 시 유의할 점
- 페이지 로딩 속도를 고려하여 1~2개 정도의 폰트를 사용하는 것이 좋습니다.
- 폰트 SWAP 설정 및 캐시 플러그인을 활용하여 로딩 속도를 최적화하세요.
워드프레스의 폰트 설정을 최적화하여 가독성을 높이고, 방문자의 만족도를 높이는 사이트를 운영해보세요! 😊
'IT' 카테고리의 다른 글
| 워드프레스 홈 페이지 만들기 및 설정 방법 (정적, 메인 페이지) (0) | 2025.02.03 |
|---|---|
| 워드프레스에서 한글 폰트 적용하는 3가지 방법 (폰트 업로드, 플러그인 활용) (0) | 2025.02.03 |
| 워드프레스 패턴(서식, 재사용 가능 블록) 만들기 및 사용 방법 (0) | 2025.02.03 |
| 워드프레스 블록 편집기 완벽 가이드: 초보자부터 전문가까지 (0) | 2025.02.03 |
| 워드프레스 고유주소 변경 방법 (문자 주소, 숫자 주소 장단점) (0) | 2025.02.03 |