手書き文字のようなフォントをブログで使いたいのですがどうすればいいのでしょうか？

http://m-namba.hatenablog.com/entry/2015/02/03/2 …

Ｇｏｏｇｌｅで検索していてたまたまヒットした個人の方のブログを読んで、

フォントが手書き風の文字でした。

このように手書きフォントを使ってブログを書くにはどうすればいいのでしょうか？

あと、chromeで普通にアクセスして見ただけなのですが、なぜ私の
ＰＣで見ることができたのでしょうか？

特に、フォントを特別にインストールしていないです、そういう環境でも
普通につかえるのでしょうか？教えてくださいよろしくお願いします。

No.1 ベストアンサー 回答者： torayoshi 回答日時： 2015/12/12 19:29

「webフォント」といわれるものです。

提示された参考サイトでは「ふい字」というフォントが使われてます。
「webフォント」はけっこうハードル高めです。
これをブログで使うには、利用してるブログでテンプレート（HTML,CSS）を編集出来なければなりません。
逆に言えば、テンプレートの編集が出来ないブログでは使えないということです。

フォントの指定はCSSで、
@font-face {
font-family: 'フォント名';
src: url('フォントファイルまでのパス')・・・
みたいな感じで指定します。
表示させたいフォントファイルもアップロードする必要があります。
また、ブラウザ依存なので、フォント形式もそれぞれのブラウザに対応した形式を用意（変換）しなければなりません。
【webフォント用変換ジェネレータツールサイト】
http://zxcvbnmnbvcxz.com/convert-to-webfont/

この回答へのお礼

回答ありがとうございます。

Ｇｏｏｇｌｅで検索したら、

日本語フリーフォントの「ふい字」をWEBフォントで活用しよう！
http://customtemplate.blog112.fc2.com/blog-entry …

というブログがあり、

Dropboxにアップロードしてあるよう？？です。

/*
WEBフォントで「ふい字(HuiFontP109)」 ver130717
http://customtemplate.blog112.fc2.com/blog-entry …
*/
@font-face{
font-family:'HuiFontP109';
src:url('https://dl.dropboxusercontent.com/s/6snqvg654tir …
src:url('https://dl.dropboxusercontent.com/s/6snqvg654tir … format('embedded-opentype'),
url('https://dl.dropboxusercontent.com/s/7pscemjdvt0w … format('woff'),
url('https://dl.dropboxusercontent.com/s/0w9uuopxrns8 … format('truetype'),
url('https://dl.dropboxusercontent.com/s/xnnsbxtz8o6d … format('svg');
}
body,input,textarea{font-family:'HuiFontP109';font-size:16px;}

ブログにあった、上記のコードを編集したらできました。

お礼日時：2015/12/12 21:53