워드프레스 블로그 무료 폰트의 다양한 선택지와 적용 방법

안녕하세요. 블로그를 운영하다 보면 글의 내용만큼이나 시각적인 부분이 중요하다고 느끼실 텐데요.

특히 글의 분위기를 결정하는 폰트는 블로그의 첫인상을 좌우하는 중요한 요소입니다.

하지만 상업적 이용이 가능한 폰트를 찾기가 쉽지 않죠.

그리고 자칫 잘못 사용하면 저작권 문제에 휘말릴 수 있어 조심스럽습니다.

오늘은 저작권 걱정 없이 자유롭게 사용할 수 있는 무료 폰트 사이트들을 소개해 드리고,

워드프레스 블로그에 폰트를 적용하는 방법까지 자세하게 알려드리겠습니다.

이 글을 통해 여러분의 블로그를 더욱 멋지게 꾸밀 수 있기를 바랍니다.

1. 저작권 걱정 없는 무료 폰트 사이트

무료 폰트라고 해서 모두 자유롭게 상업적으로 이용할 수 있는 것은 아닙니다.

개인적인 용도로만 사용 가능하거나, 상업적 이용 시 출처를 표기해야 하는 등 각 폰트마다 라이선스 규정이 다르므로 사용 전에 반드시 확인해야 합니다.

아래 소개하는 사이트들은 대부분 상업적 이용이 가능하지만,개별 폰트의 라이선스를 다시 한번 확인하는 습관을 들이는 것이 좋습니다.

1.1. 눈누(noonnu)

웹사이트: https://noonnu.cc/

눈누는 한글 폰트를 전문적으로 다루는 사이트입니다.

이곳은 상업적 이용이 가능한 폰트들을 한곳에 모아두었습니다.

폰트를 직접 타이핑해서 미리 볼 수 있는 기능이 매우 유용하며, 라이선스 정보를 직관적으로 표시해 줍니다.

폰트 이름 아래에 있는 ‘다운로드’ 버튼을 누르면 해당 폰트를 제공하는 공식 페이지로 바로 이동하여 안심하고 다운로드할 수 있습니다.

1.2. 구글 폰트(Google Fonts)

웹사이트: https://fonts.google.com/

구글 폰트는 전 세계적으로 가장 많이 사용되는 무료 폰트 라이브러리입니다. 방대한 양의 영문 폰트를 제공하며, 최근에는 한글 폰트도 많이 추가되었습니다. 모든 폰트가 상업적 이용을 포함한 오픈 소스 라이선스를 따르고 있어 매우 안전합니다. 구글 폰트는 웹폰트 형식으로 제공되어 워드프레스에 적용하기 매우 편리합니다.

1.3. 네이버 글꼴 모음(Naver Fonts)

웹사이트: https://hangeul.naver.com/2017/nanum

네이버에서 제공하는 ‘나눔글꼴’ 시리즈는 이미 많은 분들이 알고 계실 텐데요. 가독성이 뛰어나고 다양한 굵기를 제공하여 본문용, 제목용으로 모두 활용도가 높습니다. 나눔글꼴 역시 개인 및 기업 사용자 모두에게 무료로 제공되며, 자유롭게 수정하고 배포할 수 있습니다.

1.4. 어도비 폰트(Adobe Fonts)

웹사이트: https://fonts.adobe.com/

어도비 크리에이티브 클라우드 구독자라면 추가 비용 없이 어도비 폰트를 이용할 수 있습니다. 수많은 폰트들을 제공하며, 웹폰트로도 쉽게 적용할 수 있습니다. 구독자라면 이 기회를 놓치지 마세요.

2. 워드프레스에 폰트 적용하는 방법

워드프레스에 폰트를 적용하는 방법은 크게 3가지가 있습니다. 사용하는 테마에 따라 지원하는 방식이 다르므로, 본인에게 맞는 방법을 선택하시면 됩니다.

2.1. 테마 기본 설정 활용하기

가장 쉽고 간단한 방법입니다. 많은 워드프레스 테마들은 별도의 플러그인 설치 없이 폰트를 변경할 수 있는 기능을 내장하고 있습니다.

관리자 페이지 > 외모 > 사용자 정의하기 로 이동합니다.
타이포그래피 또는 글꼴 등 폰트 관련 설정 메뉴를 찾습니다.
원하는 폰트를 선택하고 발행 버튼을 눌러 저장합니다.

