WordPress 사이트 테마에 맞춤 글꼴을 추가하는 3가지 방법

WordPress 웹 사이트를 더욱 독특하고 시각적으로 매력적으로 보이게 만들 수 있는 흥미롭고 사용자 정의 가능한 방법이 많이 있습니다. 방법 중 하나는 WordPress 사이트에 사용자 지정 글꼴을 추가하는 것입니다. 경쟁사의 웹사이트를 살펴보십시오. 자신의 WordPress 웹 사이트에서 만들고자 하는 것과 동일한 톤과 스타일을 에뮬레이트할 수 있습니다. 글꼴 사용에 주의하세요. 많은 성공적인 사이트는 전체 웹 사이트에서 일관되게 사용되는 소수의 엄선된 글꼴을 사용하는 경향이 있습니다.

자신의 사이트에 쉽게 추가할 수 있는 무료로 사용할 수 있는 사용자 지정 글꼴이 너무 많습니다. 올바른 글꼴을 찾은 후에는 해당 글꼴을 웹 사이트에 적용하는 방법을 알아야 합니다. 이를 달성하기 위해 시도할 수 있는 다양한 방법이 있습니다.

먼저 올바른 글꼴을 찾는 것입니다. 다운로드할 수 있는 수천 개의 무료 글꼴을 제공하는 수많은 사이트가 있습니다. Google 글꼴, TemplateMonster, MyFonts, FontSpring, Cufonfonts, Dafont, Font Squirrel, Edge Web Fonts, 1001 무료 글꼴, Fonts.com을 사용해 보세요.

즉, WordPress 웹 사이트에 사용자 정의 글꼴을 추가하는 두 가지 주요 방법은 수동 또는 플러그인입니다.

WordPress 사이트 테마에 사용자 지정 글꼴을 수동으로 추가

너무 많은 플러그인으로 WordPress 사이트에 과도한 부담을 주는 위험을 감수하지 않으려면 WordPress에 사용자 정의 글꼴을 수동으로 추가하는 것이 도움이 될 수 있습니다. 이는 @font-face 지시문을 편집하여 수행할 수 있습니다. 이를 통해 모든 형식의 여러 글꼴을 사이트에 연결할 수 있습니다.

여기에는 다음 단계가 포함됩니다.

1 단계

먼저 가장 유용하다고 생각되는 웹사이트에서 선택한 사용자 지정 글꼴을 다운로드합니다. 파일이 컴퓨터에 저장되면 이 .zip 아카이브의 압축을 풉니다.

2 단계

그런 다음 "wp-content/themes/your-theme-folder/fonts" 디렉터리 아래의 WordPress 호스팅 서버에서 이 글꼴 파일을 업로드할 수 있습니다. 사용자 지정 글꼴에 대한 지정 폴더를 아직 설정하지 않은 경우 폴더를 만들어 저장합니다.

3단계

