Follow Us.RSS

グローバルナビゲーション全般について

  • 新規投稿
  • ログイン

その他グローバルナビゲーション全般について

いつもお世話になっております。グローバルナビゲーションについて質問させていただきます（ちなみにVicuna CMS（style-bazooka）を使っております）

■まず1点目です。

このグローバルナビゲーションの各ボタン（　私の場合は《トップページ》《ニュース》《カレンダー》《BBS》　）を自分でデザインしたボタンに変更したい場合はどうすれば良いのでしょうか??

■それと2点目の質問です。

もし自作のボタンが使用できないとして、その場合にボタンの背景色を変更する手立てはありますでしょうか??

それとstyle-bazookaの青い背景が上半分途中で切れてしまい、ページを下に送ると途中からは真っ白な背景でレイアウト的にみっともないので、この青い背景を使いたくないと思っているのですが、この背景自体の色やデザインを変更する方法も教えていただけますでしょうか??

毎度不勉強で申し訳ありません。
  • pinky1975
  • Windows Vista/Firefox3.0
  • 2008年10月23日(木) 15時12分44秒

その他Re:グローバルナビゲーション全般について

style-bazookaの青い背景が上半分途中で切れてしまい、ページを下に送ると途中からは真っ白な背景でレイアウト的にみっともない

CSSファイル編集（共通）の背景色を変更すれば良いだけでした。が、後段の質問はそのまま継続してお願いします。
  • pinky1975
  • Windows Vista/Firefox3.0
  • 2008年10月23日(木) 16時14分3秒

その他Re[2]:グローバルナビゲーション全般について

もし自作のボタンが使用できないとして、その場合にボタンの背景色を変更する手立てはありますでしょうか??

こちらについても書き忘れましたが、ナビメーカーのタブ色を変更した後に《ナビゲーション書き出し》を押せば良いだけでした（単に私のネットの環境が悪くて反映されていなかっただけでした）
  • pinky1975
  • Windows Vista/Firefox3.0
  • 2008年10月23日(木) 16時19分2秒

その他Re:グローバルナビゲーション全般について

ご質問ありがとうございます。

このグローバルナビゲーションの各ボタン（　私の場合は《トップページ》《ニュース》《カレンダー》《BBS》　）を自分で デザインしたボタンに変更したい場合はどうすれば良いのでしょうか??

Vicuna 互換ヘッダ方式で書き出されたグローバルナビゲーションを自作のボタンに変更するには、中級以上の CSS の知識が必要です。

Vicuna を使用している場合、グローバルナビゲーションのスタイル定義は、"/lib/css/vicuna/module/mod_gNavi/mod_gNavi.css" に記述されています。こちらを改造することでボタンを表示させることが出来ます。

ボタン化するための具体的な記述方法については、申し訳ありませんが、ご自身でお調べくださいm(_ _)m。

より簡単な方法として、ナビゲーション部分のみ CMONOS.JP 標準の表示に替える方法もあります。

  1. 「ナビメーカー」にアクセスします。
  2. 「アイコンライブラリ編集」で自作ボタンをそれぞれ HTMLコンテンツ用アイコン・BBS 用アイコン・データベース用アイコンなどに追加します。
  3. 「ナビゲーションレイアウト」で「アイコン方式」を選択します。
  4. ナビゲーションの余白に背景をつける場合は「画像ライブラリ」で登録した背景画像を指定します。
  5. 「ナビゲーション作成」でそれぞれアイコンを選択し「ナビゲーション書き出し」を実行します。

なお、「ナビゲーション作成」画面のアイコン設定は、「アイコン方式」で「ナビゲーション書き出し」を実行する場合のみ有効です。

また、「ナビゲーション作成」画面のタブ色・タブ背景色は、「CSSタブ方式」で「ナビゲーション書き出し」を実行する場合のみ有効です。

それとstyle-bazookaの青い背景が上半分 途中で切れてしまい、ページを下に送ると途中からは真っ白な背景でレイアウト的にみっともないので、この青い背景を使いたくないと思っているのですが、この背景自体の色やデザインを変更する方法も教えていただけますでしょうか??

ページ全体のスタイル定義は "/lib/css/vicuna/1-element.css" に記述されています。こちらを変更することで、背景色などを細かく変更することができます。

より手軽に変更するには、「CSSファイル編集(共通)」で「default.css」を開き、背景色などを設定します。

ただ、通常は style-bazooka 使用時におっしゃるような現象は起こりません。もしかしたら、default.css で背景色が白色に指定されていなかったでしょうか。

default.css で背景色が指定されていると、Vicuna スキン本来の設定が上書きされ、途中で背景が途切れてしまいます。