이 방법은 테마에서 지원하는 폰트 목록 내에서만 선택할 수 있다는 단점이 있지만, 가장 안정적이고 빠른 방법입니다.

2.2. 플러그인을 활용하여 폰트 적용하기

테마에서 폰트 변경 기능을 지원하지 않거나, 원하는 폰트가 목록에 없을 경우 플러그인을 사용하여 폰트를 추가할 수 있습니다. 구글 폰트를 주로 사용하는 분들에게 특히 유용한 방법입니다.

2.2.1. Easy Google Fonts

플러그인 설치: 워드프레스 관리자 페이지에서 플러그인 > 새로 추가 메뉴를 통해 ‘Easy Google Fonts’를 검색하여 설치 및 활성화합니다.

사용 방법:

관리자 페이지 > 설정 > Google Fonts로 이동합니다.
Appearance 탭에서 글꼴을 변경할 수 있습니다.
또는 관리자 페이지 > 외모 > 사용자 정의하기로 이동하여 Typography 메뉴를 통해 폰트를 변경할 수도 있습니다.

이 플러그인은 구글 폰트 라이브러리에 있는 모든 폰트를 쉽게 불러와서 적용할 수 있게 해줍니다. 제목, 본문 등 각 요소별로 폰트를 다르게 설정할 수 있어 매우 편리합니다.

2.2.2. Use Any Font

플러그인 설치: 워드프레스 관리자 페이지에서 플러그인 > 새로 추가 메뉴를 통해 ‘Use Any Font’를 검색하여 설치 및 활성화합니다.

사용 방법:

플러그인 활성화 후 관리자 페이지 > Use Any Font로 이동합니다.
사이트에서 발급받은 API 키를 입력합니다. (일정 폰트 용량까지는 무료)
Upload Fonts 버튼을 클릭하여 다운로드받은 폰트 파일(.ttf, .otf 등)을 업로드합니다.
업로드된 폰트를 원하는 요소(제목, 본문 등)에 지정하여 적용합니다.

이 플러그인은 구글 폰트 외에 개인적으로 다운로드받은 폰트 파일을 직접 업로드하여 사용할 수 있다는 큰 장점이 있습니다. 다만, 무료 API 용량에 제한이 있을 수 있으니 확인이 필요합니다.

2.3. CSS 코드를 사용하여 폰트 적용하기

가장 자유로운 방법이지만, CSS에 대한 기본적인 지식이 필요합니다. 원하는 폰트를 직접 서버에 업로드하고 CSS 코드를 통해 적용하는 방식입니다.

2.3.1. 폰트 파일 업로드

FTP 프로그램을 이용하여 워드프레스 설치 폴더에 접속합니다.
wp-content 폴더 안에 fonts 폴더를 새로 만듭니다. (폴더명은 자유롭게 지정 가능)
다운로드받은 폰트 파일(.woff2, .woff, .ttf 등)을 이 fonts 폴더에 업로드합니다. 웹폰트 최적화를 위해 .woff와 .woff2 형식을 사용하는 것이 좋습니다.

2.3.2. functions.php 파일 수정

테마의 functions.php 파일에 폰트를 불러오는 코드를 추가합니다. 이 방법은 테마 업데이트 시 코드가 초기화될 수 있으므로, 자식 테마(Child Theme)를 사용하는 것을 강력히 추천합니다.

function custom_font_load() {
    wp_enqueue_style( 'custom-font', get_stylesheet_directory_uri() . '/fonts/your-font-name.css' );
}
add_action( 'wp_enqueue_scripts', 'custom_font_load' );

참고: 위 코드는 예시입니다. 폰트 파일을 직접 불러오기보다, @font-face 규칙이 포함된 CSS 파일을 불러오는 것이 일반적입니다.

2.3.3. CSS 파일에 `@font-face` 규칙 추가

업로드된 폰트를 웹에서 사용할 수 있도록 CSS 파일에 @font-face 규칙을 추가합니다.

관리자 페이지 > 외모 > 테마 파일 편집기로 이동합니다. (자식 테마를 사용하는 경우)
style.css 파일을 엽니다.
맨 위에 아래와 같은 코드를 추가합니다.

