Bloggerでメイリオフォントを設定

Bloggerテンプレートをカスタマイズします

このブログは、Bloggerで作成しています。見た目は全く度外視しており、一番シンプルなテンプレートでカスタマイズしていない状態です。デフォルトのテンプレートは、レスポンシブでスマホからも見ることができます。それなりにいいものなのですが、細かいところを少しずつカスタマイズしていき、自分だけのブログにしていこうと思います。




現在の状況はこちら。





まず、一番はじめに変えたいなと思ったのは、フォントです。初期状態のフォントはそれなりに見やすく普通なのですが、最近流行のおしゃれなフォントにしたいものです。調べてみると、最近は「メイリオ」というフォントを使ったサイトが多いようですね。

フォントを見てみると読みやすいしいい感じです。早速、Bloggerにてメイリオに変更してみます。

テンプレートから、カスタマイズを選択。

メイリオフォントがない・・・

上級者向けの設定>>ブログのタイトルを選択し、フォントを指定しようとしましたが、メイリオフォントが選択肢にありません・・・



Bloggerでは選択肢にメイリオがないようです。そこで、ネットで検索していると、ぴったりの情報が。


こちらによると、CSSを追加するだけとのこと。このブログはタイトルも日本語なので、全部のフォントをメイリオにします。というわけで、以下のCSSを追加します。

上級者向けの設定>>CSSを追加で変更。


* { font-family: "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro", "MS Pゴシック", "MS PGothic", Arial, sans-serif; }

h1.title { font-family: "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro", "MS Pゴシック", "MS PGothic", Arial, sans-serif; }

h2 { font-family: "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro", "MS Pゴシック", "MS PGothic", Arial, sans-serif; }


CSS追加後のブログはこんな感じ




いい感じにフォントが変わりました。フォントだけでこんなに雰囲気が変わるのですねえ。

ちなみに、このメイリオというフォントはWindows Vista以降に標準インストールされているフォントのようで、Windows XPでは、別途インストールしないと表示されません。そのときは、二番目以降に指定されているフォントが表示されます。まあ、Windows XP以前のPCは少ないので由とします。

文章だけではなく、見た目も少しずつよくしていこうと思います。その経過も記録として残していきます。

コメント

このブログの人気の投稿

SEから経理へ転職できるのか?

社内SEになって後悔しがちな3つのこと

受託型システムエンジニア(SIer)から社内SEへの転職(5)