다음으로 WordPress의 관리 영역으로 이동합니다. 모양을 선택한 다음 테마 편집기로 이동합니다. 이 시점에서 테마의 style.css 파일이 화면에 표시됩니다. 그 아래에 다음 코드 섹션을 추가해야 합니다.

 @font-face { font-family: Aguafina Script-Regular; src: url(http://test-site.com/wp-content/themes/your-theme-folder/fonts/AguafinaScript-Regular.ttf); font-weight: normal; }

코드의 "URL" 및 "font-family"를 선택한 글꼴에 해당하는 적절한 값으로 바꾸는 것을 잊지 마십시오. 또한 이 코드 섹션을 CSS 파일의 시작 부분에 테마 주석 뒤에 붙여넣어야 합니다.

4단계

마지막으로 중요한 파일 업데이트 버튼을 클릭해야 합니다. 이렇게 하면 페이지를 떠나기 전에 변경 사항이 제대로 저장됩니다.

5단계

그런 다음 테마의 스타일시트에서 적용하려는 다른 곳에서 글꼴을 쉽게 사용할 수 있습니다. 다음 코드 사용:

 .h1 site-title { font-family: "Aguafina Script-Regular", Arial, sans-serif; }

이제 이 글꼴 코드를 편집했으므로 누군가 웹사이트를 방문할 때마다 글꼴이 로드됩니다. 그러나 아직 페이지의 특정 요소에 적용하지 않았습니다. 이렇게 하려면 방금 액세스한 해당 style.css 파일을 최종 편집해야 합니다. 파일에 다음과 같은 코드를 입력해야 합니다.

 .site-title { font-family: "Aguafina Script-Regular", Arial, sans-serif; }

권장 사항: 초보자 가이드: WordPress 테마를 설치하는 방법은 무엇입니까?

빠른 참고:

이전과 마찬가지로 사용 중인 글꼴에 적합하도록 font-family 값을 편집해야 합니다.

예를 들어 Google Fonts의 맞춤 서체를 사용하는 경우 테마의 style.css 파일에 간단히 복사하여 붙여넣을 수 있는 관련 코드를 제공하는 @import라는 탭이 있음을 알 수 있습니다. 너무 많은 코딩을 처리하는 것이 불편하다면 전체 프로세스를 훨씬 간단하게 만들 수 있습니다.

그러나 이것은 더 이상 권장되는 방법이 아닙니다. 일부 성능 문제가 발생하여 브라우저가 동시에 여러 스타일 시트를 다운로드하지 못합니다. 결과적으로 페이지 로딩 속도가 느려집니다. 따라서 글꼴과 사용 방법을 선택할 때 이 점을 염두에 두십시오.

반면 CSS를 통한 수동 사용자 지정 글꼴 설치를 사용하면 SVG, WOFF, TTF 및 OTF를 비롯한 다양한 형식의 글꼴을 연결할 수 있습니다. 이 방법을 사용하면 타사 서비스에 의존하지 않고도 작업할 수 있습니다. 글꼴 파일은 서버에 있습니다. 이것은 WordPress에 사용자 지정 글꼴을 추가하는 가장 직접적인 방법입니다.

플러그인을 사용하여 WordPress 사이트 테마에 맞춤 글꼴 추가

많은 사람들이 워드프레스 사이트에 맞춤 글꼴을 포함하기 위해 플러그인을 사용하기로 선택합니다. 이는 여러 면에서 가장 간단한 방법일 수 있기 때문입니다. CSS 코딩을 처리하고 싶지 않은 경우 특히 그렇습니다. Google Fonts는 주로 WordPress 플러그인과 함께 쉽게 사용할 수 있기 때문에 널리 사용됩니다. 가장 좋은 두 가지 옵션은 Easy Google Fonts 및 Google Fonts Typography입니다. 이러한 플러그인 중 하나를 활성화하면 복잡한 코드를 처리할 필요 없이 전체 Google Fonts 글꼴 카탈로그에 쉽게 액세스하여 페이지에 추가할 수 있습니다.

Google 글꼴을 사용하는 것이 이를 수행하는 가장 간단한 방법이며 변경 사항 및 맞춤 글꼴을 화면에서 실시간으로 미리 볼 수 있습니다.

사용하려는 글꼴 파일과 단일 리포지토리를 사용하려는 경우 Custom Fonts 플러그인과 같은 대체 플러그인 사용을 고려할 수 있습니다.

1 단계

선택한 플러그인을 설치하고 활성화한 후 Appearance로 이동한 다음 Customizer 페이지를 클릭하면 라이브 WordPress 테마 사용자 정의 인터페이스 페이지가 열립니다. 여기에서 사용자 지정 글꼴을 적용할 수 있는 사이트의 각 섹션을 표시하는 타이포그래피 탭을 볼 수 있습니다.

2 단계

이 페이지를 열면 편집을 시작하려는 페이지 섹션 내에서 글꼴 편집 버튼을 클릭할 수 있습니다. 그런 다음 글꼴 스타일, 크기, 여백 등을 선택하여 다양한 하위 섹션을 통해 작업할 수 있습니다. 이러한 섹션은 사용 중인 테마에 따라 달라집니다.

테마는 웹 사이트의 다양한 섹션에 대해 선택한 글꼴을 직접 편집할 수 없음을 의미할 수도 있습니다. 그러나이 문제에 대한 간단한 수정이 있습니다. 설정으로 이동 한 다음 Google 글꼴로 이동하여 자신 만의 글꼴 컨트롤을 만들 수 있습니다. 이렇게 하려면 컨트롤 이름을 상자에 입력하고 CSS 선택기를 선택하기만 하면 됩니다. 이렇게 하면 이 글꼴을 대상으로 하려는 HTML 요소를 추가할 수 있습니다. 이 정보를 입력했으면 설정이 완전히 업데이트되도록 글꼴 컨트롤 저장 버튼을 클릭하여 변경 사항을 저장해야 합니다. 그런 다음 WordPress 웹 사이트의 각 섹션에 필요한 만큼 사용자 지정 글꼴 컨트롤을 계속 만들 수 있습니다.

3단계

이러한 새 글꼴 컨트롤러를 만든 후 사용하려면 모양 섹션으로 돌아가서 사용자 정의를 클릭한 다음 타이포그래피 탭을 클릭하십시오. 그런 다음 테마 타이포그래피라는 옵션이 표시됩니다. 이 옵션을 클릭하면 편집 버튼을 선택하여 사용자 정의 글꼴 컨트롤에 액세스할 수 있으므로 원하는 글꼴과 이 특정 글꼴에 대해 원하는 모양을 선택할 수 있습니다. 제어. 다시 한 번 게시 또는 저장 버튼을 클릭하여 사이트를 업데이트하여 변경 사항을 저장하는 것을 잊지 마십시오.

빠른 참고:

우리가 권장하는 다른 훌륭한 사용자 정의 WordPress 글꼴 플러그인은 사용자 정의 글꼴 업로더 및 모든 글꼴 사용입니다. 하지만 선택할 수 있는 다른 플러그인이 무수히 많으므로 사용하려는 플러그인을 결정하기 전에 옵션을 탐색하십시오.

당신은 또한 좋아할 수 있습니다: 20 베스트 셀러 Micro Niche WordPress Themes.

마지막으로 테마를 사용해 보세요

WordPress 웹사이트에 맞춤 글꼴 및 타이포그래피를 추가하는 이 두 가지 주요 방법 외에도 선택할 수 있는 테마를 사용할 수도 있습니다. 사용 가능한 다양한 테마가 있으며 그 중 다수는 설치된 글꼴을 사용자 정의할 수 있는 기본 제공 옵션과 함께 제공됩니다. 그렇게 하는 과정은 사용 중인 테마에 따라 다릅니다. 따라서 테마에 맞는 적절한 가이드를 찾아보세요. 고품질의 프리미엄 WordPress 테마는 특정 테마에 사용자 지정 글꼴을 추가하기 위한 지침을 제공하는 온라인 액세스용 문서도 제공합니다.

시각적 및 디자인 요소는 방문하는 모든 사람의 관심을 끌 효과적인 웹사이트를 만드는 데 가장 중요한 요소 중 하나입니다. 이 분야의 가장 큰 특징 중 하나는 글꼴을 사용하는 것입니다. WordPress 웹사이트에 사용자 지정 글꼴을 추가하기 위해 어떤 방법을 선택하든 전체 웹사이트 및 브랜드의 스타일, 대상, 콘텐츠, 테마 및 톤에 가장 적합한 글꼴을 찾아 사용해야 합니다.

 이 기사는 Beatrice Beard가 작성했습니다. Beatrice는 Academic Brits의 전문 카피라이터로 인상적인 범위의 주제와 주제 영역을 전문으로 합니다. Beatrice는 항상 자신의 개인적인 경험을 공유하고 실제로 판매되는 고품질 콘텐츠를 만드는 많은 어려움과 특성을 모두 밝히는 초보 작가에게 전문적인 조언을 제공합니다.