フォントの指定について
フォントの指定は可能です。
何も指定していない場合、KARTEのアクションテンプレートに反映されるフォントについては、サイト側のフォント設定が反映される仕様です。
KARTE提供テンプレートは、フォントの指定をしていないため、基本的にはサイト側のフォント設定が反映されますが、もしサイト側でフォント指定をしていない場合はカスタマイズにて接客アクション毎にフォントの指定をする必要があります。
フォントを変更・あえて指定したい場合は、サイト側でフォントを読み込み、KARTE内のアクション編集画面</>カスタマイズ「CSS」にて該当のフォントを指定してください。
CSSの例：
font-family: 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
ヒラギノ角ゴシック、メイリオ、MS Pゴシックなどを優先順位付きで指定することができます。
なお、サイトのフォントが正しく反映されているかは、エディタ画面のプレビューではなくテスト配信で確認していただくことを推奨します。
フレックスエディタでのフォント指定について
フレックスエディタで指定できるフォントは「Webフォント」と呼ばれるもので、
ブラウザやOSに依存せず共通で利用できるフォントがラインナップされています。
指定されたWebフォントは自動的に読み込まれ、iOS / Android / PC など環境を問わず統一した表示が可能です。
- OSごとに標準フォント（例：メイリオ、ヒラギノ、Robotoなど）は異なるため、完全に同一の見た目にはなりません
- Webフォントを利用する場合、Flexエディタが自動で読み込みを行うため、各デバイスで統一された見た目が再現できます
ブランドスタイル設定でデバイス標準フォントを指定する
デバイス標準フォントを利用する場合は、ブランドスタイル設定から指定しておくことが可能です。
上から優先順でフォントが適用されます。
詳細はこちらをご確認ください：
👉 ブランドスタイル設定 > フォント設定とは？
OS標準フォントを利用したい場合
OS標準フォントを指定したい場合は、ブランドスタイル設定やCSSで直接指定することも可能です。
この場合は、CSSの一般的なルールに従い、上から順に利用可能なフォントが存在すればそのフォントが適用され、存在しない場合はOSのデフォルトフォントにフォールバックします。
CSSの例：
font-family: 'Helvetica', 'Hiragino Sans', 'Roboto', 'Noto Sans CJK JP', sans-serif
Helvetica、Hiragino Sans、Roboto、Noto Sans CJK JP、sans-serif の順に指定することで、
iOSではHelvetica、AndroidではRobotoが適用されます。
存在しないフォントは順にスキップされ、次の指定またはOS標準フォントが使われます。
OSごとのフォントを明示的に分けたい場合
CSSのみでOSごとにフォントを完全に分けて指定することはできません。
厳密に分けたい場合は、共通コード設定などで条件分岐の実装が必要です。