Google書体を統合

ウェブサイトに追加の書体を直接含めるオプションがあります。 フォント スタイルパネル内の選択。 書体を含める、それはあなたを導きます サイト構成 > 書体 タブをクリックします。そこから、Google 書体をサイトに埋め込むことができます。

カスタム書体やAdobe書体を利用したい場合は、それぞれのセクションからウェブサイトに統合することができます。 サイト構成 > 書体 タブ。

貴重な情報: Google フォントを使用するのに、プレミアム サイトまたはワークスペース プランは必要ありません。

キーポイント： Webflow と Google 書体の統合は Google 書体 API に依存しており、エンド ユーザーの IP アドレスを Google サーバーに送信するため、GDPR 規制に準拠していない可能性があります。 Google書体のプライバシーとデータ収集について詳しく見る.

エンドユーザーのIPアドレスをGoogleサーバーに送信しないようにするには、Googleから書体をダウンロードし、 サイト構成 > 書体 タブ > カスタム書体カスタム書体のアップロードについてさらに詳しく調べます。

このチュートリアルでは、次のことを理解します。

1. Google書体の見つけ方
2. Google 書体をウェブサイトに挿入する方法
3. ウェブサイトから Google 書体を削除する方法
4. ウェブサイトが Google Typefaces API を読み込んでいるかどうかを確認する方法

Google書体の見つけ方

決定する前にGoogle書体の選択肢を検討したい場合は、 Google書体をご覧ください Google の無料 Web 書体のライブプレビューをご覧ください。

そこで、書体のカテゴリをフィルタリングし、書体がどのように表示されるかをテストして、書体を Webflow サイトに統合する前に、さまざまなサイズやスタイルでの書体の外観をよりよく理解することができます。

Google 書体をウェブサイトに挿入する方法

選択した書体が決まったら、それを Webflow サイトに追加できます。

1. アクセス サイト構成 > 書体 タブ > Google書体 
2. ウェブサイトに適用したい書体を選択してください 
3. サイトに含めるバリエーション（スタイル、太字など）、言語、書記体系を選択します。後で変更できることを覚えておいてください。 
4. クリック 書体を挿入

アップロードした書体は、 スタイルパネル > タイポグラフィ > フォント 次回のデザイナーのリロード時にアップロードされた書体が表示されます。すでにデザイナーを使用している場合は、ページを更新するとアップロードされた書体にアクセスできるようになります。

の フォント ドロップダウンでは、書体がその起源（例：Google書体、カスタム書体、Web書体）に基づいて整理され、各起源内で書体がアルファベット順に並べられます。Google書体の統合を介してWebサイトに統合した書体は、 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 書体を使用している Web サイト上のすべてのクラスと HTML タグのリストが表示されます。各クラスの横にある「リスト」記号をクリックすると、そのクラスを使用している要素とコンポーネントが表示されます。

Google書体を使用しているクラスやHTMLタグを特定したら、その書体を使用している要素を削除し、使用されていないクラスを整理する必要があります。 スタイルセレクタパネル、またはそれらのクラスやHTMLタグで使用される書体を変更します。 スタイルパネル >タイポグラフィ > フォント.

ウェブサイトから Google 書体のインスタンスをすべて削除したら、サイト構成から Google 書体を削除できます。

1. アクセス サイト構成 > 書体 タブ > Google書体 
2. クリック 消去 ウェブサイトから削除したいGoogle書体の横にある
3. 変更を有効にするには、Webサイトを再公開してください。 

ウェブサイトが Google Typefaces API を読み込んでいるかどうかを確認する方法 

すべての Google 書体を削除した後、Web サイトで Google 書体 API が読み込まれなくなったことを確認する必要があります。GDPR 準拠を保証することを目的とする場合、これは特に重要です。

ウェブサイトが Google Chrome で Google Typefaces API を読み込んでいるかどうかを確認するには:

1. 公開したウェブサイトにアクセスする 
2. ページの任意の場所を右クリックし、「検査」を選択します。 
3. アクセス 通信網 タブ
4. ページを更新
5. 検査する 通信網 タブをクリックして ウェブフォント ファイル 

もしあなたが ウェブフォント ファイルが表示されない場合、ウェブサイトはGoogle Typefaces APIスクリプトをロードしており、ウェブサイトからすべてのGoogle書体を削除するには、前述の手順を繰り返す必要があります。 ウェブフォント ネットワーク タブにファイルがない場合、Web サイトは Google Typefaces API を要求または読み込みませんでした。