블로그를 운영하다 보면 제목이 너무 작아 보이거나, 본문 글씨가 읽기 불편하다는 생각이 들 때가 있습니다. 특히 WordPress를 처음 사용하는 분들은 글자 크기를 어디서 어떻게 조절하는지 몰라 답답해하시는 경우가 많죠. 오늘은 WordPress에서 제목과 본문의 글자 크기를 조절하는 실질적인 방법들을 단계별로 알려드리겠습니다.
[ 목차 ]
1. 블록 에디터에서 글자 크기 바로 조절하기
WordPress 5.0 버전 이후부터 기본 에디터로 사용되는 구텐베르크 블록 에디터는 직관적인 글자 크기 조절 기능을 제공합니다.
본문 텍스트의 크기를 변경하고 싶다면, 해당 단락 블록을 선택한 후 우측 사이드바의 '블록' 탭을 확인하세요.
'타이포그래피' 섹션에서 '크기' 옵션을 찾을 수 있습니다. 여기서 Small, Medium, Large 등 미리 설정된 크기를 선택하거나, 직접 픽셀(px) 단위로 원하는 크기를 입력할 수 있습니다.
제목 블록의 경우도 동일한 방식으로 작동합니다. H1, H2, H3 등 제목 블록을 클릭하면 우측 패널에서 글자 크기를 자유롭게 조정할 수 있죠. 일반적으로 H1은 32px 이상, H2는 28px 전후, H3는 24px 정도로 설정하는 것이 가독성 측면에서 적절합니다.
2. 테마 커스터마이저로 전체 기본 크기 설정하기
개별 글마다 크기를 조절하는 것이 번거롭다면, 테마 커스터마이저를 활용해 사이트 전체의 기본 글자 크기를 설정할 수 있습니다.
WordPress 관리자 화면에서 '외모' > '사용자 정의하기'로 들어가면 테마 커스터마이저가 열립니다.
사용 중인 테마에 따라 메뉴 구성은 다르지만, 대부분 'Typography', '타이포그래피', 또는 '글꼴 설정' 같은 항목이 있습니다. 여기서 제목과 본문의 기본 글자 크기를 일괄적으로 지정할 수 있죠.
Twenty Twenty-Three 같은 최신 블록 테마에서는 '스타일' 메뉴에서 '타이포그래피' 옵션을 찾을 수 있습니다. 여기서 텍스트, 링크, 제목 등 각 요소별로 글자 크기를 세밀하게 조정 가능합니다. 변경 사항은 실시간으로 미리 보기에 반영되므로, 원하는 느낌이 나올 때까지 조절하면 됩니다.
3. CSS 코드로 정밀하게 커스터마이징하기
좀 더 세밀한 제어가 필요하거나 테마에서 제공하지 않는 옵션을 원한다면, 추가 CSS를 사용하는 방법이 있습니다.
'외모' > '사용자 정의하기' > '추가 CSS' 메뉴로 들어가서 직접 스타일 코드를 입력할 수 있습니다. 예를 들어 본문 글자 크기를 18px로 설정하려면 다음과 같이 작성합니다:
body {
font-size: 18px;
}
```
제목 크기를 조절하고 싶다면:
```
h1 { font-size: 36px; }
h2 { font-size: 30px; }
h3 { font-size: 24px; }
```
이런 식으로 각 제목 레벨별로 원하는 크기를 지정할 수 있습니다. 특정 클래스나 ID를 가진 요소만 선택적으로 크기를 변경하는 것도 가능합니다. CSS에 익숙하지 않다면, 개발자 도구(F12)를 열어 해당 요소의 클래스명을 확인한 후 코드를 작성하면 됩니다.
## 플러그인으로 간편하게 관리하기
코드 작성이 부담스럽다면, 글자 크기 조절 전용 플러그인을 활용하는 방법도 있습니다.
'Easy Google Fonts'나 'Custom Font Sizes' 같은 플러그인을 설치하면, 복잡한 코드 없이도 관리자 패널에서 쉽게 글자 크기를 변경할 수 있습니다. 플러그인 설치는 '플러그인' > '새로 추가하기'에서 해당 플러그인을 검색한 후 '지금 설치하기'를 클릭하면 됩니다.
다만 플러그인을 너무 많이 설치하면 사이트 속도가 느려질 수 있으니, 정말 필요한 경우에만 사용하는 것을 권장합니다. 테마 자체 기능이나 블록 에디터로 충분히 해결 가능하다면 플러그인은 피하는 것이 좋습니다.
## 모바일 반응형까지 고려한 설정 팁
글자 크기를 설정할 때 데스크톱 화면만 고려해서는 안 됩니다. 현재 대부분의 블로그 방문자가 모바일로 접속하기 때문이죠.
CSS에서 미디어 쿼리를 사용하면 화면 크기에 따라 다른 글자 크기를 적용할 수 있습니다. 예를 들어 모바일에서는 본문을 16px, 데스크톱에서는 18px로 설정하려면:
```
body { font-size: 16px; }
@media (min-width: 768px) {
body { font-size: 18px; }
}
요즘은 vw(viewport width) 단위를 사용해 화면 크기에 비례하는 유동적인 글자 크기를 설정하는 방법도 많이 사용됩니다. 하지만 너무 작거나 크지 않도록 min()과 max() 함수를 함께 활용하는 것이 안전합니다.
WordPress에서 글자 크기를 조절하는 방법은 생각보다 다양합니다. 블록 에디터의 기본 기능으로 시작해서, 필요에 따라 테마 커스터마이저나 CSS를 활용하는 단계로 나아가면 됩니다.
가장 중요한 것은 방문자가 불편함 없이 콘텐츠를 읽을 수 있는 가독성입니다. 데스크톱과 모바일 모두에서 테스트해 보면서 최적의 크기를 찾아보시기 바랍니다.