WordPress를 위한 9가지 최고의 타이포그래피 플러그인

게시 됨: 2021-06-26

좋은 타이포그래피는 웹사이트에 매우 중요합니다. 타이포그래피에는 서체, 레이아웃, 단락 시작표시문자, 아이콘 등이 포함됩니다. 이 중 대부분은 이제 구텐베르크로 수행할 수 있지만 서체는 여전히 플러그인이 큰 차이를 만들 수 있는 영역입니다. 이 기사에서는 WordPress에 가장 적합한 타이포그래피 플러그인을 선택하는 데 도움이 되는 몇 가지 옵션을 살펴보겠습니다.

1. 디비 빌더 플러그인

디비 플러그인

Divi Builder 플러그인은 모든 WordPress 테마에 Divi Builder를 추가합니다. 여기에는 800개의 Google 글꼴이 포함되어 있으며 Google API 키를 추가하여 새 글꼴을 자동으로 가져올 수 있습니다. 더 많이 업로드할 수도 있습니다. Divi 플러그인은 타이포그래피 이상의 기능을 제공하지만, 다양한 타이포그래피 기능으로 인해 Divi Builder를 완전히 활용하지 않더라도 훌륭한 선택입니다. 타이포그래피 옵션은 Divi 테마에서도 사용할 수 있습니다.

디비 플러그인

텍스트가 포함된 모듈에서 글꼴을 검색하고 각 글꼴의 미리보기를 확인합니다. 최근에 사용한 글꼴이 상단에 표시되어 찾기 쉽습니다.

디비 플러그인

글꼴은 완전히 스타일 가능합니다. 인라인 또는 모듈 설정 내에서 스타일을 지정합니다. 모든 모듈의 모든 제목 크기를 독립적으로 사용자 정의합니다.

디비 플러그인

스타일을 전역으로 설정하고 몇 번의 클릭만으로 다른 모듈로 확장할 수 있습니다.

주요 기능 :

  • 글꼴 및 텍스트 스타일.
  • 전역 스타일을 만듭니다.
  • 데스크탑, 태블릿 및 휴대폰의 글꼴을 개별적으로 조정합니다.
  • 타이포그래피 선택을 분할 테스트하십시오.
  • 적용하기 전에 스타일을 미리 봅니다.
  • 스타일을 확장합니다.
  • 스타일을 복사하여 붙여넣습니다.
  • 컬러매니저.
  • 스타일을 찾아 교체합니다.
  • 텍스트 그림자.

가격 : 연간 $89, 평생 $249 | 추가 정보

2. 모든 글꼴 사용

모든 글꼴 사용

모든 글꼴 사용은 새 글꼴을 업로드할 수 있는 WordPress용 간단한 타이포그래피 플러그인입니다.

모든 글꼴 사용

설정 화면에서 새 글꼴을 업로드합니다. 미리 정의된 글꼴을 추가할 수도 있습니다.

모든 글꼴 사용

미리 정의된 글꼴을 선택하면 원하는 글꼴을 검색하고 선택할 수 있는 모달이 열립니다. 미리보기를 제공하므로 무엇을 얻고 있는지 알 수 있습니다. 개인 및 상업적 사용을 위한 거의 24,000가지 옵션이 있습니다.

모든 글꼴 사용

설정 화면에서 모든 요소에 글꼴을 할당합니다. 사용자 정의 요소를 추가할 수도 있습니다.

주요 기능 :

  • 모든 요소에 글꼴을 할당합니다.
  • 사용자 지정 요소에 할당합니다.
  • 새 글꼴을 업로드합니다.
  • 약 24,000개의 미리 정의된 글꼴.
  • Pro 버전은 여러 글꼴 업로드를 추가합니다.

가격 : 무료, 프로 버전은 $9.99부터 시작합니다 | 추가 정보

3. 고급 편집기 도구

고급 편집기 도구

고급 편집기 도구는 Gutenberg 및 Classic 편집기에서 모두 작동합니다. 많은 타이포그래피 옵션을 추가하고 클래식 블록과 클래식 편집기 모두에서 클래식 편집기의 도구 모음을 사용자 지정할 수 있습니다. 그것은 Gutenberg에 새로운 단락 블록을 추가합니다. 원하는 경우 블록 편집기를 클래식 편집기로 교체할 수도 있습니다.

고급 편집기 도구

구텐베르크 설정에는 블록 편집기용 도구 모음, 클래식 단락 및 클래식 블록, 도구 모음용으로 사용하지 않는 버튼 및 많은 옵션이 포함됩니다. 설정은 타이포그래피에 초점을 맞추고 원하는 정확한 기능을 사용자 지정할 수 있습니다.

고급 편집기 도구

동일한 도구 모음, 사용하지 않는 버튼 및 옵션을 사용하여 클래식 편집기를 사용자화할 수도 있습니다.

