Google 서체 통합

다음을 사용하여 웹사이트에 직접 추가 서체를 포함할 수 있는 옵션이 있습니다. 폰트 스타일 패널 내에서 선택합니다. 선택하다 서체 포함, 이는 다음으로 연결됩니다. 사이트 구성 > 서체 탭. 여기에서 사이트에 Google 서체를 삽입할 수 있습니다.

사용자 정의 서체 또는 Adobe 서체를 활용하려는 경우 다음의 해당 섹션에서 웹사이트에 통합할 수 있습니다. 사이트 구성 > 서체 탭.

귀중한 정보: Google 서체를 활용하는 데에는 프리미엄 사이트 또는 작업 공간 계획이 필요하지 않습니다.

핵심: Webflow와 Google 서체의 통합은 최종 사용자 IP 주소를 Google 서버로 전송하는 Google 서체 API를 사용하며 GDPR 규정을 준수하지 않을 수 있습니다. Google 서체 개인정보 보호 및 데이터 수집에 대해 자세히 알아보세요..

최종 사용자 IP 주소를 Google 서버로 전송하지 않으려면 Google에서 서체를 다운로드하여 업로드하는 것이 좋습니다. 사이트 구성 > 서체 탭 > 맞춤형 서체. 사용자 정의 서체 업로드에 대해 자세히 알아보세요.

이 튜토리얼에서는 다음 내용을 이해하게 됩니다.

1. Google 서체를 찾는 방법
2. 웹사이트에 Google 서체를 삽입하는 방법
3. 웹사이트에서 Google 서체를 제거하는 방법
4. 웹사이트에서 Google Typefaces API를 로드하는지 확인하는 방법

Google 서체를 찾는 방법

결정을 내리기 전에 Google 서체 선택을 살펴보고 싶다면, Google 서체를 방문하세요 Google의 무료 웹 서체를 실시간으로 미리 볼 수 있습니다.

여기에서 서체 카테고리를 필터링하고 서체가 표시되는 방식을 테스트하여 서체를 Webflow 사이트에 통합하기 전에 다양한 크기와 스타일의 서체 모양을 더 잘 이해할 수 있습니다.

웹사이트에 Google 서체를 삽입하는 방법

선택한 서체를 염두에 두고 나면 이를 Webflow 사이트에 추가할 수 있습니다.

1. 입장 사이트 구성 > 서체 탭 > Google 서체 
2. 웹사이트에 적용할 서체를 선택하세요. 
3. 사이트에 포함할 변형(예: 스타일, 볼드체 등), 언어, 쓰기 체계를 선택하세요. 나중에 수정할 수 있다는 점을 기억하세요. 
4. 딸깍 하는 소리 서체 삽입

업로드한 서체는 다음에서 액세스할 수 있습니다. 스타일 패널 > 타이포그래피 > 폰트 다음에 Designer를 다시 로드할 때. 이미 디자이너에 있는 경우 페이지를 새로 고치면 업로드된 서체에 액세스할 수 있습니다.

그만큼 폰트 드롭다운은 출처(예: Google 서체, 사용자 정의 서체, 웹 서체)를 기준으로 서체를 구성하고 각 출처 내에서 서체를 알파벳순으로 정렬합니다. Google 서체 통합을 통해 웹사이트에 통합한 모든 서체는 아래에 나열됩니다. Google 서체, 디자이너의 기본 Google 서체(예: Lato, Varela 등)와 함께.

귀중한 정보: 디자이너의 기본 Google 서체(예: Lato, Varela 등)는 다음의 Google 서체 목록에 표시되지 않습니다. 사이트 구성 > 서체 탭 > Google 서체. 

웹사이트에서 Google 서체를 제거하는 방법

웹 사이트에서 Google 서체를 제거하려면 먼저 해당 Google 서체를 모두 검색하고 웹 사이트에서 Google 서체의 모든 인스턴스를 삭제한 다음 궁극적으로 웹 사이트에서 Google 서체를 삭제해야 합니다. 사이트 구성 > 서체 탭 > Google 서체.

핵심: 에서 Google 서체 삭제 사이트 구성 > 서체 탭 > Google 서체 홀로 ~하지 않을 것이다 웹사이트에서 서체를 제거하세요. Google 서체는 웹 사이트에 게시된 CSS에 계속 표시되며 웹 사이트에서 Google 서체의 모든 인스턴스를 제거할 때까지 Google 서체 API 스크립트를 계속 로드합니다. 삭제된 서체를 참조하는 모든 텍스트 요소는 게시된 웹사이트에서 Times New Roman으로 렌더링됩니다. 

웹사이트에서 Google 서체의 모든 항목을 찾아내려면 다음을 엽니다. 스타일 선택기 패널 찾고자 하는 서체의 이름을 입력하세요. 그러면 해당 Google 서체를 사용하는 웹사이트의 모든 클래스 및 HTML 태그 목록이 제공됩니다. 각 클래스 옆에 있는 "목록" 기호를 클릭하면 해당 클래스를 활용하는 요소와 구성 요소를 볼 수 있습니다.

Google 서체를 사용하여 클래스 및/또는 HTML 태그를 식별한 후에는 해당 서체를 사용하는 요소를 삭제하고 사용되지 않는 클래스를 다음에서 정리해야 합니다. 스타일 선택기 패널, 또는 해당 클래스 및/또는 HTML 태그에서 사용되는 서체를 수정합니다. 스타일 패널 >타이포그래피 > 폰트.

웹사이트에서 Google 서체의 모든 인스턴스를 제거한 후 사이트 구성에서 Google 서체를 삭제할 수 있습니다.

1. 입장 사이트 구성 > 서체 탭 > Google 서체 
2. 딸깍 하는 소리 삭제 웹사이트에서 삭제하려는 Google 서체 옆
3. 변경사항을 적용하려면 웹사이트를 다시 게시하세요. 

웹사이트에서 Google Typefaces API를 로드하는지 확인하는 방법 

Google 서체를 모두 제거한 후 웹사이트에서 더 이상 Google 서체 API를 로드하지 않는지 확인하고 싶을 수도 있습니다. 이는 GDPR 준수를 보장하려는 경우 특히 중요합니다.

웹사이트가 Google Chrome에서 Google Typefaces API를 로드하는지 확인하려면:

1. 게시된 웹사이트를 방문하세요. 
2. 페이지의 아무 곳이나 마우스 오른쪽 버튼으로 클릭하고 "검사"를 선택하십시오. 
3. 액세스 회로망 탭
4. 페이지 새로 고침
5. 검사 회로망 탭을 찾아 웹폰트.js 파일 

발견할 수 있다면 웹폰트.js 파일을 삭제하면 웹사이트에 Google Typefaces API 스크립트가 로드되었으며 웹사이트에서 모든 Google 서체를 제거하려면 앞서 언급한 단계를 반복해야 합니다. 마주치지 않는다면 웹폰트.js 네트워크 탭의 파일에서 귀하의 웹사이트가 Google Typefaces API를 요청하거나 로드하지 않았습니다.