とお返事を書いていたら、一応解決されたようですね(＾＾；。ただ、ちょっとひっかかるところもありますので、以上ご参考にしていただければ幸いです。

CMONOS.JP をご活用いただきありがとうございます！
CMONOS スタッフ
  • CMONOS スタッフ
  • https://cmonos.jp/
  • MacOS X/Firefox2.0
  • 2008年10月23日(木) 17時14分58秒

その他Re[2]:グローバルナビゲーション全般について

より簡単な方法として、ナビゲーション部分のみ CMONOS.JP 標準の表示に替える方法もあります。

この方法で十分過ぎます。ありがとうございました。簡単にできました。

あとついでで大変申し訳ありませんが、今回色々とCSSやらその他設定等をゴチャゴチャと変更していたら、なぜかカレンダーページのカレンダーが右より（右サイドやや欠け気味）に表示されるようになってしまいました．．．それと同時になぜかヘッダーの画像が表示されなくなりました。こちらに関しては全く心当たりがないです。

もし何か原因が特定できそうな情報があれば教えて下さい。もしくはデフォルトの状態に戻す方法も教えて下さい。
  • pinky1975
  • Windows Vista/Firefox3.0
  • 2008年10月23日(木) 17時50分43秒

その他Re[3]:グローバルナビゲーション全般について

ご質問ありがとうございます。

Vicuna スキンのヘッダ画像は、Vicuna スキンが規定しているため、CMONOS.JP 標準のナビゲーションを採用した場合表示されません。

表示するには、「ナビメーカー」の「ページレイアウト」で「ヘッダ」に下記 Vicuna テンプレートのヘッダ部分を追加し、「ナビゲーション作成」の「ナビゲーション書き出し」を実行します。

<div id="header">
	<p class="siteName"><a href="/">[[サイトのタイトル]]</a></p>
	<p class="description">[[サイトの説明]]</p>
</div>

[[ ]]の部分はそれぞれ書き換えてください。

カレンダーが右寄りになる理由についてはよくわかりません。

元の状態に戻す場合は、書き換えた CSS ファイルをサイトテンプレートのものと差し替えてみてください。

  1. FTP で現在の CSS ファイル("~/HTTP公開ディレクトリ/lib/css" 以下のファイル)をダウンロードしバックアップします。
  2. FTP で "~/cgi-data/template/site/vicunaBasic/htdocs/lib/css" にあるサイトテンプレートの CSS をダウンロードし、それを "~/HTTP公開ディレクトリ/lib/css" にアップロード(コピー)します。元に戻したい CSS ファイルのみで OK です。

これで状況が改善しない場合は、ナビゲーションレイアウトを「Vicuna 互換ヘッダ方式」に戻してみてください。

サイトの状態を保存するには、「セットアップアシスタント」の「サイトテンプレート作成」で、現在の状態をサイトテンプレートとして保存します。

あとで元に戻すには、「サイトテンプレート適用」で保存しておいたサイトテンプレートを適用します。

以上、お試しください。
CMONOS スタッフ
  • CMONOS スタッフ
  • https://cmonos.jp/
  • MacOS X/Firefox2.0
  • 2008年10月23日(木) 18時14分19秒

その他Re[4]:グローバルナビゲーション全般について

ありがとうございました。おかげさまでできましたm(_ _)m

出来たには出来たのですが、この場合Vicunaのデフォルトで表示されていた背景の横ラインが、ヘッダを表示するとヘッダの後ろに表示されてしまいます。このラインを消す方法はありますか？
  • pinky1975
  • Windows Vista/Firefox3.0
  • 2008年10月23日(木) 18時50分31秒

その他Re[5]:グローバルナビゲーション全般について

熱心にカスタマイズしていただけることはデベロッパー冥利に尽きます。ありがとうございます！

背景の横ラインが、ヘッダを表示するとヘッダの後ろに表示されてしまいます。

とのことですが、「背景の横ライン」とは、ページ全体の背景画像のことでしょうか？

ヘッダ部分のみ背景を変えたいということでしたら、「Vicuna スキン設定」の「モジュールの読み込み」で「Eye Catch [Header] Module」を有効にし、「EyeCatch Heade」画像でお手持ちの背景画像を選択します。

無地がよろしければ無地の画像をご用意ください。

もし「背景の横ライン」が別のことを差している場合は、スクリーンショット画像を添付していただけると、解決のヒントになるかもしれません。
CMONOS スタッフ
  • CMONOS スタッフ
  • https://cmonos.jp/
  • MacOS X/Firefox2.0
  • 2008年10月23日(木) 19時31分59秒

その他Re[6]:グローバルナビゲーション全般について

こちらこそ簡単な質問ばかりでゴメンなさい。

MTでは挫折してしまったけど、『cmonosは素人でもやる気になれば出来る!!』から楽しく簡単にカスタマイズが出来るし、サポートがとてもしっかりしていてこちらこそ大変感謝しております。

それといつも質問が分かり辛くてごめんなさい。スクショを添付します。実にこんな感じです。
  • pinky1975
  • Windows Vista/Firefox3.0
  • 2008年10月23日(木) 23時23分56秒

その他Re[7]:グローバルナビゲーション全般について

MTと比較していただけるとはとても光栄です(＾＾；。そのお言葉に負けないよう今後も努力して参りますm(_ _)m。

スクリーンショットを貼っていただいたおかげで原因が分かりました。

この線は背景画像の線です。

この線を完全に削除するには、「ナビメーカー」の「ナビゲーションレイアウト」を開き、「アイコン方式」の「背景画像」で、左端のなにもないラジオボックスをチェックし、「保存」します。

また、「ナビゲーション高さ」を自作のアイコン類の高さと同じにすると、余白が無くなります。「アイコン間隔」を 0 にすると、アイコンがぴったりくっつきます。

線が二本出るとのことですが上の線はページ全体の背景画像なのではないかと思います。

「CSSファイル編集(共通)」で「default.css」を開き、<body> の「背景画像」に影のような線のある背景が選択されていないか確認してください。もし選択されている場合は、左端の何もないラジオボックスをチェックして保存します。

この点に関しては、上記で誤ったアドバイスをしておりました。大変失礼いたしました。

おそらく、Vicuna スキンの背景画像を消すために、こちらの画像を選択されたのではないかと思います。たしかに、背景画像を指定しなければ、背景画像指定が上書きされないため青い背景がそのまま残ることになります。

画像を指定することなく、Vicuna スキンの背景画像指定を無効化するには、「詳しい設定を表示する」をチェックし、「その他の body 設定」に下記スタイル指定を入力します。

  background-image: none;

ただ、style-bazooka は、背景画像を含めかなり作り込まれたスキンですので、背景画像を上書きすると、サイドバー部分のセパレータの色があわなかったり、逆に問題も出てくるのではないでしょうか。

もし背景の彩度が低い方がよいということでしたら、「style-future」もおすすめです。「Vicuna スキン読み込み(共通)」で、スキンを差し替えるだけで、見た目が変更されます。

スキン差し替え後、モジュール読み込み設定を再設定する必要があります。また、ナビゲーション書き出しも必要です。

Vicuna スキンの差し替えは、他の CSS や設定に影響しませんので、いつでも気が向いたときに試すことができます。

（style-future を試す場合は、default.css の背景画像と背景色を空に戻してください。）

以上お役に立てれば幸いです。
CMONOS スタッフ
  • CMONOS スタッフ
  • https://cmonos.jp/
  • MacOS X/Firefox2.0
  • 2008年10月24日(金) 0時21分0秒

その他Re[8]:グローバルナビゲーション全般について

今回ご回答頂いた件とは別件で、先の『カレンダー表示がずれる』についてです。

何故ズレが生じていたのかわかりました。というより自分でスクショを見ていて気が付いたのですが、『headerに線が現れる』の件で使ったスクショですが、《上：headerあり》と《下：headerなし》を見比べるとサイトの中央に200pxほど幅でラインが薄っすらと出ています。大変見難いですが・・・

（ココから以下は説明が難しくて伝わり辛いと思うので、もし意味が伝わらなければスルーしてください）
これに加え・・・
他のホームページメーカーで作成したページは【目次】【カレンダー】【FEEDS】などのフレーム部が左端にありますよね。

どうやら《カレンダー》のページでこの分が余白として確保されてしまっているようなのです。

これまではそんなスペースがなかったので、『200pxの中央のスペース』と『左端のフレーム』が出現したことで、結果的に上の二つ併せて700pxほど右にズレ込んでしまったようです。

この原因が何なのかな!?と思ったんです。一応先に教えていただいたことは試しましたが、結果的に修正はされませんでした。

こちらもお時間あるときに教えていただければ幸いです。
  • pinky1975
  • Windows Vista/Firefox3.0
  • 2008年10月24日(金) 1時27分15秒

その他Re[9]:グローバルナビゲーション全般について

すみません。カレンダーの件です。

あれから

カレンダー > 環境設定 > 設定の復元

で【初期設定】の【基本設定】を復元したところ、元に戻りました。

この処理は2回目です。一度目では上手くいかなかったのですが、なぜか2度目で元に戻りました。

ひょっとしたら、先程教えていただいた対処法を行ったあとで復元をかけたので上手くいったということなのか・・・とにかくその辺は素人なのでよく分からないですが、お騒がせしてスミマセンでした。
m(_ _)m

『背景の線の件』はただいま手を加え中です。アイコンのスペースや高さの変更なんかは上手く行きました。おかげさまでなんだかサイトっぽくなってきました^^　
  • pinky1975
  • Windows Vista/Firefox3.0
  • 2008年10月24日(金) 2時4分12秒

その他Re[10]:グローバルナビゲーション全般について

【初期設定】の【基本設定】を復元したところ、元に戻りました。

とのことですが、これで元に戻ったのかどうか不安があります...（´-｀；。

おそらく、Vicuna 互換ページレイアウトではなくなったために Vicuna スキンが無効となり、カレンダーが真ん中に表示されているのだと考えられます。

Vicuna CMS 使用の場合は、「初期設定」の「Vicuna 互換ページレイアウト を復元する」必要があります。

その後、「ビューワページレイアウト」の「詳しい設定を表示する」をチェックし、「<body> class」設定が「calendar single」となっているかご確認ください。

ここで「double」と指定されている場合、サイドバー分の余白が確保されます。

いずれにせよ、ヘッダを追加すると真ん中に変な空白ができるのが気になりますね。

もしかしたら、ナビメーカーのナビゲーションレイアウトで追加したヘッダに、タグの閉じ忘れがないでしょうか。タグの閉じ忘れがありますと、表示が崩れる原因となりますので、こちらも念のためご確認ください。

ズレの検証とご報告ありがとうございました。少しでも早く pinky1975 さんの思い通りの表示となることを願っています。
CMONOS スタッフ
  • CMONOS スタッフ
  • https://cmonos.jp/
  • MacOS X/Firefox2.0
  • 2008年10月24日(金) 3時17分43秒

その他Re[11]:グローバルナビゲーション全般について

色々と丁寧に教えていただき、いつもありがとうございます。

Vicuna CMS 使用の場合は、「初期設定」の「Vicuna 互換ページレイアウト を復元する」必要があります

こちらも試してみましたが改善されませんでした。が、結局考え抜いた末、cmonosデフォルトの画面構成が一番スッキリしていて自分の目指すものに一番近い！と思い、これまで教えていただいたことを参考にデフォルトの状態に戻して一から再構築しました。

おかげさまで自分のイメージにかなり近いサイトになりました。改めて御礼申し上げます。

そこでまた質問ですが、cmonosデフォルトのスキンの場合、headerの画像はどうやって表示しているのでしょうか??　一通り見ましたが分かりませんでした。

【ナビゲーションレイアウト】の方もイジってみましたが変わりませんでした。
  • pinky1975
  • Windows Vista/Firefox3.0
  • 2008年10月24日(金) 17時54分0秒

その他Re[12]:グローバルナビゲーション全般について

CMONOS.JP デフォルトのヘッダでは、ナビゲーション背景画像がヘッダ画像となっています。

アイコン方式およびカラータブ方式では、「画像ライブラリ編集(共通)」の「背景画像」に登録した画像を指定することができます。ナビゲーション高さを画像の高さに合わせることで、余白部分の背景に画像が表示されます。

イメージタブ方式では、「アイコンライブラリ編集」の「タブ背景」に登録した画像を指定することができます。タブ全体上余白を調整することで「タブ背景」画像の見え方を調整します。

ちなみにこのサイトのヘッダはイメージタブ方式で作成されています。

以上の方法の他に、「ナビゲーションレイアウト」の「ヘッダ」部分にヘッダ画像の HTML を記述する方法もあります。

このサイトでは、サイト上部の検索ボックスや RSS のリンクなどを「ナビゲーションレイアウト」の「ヘッダ」に記述しています。

まとめると、

  1. 画像ライブラリの背景画像にヘッダ画像を登録する
  2. ナビゲーションレイアウトでナビゲーションの背景画像として登録した画像を選択する

と言う流れになります。
CMONOS スタッフ
  • CMONOS スタッフ
  • https://cmonos.jp/
  • MacOS X/Firefox2.0
  • 2008年10月24日(金) 19時6分33秒

その他Re[13]:グローバルナビゲーション全般について

ありがとうございます。

出来たには出来ましたが、ひとつ問題がありまして、この場合背景担っている関係で『繰り返し表示』になってしまいます。

私としては800×120の画像を単一表示で、ど真ん中にひとつだけ表示し、その下にアイコンを並べたいのです（伝わりにくくてスミマセン）

調べてみた感じですと、【ナビゲーションレイアウト】の中には見当たらないようです。

イメージとしては【Vicuna スキン設定】で【EyeCatch header】で登録した画像が、そのままアイコンの上に表示される感じなのですが。

またまたご教授願います。
m(_ _)m
  • pinky1975
  • Windows Vista/Firefox3.0
  • 2008年10月24日(金) 19時36分36秒

その他Re[14]:グローバルナビゲーション全般について

確かに繰り返しになってしまいます。

真ん中に一回だけ表示したい場合は、「ナビゲーションレイアウト」の「アイコン方式」の「追加スタイルシート」に次のように記述します。

div#site-navi {
  width: 800px;
  margin: 0 auto;
  background-repeat: no-repeat;
  background-position: center top;
}

「width: 800px」はなくてもかまいません。上記のスタイルシートは、背景を繰り返さず、位置は真ん中の上端で、ということを指定しています。

ただ、これだとヘッダ部分にナビゲーションのリンクがかかってしまい、ちょっと変わったヘッダになってしまいます...。

気になる場合は、「ナビゲーションレイアウト」の「ヘッダ」に下記を記述し...

<div id="header">
    <p class="siteName"><a href="/">[[サイトのタイトル]]</a></p>
</div>

「アイコン方式」の「追加スタイルシート」に下記を記述します。

div#header {
  width: 800px;
  height: 120px;
  margin: 0 auto;
  background-image: url("[[ヘッダ画像のパス]]");
}
div#header p {
  margin: 0;
  padding: 0;
}
div#header p.siteName a {
  display: block;
  width: 800px;
  height: 120px;
  text-indent: -4000px;
  overflow: hidden;
}
div#site-navi {
  width: 800px;
  margin: 0 auto;
}
CMONOS スタッフ
  • CMONOS スタッフ
  • https://cmonos.jp/
  • MacOS X/Firefox2.0
  • 2008年10月24日(金) 20時46分2秒

