初心者でも出来るホームページの作り方ガイド

記事の内容は動作や機能を100%保障するものではございません。悪しからずご了承下さいませ。※カスタマイズは必ずバックアップの上、自己責任にて行って下さい。

メモ

このサイトは「micata2」「AFFINGER4」の総合マニュアルサイトになっています

テーマカスタマイザーについて

2016-08-22_162831

さぁ、そろそろホームページを自分好みのカラーにしたいんだけど?

それではテーマカスタマイザーという機能を紹介します。その前に少し、色についても知識があると良いですね。

カスタマイザー機能を使用して様々なカラーを変更できます。まずは管理画面にてカスタマイザーが「ON」になっているか確認してください。

2016-08-12_105057

デフォルトカラーについて

何もカラーを設定していない状態だとデフォルトカラーで表示されます。

colors

注意事項(必ずお読みください)

  • カスタマイザーのカラーの値の出力を分けたため、上手く値が反映されずカスタマイザープレビューと実際のカラーが異なる場合がございます。その場合はカスタマイザーページのブラウザを更新して下さい。それでも反映されない場合は一度、他のカラーを選択して改めてカラーを設定保存して下さい。
  • グラデーションは「背景色」「背景色上部」の両方を指定する必要があります(旧ブラウザ非対応)
  • 背景画像の位置は上下左右ともに指定してください。

カスタマイザーによるカラー変更適応

2016-01-11_16h19_34

①「外観」より②「カスタマイズ」を選択します

2016-08-17_165652

上図がカスタマイザーの基本画面です。

カラーを簡単に設定する「全体カラー設定」

2016-08-17_165746

当テーマではカスタマイザーでカラーを細かく指定するのが面倒だという場合の為に「基本3色」を決定する事で自動的に規定のカラーが変更されるようになっています。

2016-08-17_165836

(1)全体的に反映

設定した3色を強制反映します。一部カラーは解除しない限り反映されません。

反映箇所のカスタマイザーには「*」マークが付いています。

(2)メニューのみに反映

設定した3色をメニューのみに強制反映します。

(3)初期値として設定

2016-08-17_170326

設定した3色を既定カラーの「初期値」として設定します。

「初期値」とはカラーの値をクリアした時に設定される値です。

リセット

設定を解除します。

カスタマイザーで出来る事

hengenzizai

その他、カスタマイザーではカラーのみでなく

  • ロゴ画像の設定
  • 背景画像の登録
  • ヘッダー画像の登録
  • レイアウトの変更

などは様々な事ができます。
詳細は個別の説明を確認して下さい。

※日本語ドメインの場合、カスタマイザー内でのページ遷移が上手く機能しませんのでページ毎にカスタマイザーを設定して下さい

背景レイヤーの図

haikeiare

カラーについて知っておきたい事

カラーは基本的にほとんどがグラデーションで指定します。下部には濃いめのカラーを、上部には同じ色のトーンを抑えた色(やや薄くした色)を指定すると見栄えが良くなります。

【参考サイト】

2016-01-11_165349

http://www.colorhexa.com/

上サイトのフォームに基本にしたいカラーコードを入力して検索すると様々なパターンが自動で表示されます。

2016-01-11_165318①が基準の色なので②あたりの薄い色を入れるときれいに仕上がります。

基準色のカラーがわからない場合は以下のサイトがおすすめです

2016-01-11_165905

http://www.materialui.co/colors

希望の色をクリックするだけでカラーコード(#ではじまる7文字の英字)がコピー出来ます。

※一部の旧ブラウザではグラデーションは反映されずに「背景色下」の1色となります。

人気記事

kawaii 1

以前にWordPressテーマ「STINGER PLUS+」を公開した際に作成したサンプルサイトが「可愛い!」と特に女性の方から非常に好評をいただきました。 今回の参考サンプルサイト ただ現在「STI ...

2

ホームページを今まで沢山作ってきましたが、リニューアル案件以外の方はやはり「予算重視」である場合が多く、こちらの言う「大切」な事とか「重要な事」なんていう意見は「わかっているけど・・・」とはいうものの ...

tonkotu 3

今回はまず、ベースとなる「ホームページのタイトル」の考え方と下層ページコンテンツに何を作るべきかを考えていきます。 「タイトル設定」はまず最初に行うべき事であり、またホームページの命運を分ける最重要項 ...

投稿日:2016年1月8日 更新日:

Copyright© ホームページ作成なら無料テンプレートのmicata(ミカタ) , 2016 AllRights Reserved Powered by AFFINGER4.