賢威6.1でフッター部分のリンク色、背景色、見出しをカスタムする方法
賢威6.1のフッター部分ですが、リンク色や背景色など別で設定されており、
全体の設定とは別で設定する必要がありますので、説明していこうと思います。
フッターのリンク色を変更する方法
それでは、フッター部分のカスタム方法のついて説明していきます。
フッターの設定については、スタートアップガイドで解説していますので、
そちらを参考にしてください。
1.外観からテーマ編集を開き「design.css」を開きます。
2.ソースが表示されますので中央よりやや下にある「フッター」項目を探してください。
3.下記ソースの#○○○部分を変更することで、リンク色が変更できます。
#footer a:link,
#footer a:visited{ color: #00b2d5; } ←通常のリンク色
#footer a:hover,
#footer a:active{ color: #6f8d0d; } ←マウスを置いたときのリンク色
見出し背景色を変更する方法
次に、見出しの背景色を変更する方法を説明して行きます。
1.同じくテーマ編集を開き「design.css」を開きます。
2.フッターには二箇所の見出しがあり、
左側「アドレス部」と右側の「メニュー部」に分かれています。
下記ソースを参考に赤字の部分を変更してください。
#footer h3{
margin-bottom: 1em;
padding: 0.5em 1em;
background-color: #fff; ←メニュー部の見出し背景
color: #333;
font-weight: bold;
border-radius: 14px;
-webkit-border-radius: 14px;
-moz-border-radius: 14px;
}#footer .area01 h3{ background-color: #ccc; }←アドレス部の見出し背景
フッターの背景色を変更する
次にフッターの背景色を変更する方法を説明して行きます。
フッターの背景は、賢威のテンプレートメーカーでも変更可能でしたが、
設定後もテーマ編集から変更することが可能です。
1.同じくテーマ編集を開き「design.css」を開きます。
2.下記ソースの赤字の部分を変更してください。
(テンプレートメーカーでの設定によって違います。)
#footer{
clear: both;
padding-top: 30px;
padding-bottom: 10px;
background: #eeeeee; /*フッター全体の背景色を指定*/
font-size: 1.2em;
}
「▲このページの先頭へ」のカラーを変更する
最後に、必ず右下に表示されている「▲このページの先頭へ」の
カラーの変更方法をご紹介します。
1.同じくテーマ編集を開き「design.css」を開きます。
/*——————————————————–
ページトップ
——————————————————–*/の部分を表示させます。
2.#bcd764と#59493fの二箇所を変更します。
#bcd764の部分が通常時で、#59493fの部分がマウスを当てたときのカラー色です。
以上
賢威6.1 フッター部分のリンク色、背景色、見出しをカスタムする方法でした。