AFFINGER5

★ 【AFFINGER5】サイト名とキャッチフレーズのセンタリングと、フォントの大きさを変える方法





サイト名とキャッチフレーズの場所を左寄せにするのかセンタリングにするのかは迷います。

が!

センタリングは、センタリングで味があるので良いのです、

がっ!?

文字が迫力負けしますので、一緒に文字のサイズを変える方法を紹介します。



AFFINGER5 ご購入はこちら



サイト名とフォントサイズを変えたイメージ


サイト名(とキャッチフレーズ)をセンタリングして、フォントサイズを多少変えてみます。



赤枠の部分が変えた部分ですが、


良くもあり悪くもあり(笑)


感覚に寄るかもしれませんが、お好みで変えていただければと思います。


センタリングする方法



WordPress 管理画面で [AFFINGER5 管理]→[ヘッダー] を選択して、[H ヘッダー設定] の画面から、次のチェックを付けます。


  • ヘッダーを分割しない
  • ヘッダーエリアをセンタリング

[ヘッダーを分割しない] をチェックして保存、画面がリフレッシュしたら [ヘッダーエリアをセンタリング] がチェックできますので、チェックして保存します。


サイト名とキャッチフレーズのフォントサイズを変える方法


AFFINGER5 では、サイト名とキャッチフレーズのフォントサイズが固定なので、別途 CSS を定義して変更します。



WordPress の管理画面にて [外観]→[カスタマイズ]→[追加CSS] で、以下のコードを追加します。


header .sitename {
    font-size: 24px;
}

header .descr{
    font-weight: bold;
}


クラス [.sitename] は、[サイト名] に対して反映し、[font-size: 24px;] でフォントサイズを変えています。[24 px] を任意の数字に変えて利用してください。

クラス [.descr] は、「キャッチフレーズ] に対して反映し、[font-weight: bold] でフォントをボールドにしています。


完成です!


まとめ


サイト名とキャッチフレーズをセンタリングしてフォントサイズを変える方法です。


  • センタリングは AFFINGER5 で設定します
  • フォントサイズは 追加CSS で設定します

かっこよく魅せるサイトを作りたいですね!


Enjoy!センタリングと左寄せとどっちがカッコイイかで、はや3日ぐらい悩み中(笑)








Presented By Irojiro Haraguro .Com

ブログランキング・にほんブログ村へ