STUDIOでフォントを管理・適用する
STUDIOでは全てのプランで FONTPLUS 、Google Fonts 、TypeSquare(モリサワ)のフォントが利用できます。これらフォントは、フォントリストに追加して使用します。
💡 現在、フォントのアップロードやインポートには対応していません。STUDIO上で提供するフォントをご利用ください。
フォントリストとは
フォントリストは、プロジェクト内で利用できるフォントを管理するためのリストで、エディタ左側のスタイルパネル内に格納されています。
リスト内のフォントはドラッグで並べ替えができ、リストの1番上にあるフォントがプロジェクト内でのデフォルトフォントとなります。新しくテキスト・リッチテキストボックスをページに配置すると、このデフォルトフォントが自動的に適用されます。
フォントの追加
フォントをテキストに適用するには、まずフォントリストへ追加します。
1. フォントリスト右上の「+」をクリック
2. フォントの選択
フォントサービスを選び、フォント名で検索するかスタイルや言語で絞り込みます。フォントをクリックすると自動的にフォントリストへ追加されます。
フォントサービスによって絞り込み条件は異なりますが、スタイルは複数選択、言語は単一選択できます。
FONTPLUS提供の全書体は、以下のリストからご確認いただけます。
フォントの適用
テキストボックスを選択した状態で、画面上部のテキストタブ > フォントから任意のフォントを選びます。
フォントの置換
適用中のフォントおよびサブフォントは、後から別のフォントへ一括置換できます。
1. フォント詳細を開く
フォントリストからフォントを選択し、詳細を開きます。
2. 置き換えフォントの選択
ホバーすると表示される置き換えアイコンをクリックし、置き換えたいフォントを選択します。選択後、すぐにフォントが自動的に置き換えられます。公開中のサイトへ変更を反映させるには、サイトの更新が必要です。
フォントファミリー名の変更
プロジェクト内での管理に便利なフォントファミリー名は、フォント詳細画面で編集します。「見出し1」「本文」のような名称は管理がしやすくおすすめです。
使用箇所の確認
フォントリスト内のフォントにホバーすると、使用箇所がハイライト表示されます。
さらにフォント詳細の使用状況から、ページごとの使用数が確認できます。クリックすると、そのページへ移動します。
フォントの削除
フォントリストからフォントをクリックし、詳細ページを開きます。パネル右上の3点メニューからフォントが削除できます。
もし、そのフォントを使用しているページがある場合は、「フォントを置き換えて削除」と表示されます。置き換え先のフォントを選んで、フォントを削除します。
サブフォントの追加
フォントにはサブフォントが追加できます。フォント詳細を開き「サブフォントを追加」から任意のフォントを追加します。
サブフォントはドラッグで並び替えができ、この中で上にあるものから順番に適用されます。 例えば次の順番でフォントを追加し並べた場合、
かなフォント
英語フォント
日本語フォント
ひらがな・句読点などは(1)、半角英数字は(2)、それ以外の漢字・全角記号は(3)のフォントが反映されます。つまりサブフォントを使えば、和欧混植の「複合フォント」を実現できます。
注意点
FONTPLUSは、1プロジェクトにつき最大50フォントファミリーの追加ができます。
フリーフォント