「グーペ」のナビゲーションの文字を大きくする方法

前回、紹介した、ユーザーさんから、
ご質問がありましたので、お答えしたいと思いま～す。w(￣o￣)w ｵｵｰ!

【Before】


【After】

レイアウト”Default センタリング ２カラム 左ナビゲーション”をベースにしています。

では、カスタマイズ方法を紹介したいと思います！
今回は、詳細編集でスタイルシート（CSS）のみのカスタマイズです。

【CSS】：改造前

/* --------------------------------------
ナビゲーション
--------------------------------------- */

#navi ul {
margin: 0;
list-style-type: none;
}
#navi ul li {
margin: 0 0 2px 0;
}
#navi ul li a {
height: 100%;
display: block;
padding: 10px 10px 10px 30px;
font-size: 11px;
text-decoration: none;
background: #f9fdf5;
}

【CSS】：改造後

/* --------------------------------------
ナビゲーション
--------------------------------------- */

#navi ul {
margin: 0;
list-style-type: none;
}
#navi ul li {
margin: 0 0 2px 0;
}
#navi ul li a {
height: 100%;
display: block;
padding: 10px 10px 10px 30px;
font-size: 14px;
text-decoration: none;
background: #f9fdf5;
}

上記の赤字が変更部分です。
文字の大きさの調整となり、
数字が大きくなるほど、表示される文字も大きくなります。
但し、文字を拡大しすぎると、レイアウトが崩れてしまいますので、
バランスの良い文字の調整をしましょう。

これだけで、カスタマイズ完了です！(⌒-⌒)ﾆｺﾆｺ...
皆さんも、グーペでホームページのカスタマイズに挑戦してみてはいかがでしょうか？


※但し、詳細編集でカスタマイズして設定した後に、かんたん編集に戻って保存すると
せっかく、カスタマイズしたデータが上書きされてしまいますので注意して下さいね。

【免責事項について】
このソースコードの使用に関しては、限られたテスト環境での動作確認などは行なっていますが、すべての環境に対応したものではありませんので、恐れ入りますが、使用に関しては自己責任でお願い致します。