ブログ関連記事

サイトのデザイン設定をする【AFFINGER】初期設定

サイトのデザインを設定します。

ヘッダー部分に色や全体のレイアウトを決めていきましょう。

 

 

前回の記事

トップページのSEO設定【AFFINGER】初期設定

 

サイト全体の設定

「ダッシュボード」⇒「AFIINGER管理」⇒「全体設定」

カラーパターンとデザインパターンを決めます。

ご自身のイメージのカラーを決めたら。

 

左上のブログタイトルへカーソルを持っていきます。

「サイトを表示」と出るので右クリックをして「新しいタブで開く」を押すと、

右横にプレビュー画面のタブが出来ます。

サイトカラーがどんな感じになったか確認しましょう!!

 

私の場合は、

カラーパターン:青(やさしい)

デザインパターン:フラット(シンプル)

となっています。

 

 

イメージした色になっていれば、「save」で完成です。

これで、大まかな色は決まりました。

 

これは、基本のカラーなので。

もっと自分らしいカラーにしたい時の設定方法を次に行って行きます。

 

更に細かくカスタマイズしたい時。

 

細かいカラー設定

「外観」⇒「カスタマイズ」

 

「全体カラー設定」をクリックします。

 

「全体カラー設定」で全体のカラーを決めます。

 

キーカラーのところで好みの色を選んでいきます。

この時にメニューバーの下の方にある。

 

 

簡単設定を使用する

 

ここを使用しないにチェックが入れてあると色がかわりません。

なので、

上記の3つのどれかにしてください。

 

色を選択して好きな色にします。

ここでは、右隣りにプレビュー画面がでるのどの部分がどんな色に変わったかを確認出来ます。

 

 

今は少し濃い色に変更した為このように変わりました。

 

 

下のメインカラー・サブカラー・テキストなども変更して自身のオリジナルにカスタマイズしてみて下さい。

 

全体のカラーが決まったら右上のボタンを押せば。

設定は完了です。

 

 

注意ポイント

メニューバーの一番下にある。リセットを押すと今まで設定してきた部分が初期設定に戻ってしまいますので、注意してください!!

 

 

補足

赤枠の部分はカラーコードなので。

他の箇所も同じ色にしたい場合は。

このカラーコードをコピーして貼り付けすると同じ色にすることが出来ます!

 

 

まとめ

今回はカラー設定をしていきました。

カラーが変わるとブログ全体のイメージがすごく変わってくるので。

視覚的にもとても重要な箇所です。

他のサイトなどを見ながら、自身のブログのテーマに沿った色の設定が出来るといいと思います。

 

-ブログ関連記事