MODI|Style 設定MODI tiny Manual - Customize Basis Style setting

2023.04.28
2023.05.10

背景設定

背景や文字の基本設定を行います。

背景色設定

背景の色を「色を選択」から選択します。
HTML カラーコード入力又はカラーピッカーから抽出してください。
デフォルトカラーは「#F7F7F7」です。

背景画像登録

背景に画像を利用したい場合に登録します。
「画像を選択」から「メディア」でメディアライブラリからアップロード済みの画像、または新たに画像をアップロードして登録してください。

※現在の背景画像の設定は位置は固定(background-attachment:fixed)、サイズはウィンドウサイズに合わせて拡大縮小し必要に応じて引き伸ばす(background-size:cover)設定になっています。

ロゴ設定

ロゴがテキストの場合の文字色を設定します。
ヘッダー、フッターに表示するロゴテキストの色をそれぞれ選択できます。
HTML カラーコード入力又はカラーピッカーから抽出してください。

テーマ色設定

サイトの印象に関わる色、主要な色(primary color)と副次色(secoundary color)を設定します。

サイトテーマ主要色登録

「サイトテーマ主要色登録」では、グローバルメニュー展開ボタン(画面右上)、一覧から記事ページへリンクする「More」ボタン、SNS 等のアイコン、メニューに表示されるお問い合わせボタン、他に適用されます。
HTML カラーコード入力又はカラーピッカーから抽出してください。

サイトテーマ副次色登録

サイトの副次色を登録します。
HTML カラーコード入力又はカラーピッカーから抽出してください。
現在(2023年5月)はフッターの背景色に適用されます。

文字・フォーカス色設定

基本、強調、リンク、ホバー(リンクテキストにカーソルが重なったとき)、訪問済(一度訪れたリンク)、活性化(アクティブ、クリックして離されるまで)の各文字色とフォームでフォーカス(選択されている状態)の色を設定します。

各初期値は下記になります。

基本#404040
強調#000000
リンク#0070B7
ホバー#EDAD0B
訪問済#0095B7
活性化#EDAD0B
フォーカス#FCF1D3

見出し色設定

h2〜h6 までの見出しの色を設定します。
h2 は文字色と装飾(左の縦線)、h3 は文字色と背景(設定した色の 10%の透明度)、h4〜h6 は文字色を設定します。
初期値は#000000 です。