その他Re[15]:グローバルナビゲーション全般について

お礼が遅くなりました
m(_ _)m

ホントにありがとうございました。おかげさまで自分のイメージ通りのサイトが構築できました。これから各コンテンツを充実させる作業に入ります^^

また分からないところが出てきたら（直ぐに出そうですけど･･･^^;）、その際はまたよろしくお願いいたします。
  • pinky1975
  • Windows Vista/Firefox3.0
  • 2008年10月26日(日) 1時16分50秒

その他Re[16]:グローバルナビゲーション全般について

お疲れさまでした。お役に立てましたなら、たいへん光栄です(^_^)。

ところで、CMONOS.JP の文字列フィールドにはいくつか入力支援機能があります。

たとえば、「・」が行頭にある場合リストになります。行頭が「+」だと番号リストになります。

  • リスト
  • リスト
  1. 番号リスト
  2. 番号リスト

行頭から行末まで「-」の連続ととなっている場合、線になります。

↑「----」と入力

また、入力フィールド設定の詳細設定で「テーブルタイプ」を「項目名行なし」などに設定しておくと、タブ区切り文字列および CSV タグに囲まれたカンマ区切り文字列が表に変換されます。

単純な表を作成するときに便利です。

このように記述すると...

<!--csv-->
1,2,3,4,"&yen;1,500"
5,6,7,8,"&yen;2,500"
<!--/csv-->

