アメブロのブログの文字フォントを変更する方法。コピペで解決CSS貼り付け。

こんにちは。YOSHITAKA(@YOSHITA19704216)です。

 

初心者
アメブロのフォントの種類で個性を出す事はできますか?

よしたか
できますよ。

アメブロのフォントを変えるにはCSSを触ると良いです。

HTMLで少しだけ変えるのも変なので全体を変えてみるといいでしょう。

この記事を読むことで
  • アメブロのフォントを変える方法がわかります。
  • アメブロのCSSでコピペの方法ががわかります。

アメブロのフォントの種類を変える方法

Webのフォントの基本はゴシック体

アメブロには

ゴシック体フォントが使われています。

ブログに限らず

ホームページ等でも

ゴシックフォントが基本になっています。

 

なぜなら・・・

 

インターネット上で正しく認識されるフォントは少ないからです。

 

 

自分のブログをカスタマイズしてみたいと思う方は

「文字フォントも個性的なものに変えてみたい」と思われる方もいると思います。

 

 

認識されないフォントが使われていた場合、

強制的に別の認識できるフォントに変更されます。

(アメブロでも複数のフォントが指定されています。)

 

 

お気に入りのフォントがあったとしても

あまり奇抜なフォントは使わない方がよいでしょう。

 

 

特にWordなどででているフリーフォントのイメージを持って

色々と変えれると思っているとほぼほぼできませんので

あまりWebで文字を変えようと期待しない方が良いでしょう。

アメブロの基本的なフォント

CSSにはすでにフォント設定の記述がされています。

font-familyに書いてあるのがフォントの種類です。

例えば以下のように書き換えます。

font-family:”MS Pゴシック”, Osaka, “ヒラギノ角ゴ Pro W3”, Arial, Helvetica;

↓ ↓

font-family:’メイリオ’;

上記の表記に変更すると

このブログのフォントになります。

CSSコード コピペ

body{
margin:0;
padding:0;
text-align:center;
font-family:”MS Pゴシック”, Osaka, “ヒラギノ角ゴ Pro W3”, Arial, Helvetica;
}

フォントの種類を検索する

フォントの種類は様々あります。

 

もし自分らしいフォントを探したい場合は

こういったサイトで確認してみてください。

CSSの簡単な説明

CSSコード解説

  •  font-family:”MS Pゴシック”, Osaka, “ヒラギノ角ゴ Pro W3”, Arial, Helvetica;
    ⇒全部フォントの名称です。

※アメブロは複数のフォントを指定していますので

一応ルールだけ簡単に掲載しておきます。

 

複数のフォントを指定する時のルールです。

  • 優先度の高いものから先に記述する
  • フォント名とフォント名の間は、「,」(カンマ)で区切る
  • フォント名にスペースが含まれる場合は、「’」(クォーテーション)か「”」(ダブルクォーテーション)で囲む
  • 滑り止めの総称ファミリーを最後に記述する

まとめ

今日はアメブロのフォントの種類の変更方法について書きました。

 

無料ブログから色々カスタマイズしたい人は

お試しでフォントを変更にチャレンジしてみても良いと思いますよ(^^)

 

 

メルマガも発行していますのでぜひ登録くださいね(^^)

あなたは「Web集客」に限界を感じていませんか?

サイトをただ作るだけで満足ですか?

あなたのサービスやコンテンツはとっても有益なものがたくさんあります。

良いコンテンツも埋もれてしまっては全く意味がありません。

正しい知識と実践で、SEO対策はもちろん、ユーザビリティーを考えたサイトを作りませんか?

私と歩めばWebマーケティング知識とWordPressスキルが定着し、サイト回遊率、再訪問がアップします。

しかも、これだけでは終わりません!!

その先の「攻めのメディア」と組み合わせ、あなたのサービスを広めて売上を伸ばしていきます。

サイトを育てて、長い間愛されることのできるWordPressサイトからの集客導線(ゴールデンルート)を一緒に作りませんか?

↓ ↓ ↓ ↓ ↓ ↓ 

おすすめの記事