最近見た物件お気に入り保存した条件
06-0000-1234

年中無休（水曜定休）

フォントを設定しよう

当記事では、フォントの設定方法をご紹介いたします。

各所のフォントタイプやフォントサイズによって、サイトの印象は変わります。場合によっては可読性にも影響します。基本的には初期値のままでも問題ないですが、設定内容を確認しておきましょう。

目次

設定箇所

フォントは、ダッシュボード内のTCDテーマ > 基本設定 > フォントより設定します。

使い方

  1. 基本設定「フォント」でフォントセットを登録しておく。（3タイプ+ロゴ用フォントを登録可）
  2. フォントを設定できる各所でフォントセットを呼び出す。

フォントセットを登録する

各フォントセットは、このようなUIで見た目を確認しながら設定できます。

フォントタイプを「システムフォント」か「Webフォント」から選ぶことで、設定項目が変化します。設定できるフォントの一覧は以下の記事をご覧ください。
>> システムフォント
>> Webフォント

システムフォント

用意されたフォントの中から和文・欧文で使用するフォントを一つ選択します。

システムフォントとは
パソコンやスマートフォンなどの端末にインストールされているフォントです。OSバージョンやデバイスによっては代替フォントが表示されます。端末によって微妙に異なる場合があるということです。
和文フォント ・ゴシック体
・明朝体
・教科書体
欧文フォント

サンセリフ体：

・Arial：Win Mac iOS – 最もベーシックなフォント
・Optima：Mac iOS – 美しいフォルム（※WinではSegoe UI）
・Helvetica：Mac iOS – バランスのとれたフォント（※WinではArial）
・Avenir：Mac iOS – モダンで直線的（※WinではCalibri）
・Verdana：Win Mac iOS – 大きな文字間隔と広めの字形
・Tahoma：Win Mac – よりコンパクトな字形

セリフ体：

・Palatino：Win Mac iOS – 古典的なセリフフォント
・Times New Roman：Win Mac iOS – 最もベーシックなフォント
・Georgia：Win Mac iOS – 洋書風
・Didot：Mac – 上品で華奢（※WinではTimes New Roman）
・Baskerville：Mac – 細さの緩急大きめ（※WinではGeorgiaで代用）
・Rockwell：Win Mac – タイプライター風（太め）

スクリプト体：

・Zapfino：Mac iOS – エレガントで優雅（※WinではInk Free）

Webフォント

Webフォントを選択した場合、次のフォントから設定できます。

和文フォント ・Noto Sans JP
・Zen Kaku Gothic New
・Noto Serif JP
・Zen Old Micho
・Klee One
欧文フォント ・Roboto
・Hind Madurai
Webフォントとは
ウェブサイトがインターネット経由でサーバーからフォントデータを読み込み、ユーザーのデバイスにインストールされていないフォントを表示する技術です。どのデバイス環境からでも同じフォントを表示できます。

フォントセットを呼び出す

登録したフォントセットを各所で呼び出します。↓は基本設定 > フォントの設定画面です。

基本設定内では以下の箇所のフォント・文字サイズを設定します。

ベースフォント サイト全体のベースとなるフォントタイプ
アーカイブタイトル 各ページヘッダーのタイトルのフォントタイプ、フォントサイズ（PC/スマホ）
記事タイトル 記事詳細ページのタイトルのフォントタイプ、フォントサイズ（PC/スマホ）

記事本文の文字サイズはTCDクラシックエディタプラグインの「基本設定」で設定します。

アーカイブタイトルと記事タイトルについては、PC/スマホ別に設定可能です。極端に大きすぎないか（小さ過ぎないか）をPCとスマホで確認しておきましょう。

問題なければ、フォントの設定は完了です。続いて「ロゴ」の設定に進みましょう。

ロゴの設定に進む

この記事は役に立ちましたか？
もし参考になりましたら、下記のボタンで教えてください。

入社3年目の瀧澤です。大阪だけでなく神戸や京都、奈良に和歌山と、関西エリアを幅広くご案内いたします。皆様のご来店を心よりお待ちしております。

関連記事

目次