グローバルナビをCSS形成で組み込むカスタマイズまとめ

シリウスカスタマイズＴＯＰ＞グローバルナビをCSS形成で組み込むカスタマイズまとめ

CSSのみでシリウスにグローバルグローバルナビゲーション形成するデザイン
を複数まとめています。

通常よく見られるスタイルからjquery採用と同様に動くプルダウンメニュー
まですべてCSS記述の追加で完結....

スタイルは、当サイトナビを参照下さい
クリックで回転リングスタイルですが、プルダウンを含めて表示スタイルは
各種ございます

ネット上で公開されているグローバルナビプルダウンコードを
シリウスに導入しようとしても、不作動エラーばかりで断念された方でも
当サイトでの解説に従い進めれば即完了します..

単なるメニュータイプからワンクリックで複数の下層メニューを一度に
表示するプルダウン形式、アコーディオンタイプでもスタイルは同じ..

グローバルグローバルナビゲーションのプルダウンスタイルは、シリウスの
デフォルトでは、いまだ構築が複雑なのか？導入はされていませんが

世に出回るワールドプレス等のブログサービスをみてみれば当然のように
プルダウンナビゲーションは標準装備されていますね..

当サポートへもシリウスでナビゲーション実装する手立てはないか？
....との要望も多く今回追記いたしました。

追加のご案内
さらに、シリウスのグローバルナビが好きなのでそのままプルダウン要素を
組み込めないかとのご要望もあり、デフォルトのスタイルを変えることなく
作動する形態も追加しております..

ここでは、デフォルトテンプレートに限るご案内となりますが、レスポンシブ
テンプレート（シリウスの１、2カラム）に取り付ける解説をイメージ変化を
含めて子サイトに追加しております
工程及び取り付け方が異なるので詳細はこちらでご確認ください
シリウスレスポンシブテンプレートカスタマイズまとめ

当サイトのナビの形がお気に召さないという方もおられるかと思いますので
ご利用は個々の判断で願います..

ビジネステンプレートに取り付けできないかと、お問い合わせがございます
しかし、サイト両サイドのグローバルの外ラインの延長箇所の調整が、
画像ですので調整つかず...未対応

シリウスレスポンシブでは見た目ほとんどビジネスと同じ？テンプレートが
用意されておりそちらでなら対応は可能です…
上段のシリウスレスポンシブテンプレートカスタマイズまとめリンクで
ご確認ください..

シリウスでデフォルトで用意されているグローバルナビゲーションデザインは
画像ファイルを読み込んで表示はされているのですが、スタイルシートより
CSS指定でも画像である個所をカラー背景と指定すれば、色合いの
斜陽はない単色カラーで形成することもできます..

ですが、
ここではデフォルトのグローバルナビは非表示として、スタイルシートに
カラー記述を加え、外部組み込みという形式で初心者でも複数の
表示スタイルを簡単に導入されるようわかりやすい手順で
解説してましります

当ページに備えるグローバルナビは、プルダウン、いやアコーディオンメニュー
とでも言いますか、

表現は違えど記述は同じようなもの　ほとんど同じですが、こちらは導入が
面倒な形式で初心者向けではなく、解説ページはあるものの

できませんぜと？

クレームばかり....

でも今回は当グローバルナビと同じ作動で皆さん、簡単に導入できる
形式です....マジ簡単..コピペデOK

はっきり一つて、今回のＣＳＳナビが一番簡単で作動スタイルも複数あるので
お勧めのカスタマイズ方法と理解しており、他サイトもすべてこのナビにして
ます筆者です

スタイルは

単にグローバルナビだけを表示するスタイル
CSS指定でプルダウンメニューを表示するスタイル
作動に滑らかさを付け加えるjquery採用のスタイル
それらを一つずつ詳細に説明しますので、好みの形態を選択ください

プルダウンに関しては、ページを間違えるといけないのでここで解説Ｐリンクを
記します
作業工程順番

上から順に一つずつステップ式に進んでください
順に進めばスムーズにお取り付けいただけると理解しますが、
一応すべて読破したからご判断ください