こうなります↓。

1234¥1,500
5678¥2,500

※カンマ区切り文字列を使う場合、カンマを含むセルは " で囲みます。

また何かお気づきの点がありましたら、お気軽にご相談ください。お待ちしております。
CMONOS スタッフ
  • CMONOS スタッフ
  • https://cmonos.jp/
  • MacOS X/Firefox2.0
  • 2008年10月26日(日) 2時2分28秒

その他Re[17]:グローバルナビゲーション全般について

　CSV タグ

---------------------

で表が簡単に作成出来るのですね。早速使います^^

いままで思いっきりhtmlのタグをベタ打ちしてました^^;　リストの話もどこかに書いてあったような気がしないでもないけど、私の頭からスッカリ抜けてました。ありがとうございます。

そして今後も長きに渡ってのお付き合いを、どうぞよろしくお願いいたします。
m(_ _)m
  • pinky1975
  • Windows Vista/Firefox3.0
  • 2008年10月26日(日) 13時52分20秒
タイトルは内容を簡潔にまとめたものにしてください。
「質問です」などのタイトルで投稿することはできません。
アイコン
この E-Mail は表示されません。
添付ファイル
(< 1000000 byte)
サイズ (<800) × (<800) ピクセル
ユーザー環境MacOS X/AppleWebKit537.36
  • 新規投稿
  • ログイン