はてなダイアリーでGoogle Web Fontsを試す
Google Web Fonts!!
はてなダイアリーは、今のところ多くのWeb Fontサービスが使えないのですが、Google Web Fontsは、無理やり使う事ができました。このブログでも一部使ってみています。
使い方
- Google Web Fontsから使いたいフォントを選択
- ページ中の「Use this font」を選択
- ページ内のCSSファイルのパスをコピー
- はてなダイアリーの管理ページ→「デザイン」→「詳細デザイン」→「スタイルシート」欄で以下のようにCSSを@importで指定
@import "http://fonts.googleapis.com/css?family=Lobster";
- 上の@import指定をした、下の行あたりに、フォントを変えたい部分にfont-familyを指定
@import "http://fonts.googleapis.com/css?family=Lobster"; h1 { font-family: "Lobster",serif; }
以上です。
SVG非対応など、ブラウザによっては表示されませんが、ブログタイトル(h1)、日付(h2.date)、モジュールタイトル(.hatena-moduletitle)なんかに、ちょっとしたアクセント程度で使えそうです。ただし、Web Fontに限ったことじゃありませんが、欧文指定していて、利用者が和文に変えた場合、文字サイズが随分大きくなり不恰好になるなどが予想されるので、公開デザインにする時など、配布の際は、その辺も認識した上行った方がよさそうです。
※ちなみにはてなグループでは、@importが使えず、無理っぽかったです。