@font-face {
    font-family: 'YourCustomFont'; /* 폰트 이름 지정 */
    src: url('https://yourwebsite.com/wp-content/fonts/your-font-name.woff2') format('woff2'),
         url('https://yourwebsite.com/wp-content/fonts/your-font-name.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

참고: url() 부분에는 업로드한 폰트 파일의 정확한 경로를 입력해야 합니다.

2.3.4. CSS 선택자를 이용하여 폰트 적용

이제 원하는 요소에 CSS 코드를 사용하여 폰트를 적용합니다.

/* 본문에 폰트 적용 */
body {
    font-family: 'YourCustomFont', 'Noto Sans KR', sans-serif;
}

/* 제목에 폰트 적용 */
h1, h2, h3 {
    font-family: 'YourCustomFont', 'Noto Sans KR', sans-serif;
}

참고: 위 코드에서 'YourCustomFont'는 @font-face에서 지정한 이름입니다. 뒤에 있는 'Noto Sans KR', sans-serif는 혹시 모를 폰트 로딩 실패에 대비하여 대체 폰트를 지정하는 것입니다.

3. 폰트 적용 시 주의사항 및 팁

웹폰트 사용하기: 웹 환경에서는 .woff나 .woff2 확장자를 가진 웹폰트 파일을 사용하는 것이 가장 좋습니다. 용량이 가볍고 브라우저 호환성이 뛰어나기 때문입니다.
폰트 라이선스 확인: 다시 한번 강조하지만, 무료 폰트라도 라이선스 규정을 반드시 확인해야 합니다. 상업적 이용 가능 여부, 출처 표기 의무 등을 꼼꼼하게 살펴보세요.
폰트 용량 최적화: 너무 많은 폰트를 사용하거나 용량이 큰 폰트를 사용하면 블로그 로딩 속도가 느려질 수 있습니다. 필요한 폰트만 사용하고, 용량을 최적화하는 것이 중요합니다.
가독성 고려: 예쁜 폰트도 중요하지만, 블로그의 본문은 가독성이 가장 중요합니다. 너무 얇거나 화려한 폰트보다는 깔끔하고 읽기 편한 폰트를 선택하는 것이 좋습니다.

마무리

아름다운 폰트는 블로그의 완성도를 높이고 방문자에게 좋은 인상을 남기는 데 큰 도움이 됩니다. 오늘 알려드린 방법들을 활용하여 여러분의 블로그를 더욱 멋지고 전문성 있는 공간으로 꾸며보세요.

함께 읽으면 좋은 블로그 글

블로그를 운영하며 알아두면 좋은 다른 글들도 함께 읽어보세요. 아래 글들을 참고하시면 블로그 성장에 더 큰 도움이 될 겁니다.

저작권 걱정 없이 블로그를 꾸미는 법: 무료 폰트 사이트와 워드프레스 적용 방법

1. 저작권 걱정 없는 무료 폰트 사이트

1.1. 눈누(noonnu)

1.2. 구글 폰트(Google Fonts)

1.3. 네이버 글꼴 모음(Naver Fonts)

1.4. 어도비 폰트(Adobe Fonts)

2. 워드프레스에 폰트 적용하는 방법

2.1. 테마 기본 설정 활용하기

2.2. 플러그인을 활용하여 폰트 적용하기

2.2.1. Easy Google Fonts

2.2.2. Use Any Font

2.3. CSS 코드를 사용하여 폰트 적용하기

2.3.1. 폰트 파일 업로드

2.3.2. functions.php 파일 수정

2.3.3. CSS 파일에 `@font-face` 규칙 추가

2.3.4. CSS 선택자를 이용하여 폰트 적용

3. 폰트 적용 시 주의사항 및 팁

마무리

함께 읽으면 좋은 블로그 글

답글 남기기 응답 취소

1. 저작권 걱정 없는 무료 폰트 사이트

1.1. 눈누(noonnu)

1.2. 구글 폰트(Google Fonts)

1.3. 네이버 글꼴 모음(Naver Fonts)

1.4. 어도비 폰트(Adobe Fonts)

2. 워드프레스에 폰트 적용하는 방법

2.1. 테마 기본 설정 활용하기

2.2. 플러그인을 활용하여 폰트 적용하기

2.2.1. Easy Google Fonts

2.2.2. Use Any Font

2.3. CSS 코드를 사용하여 폰트 적용하기

2.3.1. 폰트 파일 업로드

2.3.2. functions.php 파일 수정

2.3.3. CSS 파일에 @font-face 규칙 추가

2.3.4. CSS 선택자를 이용하여 폰트 적용

3. 폰트 적용 시 주의사항 및 팁

마무리

함께 읽으면 좋은 블로그 글

답글 남기기 응답 취소

2.3.3. CSS 파일에 `@font-face` 규칙 추가