サーバーについて > Webフォント設定について >HTML記述形式でのご利用

• Webフォントに関する「よくある質問」

• 機能の仕様などについては、「サービス > Webフォント」をご参照ください。
• WordPressでご利用の場合は、「マニュアル > Webフォント設定について > WordPressプラグインでのご利用」をご参照ください。

Webフォントの設定手順

1.「Webフォント設定」をクリック

サーバー管理ツールにログインし、「Webフォント設定」をクリックします。

2.設定するドメインを選択

「Webフォント設定追加」のプルダウンメニューより設定するドメインを選択し「確認画面」ボタンをクリックし、次の画面で「確定する」ボタンをクリックしてください。

「Webフォント設定」画面に先ほど設定したドメインが表示されていれば設定完了です。

ドメインの設定について

Webフォントを設定できるドメインは初期ドメイン、独自ドメインの中から3つまでです。
また、画面上の「削除する」ボタンをクリックすると、Webフォント設定が解除され、順次ブラウザ標準のフォント表示に戻ります。

3.HTMLを編集

<script type="text/javascript" src="//webfonts.xserver.jp/js/xserver.js"></script>

4.CSSを編集

<h1>Webフォント活用サイト</h1>

h1{ font-family: "新ゴ R"; }

h1{ font-family: "新ゴ R" , "メイリオ" , Meiryo , "ヒラギノ角ゴPro W3" , "Hiragino Kaku Gothic Pro" , "ＭＳ Ｐゴシック" , sans-serif; }

<p>Webフォントは<b>美しい！</b></p>

p{ font-family: "新ゴ R"; }
b{ font-family: "新ゴ B"; }

Webフォントの適用を解除する方法について

Webフォントの適用を解除するには、以下の作業を順に行ってください。

1. HTMLファイルとCSSファイルよりWebフォントの適用時に追加した記述を削除します。
   その際、HTMLファイルより下記のJavaScriptファイルの記述も必ず削除してください。
   

   <script type="text/javascript" src="//webfonts.xserver.jp/js/xserver.js"></script>

2. 「サーバー管理ツール>」⇒「Webフォント設定」よりドメインの登録を解除してください。

以上の作業を行った後、Webフォントの適用が外れているかご確認ください。

各WebフォントのCSS指定用コード

下記を参考にWebフォントの設定を行ってください。
また、日本語で指定する場合は""(ダブルクォート)で囲む必要があります。

下記は「リュウミン R-KL」を適用した場合の例です。

/* 日本語で指定する場合 */
p{ font-family: "リュウミン R-KL"; }

/* 英語で指定する場合 */
p{ font-family: Ryumin Regular KL; }

それぞれのfont-family(Webフォントを指定するスタイル)は下記の通りです。
書体の見本を確認したい場合は「書体見本一覧」をご参照下さい。

※下記表の「日本語で記述」または「英語で記述」どちらか一方をcssファイルに記述して下さい。