STUDIOでフォントを管理・適用する

STUDIOでは全てのプランで FONTPLUS 、Google Fonts 、TypeSquare（モリサワ）のフォントが利用できます。これらフォントは、フォントリストに追加して使用します。

フォントリストは、プロジェクト内で利用できるフォントを管理するためのリストで、エディタ左側のスタイルパネル内に格納されています。

リスト内のフォントはドラッグで並べ替えができ、リストの1番上にあるフォントがプロジェクト内でのデフォルトフォントとなります。新しくテキスト・リッチテキストボックスをページに配置すると、このデフォルトフォントが自動的に適用されます。

フォントをテキストに適用するには、まずフォントリストへ追加します。

フォントサービスを選び、フォント名で検索するかスタイルや言語で絞り込みます。フォントをクリックすると自動的にフォントリストへ追加されます。

フォントサービスによって絞り込み条件は異なりますが、スタイルは複数選択、言語は単一選択できます。

FONTPLUS提供の全書体は、以下のリストからご確認いただけます。

テキストボックスを選択した状態で、画面上部のテキストタブ > フォントから任意のフォントを選びます。

適用中のフォントおよびサブフォントは、後から別のフォントへ一括置換できます。

フォントリストからフォントを選択し、詳細を開きます。

ホバーすると表示される置き換えアイコンをクリックし、置き換えたいフォントを選択します。選択後、すぐにフォントが自動的に置き換えられます。公開中のサイトへ変更を反映させるには、サイトの更新が必要です。

プロジェクト内での管理に便利なフォントファミリー名は、フォント詳細画面で編集します。「見出し１」「本文」のような名称は管理がしやすくおすすめです。

フォントリスト内のフォントにホバーすると、使用箇所がハイライト表示されます。

さらにフォント詳細の使用状況から、ページごとの使用数が確認できます。クリックすると、そのページへ移動します。

フォントリストからフォントをクリックし、詳細ページを開きます。パネル右上の3点メニューからフォントが削除できます。

もし、そのフォントを使用しているページがある場合は、「フォントを置き換えて削除」と表示されます。置き換え先のフォントを選んで、フォントを削除します。

フォントにはサブフォントが追加できます。フォント詳細を開き「サブフォントを追加」から任意のフォントを追加します。

サブフォントはドラッグで並び替えができ、この中で上にあるものから順番に適用されます。 例えば次の順番でフォントを追加し並べた場合、

ひらがな・句読点などは（１）、半角英数字は（２）、それ以外の漢字・全角記号は（３）のフォントが反映されます。つまりサブフォントを使えば、和欧混植の「複合フォント」を実現できます。

フリーフォント