SIRIUS(シリウス) グローバルメニューのカスタマイズ サイト幅変更する場合

SIRIUSで作成しているサイトがあるのですが、グローバルメニューの項目を増やしました。

ところが、多くなるとメニュー欄が2段になってしまうんです。

これを何とか綺麗な1段に納めたいとカスタマイズに挑戦しました。

もちろんSIRIUSをよくわかっていない自分なので、ネット等でいろいろ検索。

いくつかヒットします。

style.cssを加工するものなんですが、私のSIRIUSは最新版?なので

ネットで紹介されているstyle.cssの編集ページの項目が違うんです。

 

これがよく紹介されているスタイルシート編集画面です。
(勝手に画像を使っています。すみません。)

#topmenu span a{ を編集するように紹介してあります。

しかし、私のstyle.cssには#topmenu span a{という項目がなく

項目トップメニューに「#topmenu li {」にある「width: 148px」という箇所を変更すればということでした。

とりあえず自分のメニュー項目に合うようにいろいろ変更してみました。

いくつか試して、プレビューを見ながら最終的に110pxがベターでした。

値を小さくすると、メニューのタイトルが2段になってしまいます。

(これじゃ無意味ですから・・・そういう場合はタイトルを短くするように工夫が必要ですね。)

何とか今回は形になったのですが、変更しやすいのはデフォルトのテンプレートでサイトを作成した方が良いようです。

ただ、スマホでも見られるようにとレスポンシブテンプレートを選んでいるのですが、

これから勉強してデフォルトテンプレートでスマホでも見られるようにできるようになりたいですね。

 

テンプレートからの変更

テンプレートを利用してSIRIUSサイトを作成すると、横幅やウェジェットの変更がとても簡単ですね。

利用する価値ありだと思います。

SIRUSの編集画面を立ち上げます。

最上部の赤枠に囲んだテンプレートボタンをクリックします。

テンプレートボタンをクリックすると、ダウンメニューは現れます。その中のテンプレート編集等を開いてカスタマイズします。

とても簡単でした。

SIRIUSでのサイトも充実したいと思っていますので、

もっといろいろカスタマイズ等に挑戦していきたいと思っています。

その際は再度掲載したいと思います。



しんぺいにメールを送る
お役に立つ記事の配信を心がけています。
記事の感想や質問等、どんなことでも良いですから、気楽にメールをください。
できるだけ早く(原則24時間以内)配信することを心がけています。

コメントを残す