주요 기능 :

  • Gutenberg 및 Classic 편집기에 타이포그래피 옵션을 추가합니다.
  • 도구 모음을 사용자 정의합니다.
  • 텍스트 색상을 조정합니다.
  • Gutenberg에 단락 블록을 추가합니다.
  • 블록 편집기를 클래식 편집기로 교체하십시오.

가격 : 무료 | 추가 정보

4. 구글 폰트 타이포그래피

구글 폰트 타이포그래피

Google Fonts Typography는 기본 및 고급 설정이 포함된 테마 사용자 정의 도구에 새 메뉴를 추가합니다. 998개의 Google 글꼴 중에서 선택하여 웹사이트 전체의 특정 요소에 적용하세요. 글꼴을 미리 볼 수 있으므로 게시하기 전에 글꼴이 어떻게 보이는지 알 수 있습니다.

구글 폰트 타이포그래피

기본 설정, 고급 설정, 글꼴 로드 및 디버깅 도구가 포함된 새 메뉴가 테마 사용자 지정 프로그램에 추가되었습니다.

구글 폰트 타이포그래피

기본 설정을 사용하면 기본 타이포그래피, 제목 및 버튼에 대한 글꼴 모음을 선택할 수 있습니다. 글꼴 두께와 스타일도 선택할 수 있습니다.

구글 폰트 타이포그래피

고급은 브랜딩, 탐색, 콘텐츠, 사이드바, 바닥글 및 글꼴 로드에 대한 사용자 지정 설정을 추가합니다. 이 예는 콘텐츠 설정을 보여줍니다.

구글 폰트 타이포그래피

API 키가 있는 경우 Adobe 글꼴을 추가할 수도 있습니다.

주요 기능 :

  • 테마 커스터마이저를 사용합니다.
  • 기본 및 고급 설정이 포함됩니다.
  • 게시하기 전에 미리 봅니다.
  • Pro 버전은 글꼴 크기 및 색상을 추가하고, 로컬에서 호스트하고, 로딩을 최적화하고, 사용자 정의 글꼴을 업로드합니다.
  • Adobe 글꼴을 추가합니다.

가격 : 무료, 프로 버전은 $59부터 시작합니다 | 추가 정보

5. 멋진 글꼴

글꼴 굉장

Font Awesome을 사용하면 콘텐츠에 아이콘을 쉽게 추가할 수 있습니다. 무료 또는 프로 아이콘을 사용하고 SVG 또는 웹 글꼴 중에서 선택할 수 있습니다. 아이콘은 CDN 또는 웹 키트에서 로드할 수 있습니다. 아이콘은 단축 코드 또는 HTML을 사용하여 콘텐츠에 추가됩니다. 무료 버전에는 1600개 이상의 아이콘이 포함되어 있으며 프로 버전에서는 더 많은 아이콘을 추가할 수 있습니다.

글꼴 굉장

설정 화면에서 키트 또는 CDN, 프로 또는 무료 글꼴, SVG 또는 웹 글꼴 사용 중에서 선택할 수 있습니다. 사용하려는 버전과 호환성을 선택할 수도 있습니다.

글꼴 굉장

이 예는 내 콘텐츠에 단축 코드로 추가되는 Font Awesome 아이콘을 보여줍니다.

글꼴 굉장

이제 내가 추가한 아이콘이 프런트 엔드의 콘텐츠에 나타납니다.

주요 기능 :

  • 단축 코드 또는 HTML로 Font Awesome 아이콘을 추가합니다.
  • 무료 버전의 1600개 이상의 아이콘.
  • SVG 또는 웹 키트를 사용합니다.
  • CDN 또는 키트를 선택합니다.
  • Pro 버전에는 7800개 이상의 아이콘, 4가지 스타일, 20개의 호스팅된 프로 키트, 250개의 업로드된 아이콘 등이 포함됩니다.

가격 : 무료, 프로 버전은 $99 | 추가 정보

6. 스타일 가이드

스타일 가이드

Styleguide는 테마 커스터마이저에서 글꼴과 색상을 선택할 수 있는 WordPress용 간단한 타이포그래피 플러그인입니다. 여기에는 상위 45개 Google 글꼴이 포함되어 있으며 코드로 더 추가할 수 있습니다. 테마 호환성이 제한됩니다. 기본적으로 Divi에서는 작동하지 않습니다. 테마에서 작동하지 않으면 코드로 테마 지원을 추가해야 합니다. 여기에는 코드의 예가 포함되어 있습니다.

스타일 가이드

글꼴 스타일 옵션이 테마 커스터마이저에 추가됩니다. 설정에는 헤더 글꼴, 본문 글꼴 및 배경색이 포함됩니다. 또한 페이지 하단에 버튼을 추가하는 다크 모드 옵션이 있습니다.

주요 기능 :

  • 테마 커스터마이저에 글꼴 스타일이 추가되었습니다.
  • 머리글과 본문 텍스트의 글꼴을 개별적으로 선택합니다.
  • 다크 모드.
  • 코드로 더 많은 글꼴을 추가하십시오.
  • 코드와 테마 호환성을 추가합니다.

가격 : 무료 | 추가 정보

7. 페이지 제목 스플리터

페이지 제목 스플리터

Page Title Splitter를 사용하면 제목에 대한 중단점을 설정하여 구분할 위치를 결정할 수 있습니다. 이것은 특히 작은 화면에 유용합니다. 클래식 편집기와 함께 작동하며 중단점을 배치할 수 있는 간단한 막대를 제공합니다. 아이콘을 클릭하면 막대가 열립니다. 그런 다음 제목 내에서 클릭한 위치에 중단점이 배치됩니다.

페이지 제목 스플리터

설정을 통해 CSS 클래스와 스타일을 추가하고 제목, 메뉴 제목, 위젯 제목 등을 수정하도록 선택할 수 있습니다. 사용 방법에 대한 자세한 지침을 제공합니다.

페이지 제목 스플리터

다음은 내가 만든 샘플 기사에 대한 중단점입니다. 나는 하나를 설정했지만 여러 위치에서 제목을 나누기 위해 여러 마커를 설정할 수 있습니다.

페이지 제목 스플리터

중단점은 프런트 엔드에서 제목을 분할합니다. 이것은 일반적으로 사용할 수 없는 독특한 레이아웃으로 타이틀을 디자인하는 데 사용할 수 있습니다.

주요 기능 :

  • 제목에 대한 중단점을 만듭니다.
  • 클래식 편집기와 함께 작동합니다.
  • 여러 마커를 설정합니다.
  • CSS로 중단점을 조정합니다.

가격 : 무료 | 추가 정보

8. 보조 타이틀

보조 타이틀

보조 제목은 일반 제목과 함께 다른 제목을 표시하기 위해 클래식 편집기와 함께 작동하는 WordPress용 간단한 타이포그래피 플러그인입니다. 제목 필드 위에 새 필드를 추가하고 모양과 작동 방식을 사용자 정의할 수 있는 설정을 제공합니다. 게시물 유형, 카테고리 및 특정 게시물 ID와 호환됩니다.

보조 타이틀

설정을 통해 보조 제목의 형식을 설정하고 표시 규칙을 설정할 수 있습니다. 게시물 유형 및 카테고리에 대한 규칙을 설정합니다. 보조 제목의 미리 보기를 제공하여 조정할 수 있습니다.

보조 타이틀

보조 제목을 입력할 수 있는 새 필드가 제목 위에 추가됩니다.

보조 타이틀

설정 화면에서 선택한 옵션에 따라 제목이 표시됩니다. 이것이 기본 설정입니다.

주요 기능 :

  • 클래식 편집기에 새 제목 필드를 추가합니다.
  • 원하는 방식으로 제목 디자인을 조정합니다.
  • 보조 제목을 사용하는 게시물 유형 및 카테고리를 선택합니다.

가격 : 무료 | 추가 정보

9. Zeno 글꼴 크기 조정

Zeno 글꼴 크기 조정

Zeno Font Resizer를 사용하면 방문자가 웹사이트를 볼 때 글꼴 크기를 변경할 수 있습니다. 쿠키는 설정을 유지하므로 방문할 때마다 변경할 필요가 없습니다. 귀하는 그들이 할 수 있는 선택, 표시되는 아이콘, 쿠키가 작동하는 일 수 등을 제어할 수 있습니다.

Zeno 글꼴 크기 조정

설정 화면에서 HTML, 크기 조정 단계, 최소 및 최대 크기, 크기 조정 아이콘에 표시되는 문자, 쿠키 설정을 조정할 수 있습니다. HTML을 사용하면 크기 조정이 작동하는 방식을 선택할 수 있습니다.

Zeno 글꼴 크기 조정

위젯을 사용하여 사이드바에 크기 조정기를 추가했습니다.

주요 기능 :

  • 크기 조정 단계를 조정합니다.
  • 최소 및 최대 크기를 설정합니다.
  • 캐릭터를 선택합니다.
  • 쿠키는 방문자의 설정을 유지합니다.
  • 코드나 위젯으로 추가하세요.

가격 : 무료 | 추가 정보

마무리 생각

이것이 WordPress를 위한 최고의 타이포그래피 플러그인에 대한 우리의 모습입니다. 타이포그래피를 돋보이게 하고 독자의 시선을 사로잡을 수 있는 좋은 옵션이 많이 있습니다. WordPress용 타이포그래피 플러그인을 찾고 있다면 이 목록에서 필요에 맞는 것을 찾을 수 있을 것입니다.

우리는 당신의 의견을 듣고 싶습니다. WordPress에 가장 좋아하는 타이포그래피 플러그인은 무엇입니까?

ANTSTUDIO/Shutterstock.com을 통한 추천 이미지