• ベストアンサー

CSSナビゲーションで表示ページをハイライトさせるのをSSIを使ってする

以前から質問させていただいているのですが、よくわからないので ここでまとめて質問させていただきます。 質問の方法が悪かったせいもあり、マルチポストに近くなってしまうのですが、ご容赦下さい。 以前の質問↓ http://okwave.jp/qa4624047.html CSSのナビゲーションバーで現在の表示ページをハイライトしたいと思います。できるか否かわからないのですが、できないのであれば どのように通常はしているのかを教えてください。 ただ、ssiで全ページ共通のナビゲーションバーを使用していますのでカテゴリごとにナビゲーションメニューをつくらないといけないのか また、カテゴリーを判別して(ディレクトリで)ハイライトしてくれるajaxのようなものがあるのか。 よくわからないのです・・・ http://www.n-di.co.jp/service/analytics.html ここのナビゲーションのようなものがつくりたいです。 わからないことばっかりで申し訳ないのですが お力を貸していただけるとありがたいです。

  • HTML
  • 回答数3
  • ありがとう数1

質問者が選んだベストアンサー

  • ベストアンサー
  • rukuku
  • ベストアンサー率42% (401/933)
回答No.3

>topで呼び出すというのは、どこで呼び出せばよいのでしょうか? >topと指定のあるリンクをクリックした時の状態のことでしょうか? 以下の記述をHTML(拡張子は.phpにします)の中に書き込んでおけば、ページが読み込まれたときに自動的に読み込まれます。 <?PHP $navi = top; include("navi.php") ?> 呼び出しを行っているのは「include("navi.php")」の部分です。 その前の行の「$navi = top」で、ハイライト位置を指定しています。 リンクのページでは、 <?PHP $navi = link; include("navi.php") ?> とします。(2行目ので"link"としています) こうすると、「include("navi.php")」の結果は $navi = top のときは <SPAN class="NaviC just"><A href="./">トップ</A></SPAN> <SPAN class="Navi just"><A href="link.php">リンク</A></SPAN> になり、 $navi = link のときは <SPAN class="Navi just"><A href="./">トップ</A></SPAN> <SPAN class="NaviC just"><A href="link.php">リンク</A> になります。 Navi と NaviC の位置を見てください。 以下同じように、ページごとに「$navi = ○○」の値を変えます。 例えばinfomation.phpを追加するには、 infomation.phpは <?PHP $navi = info; include("navi.php") ?> としておいて、 navi.phpに、 if($navi=="info"){print"<SPAN class=\"NaviC just\">";}else{print"<SPAN class=\"Navi just\">";} print"<A href=\"infomation.php\">お知らせ</A></SPAN>"; を追加します。 こうすると、infomatin.phpが開かれたときは、「お知らせ」がハイライトされます。

ritzkun
質問者

補足

なるほど! なんとなくですが、わかりました! 丁寧なご説明、ありがとうございました。 一度、挑戦してみます!!

その他の回答 (2)

  • rukuku
  • ベストアンサー率42% (401/933)
回答No.2

はじめまして >CSSのナビゲーションバーで現在の表示ページをハイライトしたいと思います。 >ただ、ssiで全ページ共通のナビゲーションバーを使用していますので SSIは使ったことがないので分かりませんが、PHPを使って同じようなことをやったことがあります。 同じ考え方でできればいいのですが。 PHPの場合には、外部のPHPを自分のPHPの中に呼び出すことができます。 このときに変数を送ることもできます。 具体的には、メインの文書から$naviの値を指定して、navi.phpを呼び出します。 <?PHP $navi = top; include("navi.php") ?> navi.phpの方で if($navi=="top"){print"<SPAN class=\"NaviC just\">";}else{print"<SPAN class=\"Navi just\">";} print"<A href=\"./\">トップ</A></SPAN>"; if($navi=="link"){print"<SPAN class=\"NaviC just\">";}else{print"<SPAN class=\"Navi just\">";} print"<A href=\"link.php\">リンク</A></SPAN>"; としておけば、 $navi = top;で呼び出されたときには、「トップ」がハイライトされ、 $navi = link;で呼び出されたときには、「リンク」がハイライトされます。 …Navi と NaviCの書式は、HTMLと同様CSSで指定しておきます。

ritzkun
質問者

補足

phpは知識がありませんのでよくわからないのですが、 topで呼び出すというのは、どこで呼び出せばよいのでしょうか? topと指定のあるリンクをクリックした時の状態のことでしょうか? phpの方がかんたんにできそうであれば、挑戦してみたいと思います。

  • warez
  • ベストアンサー率57% (29/50)
回答No.1

ちょっといじる必要はありそうですが。 http://semooh.jp/jquery/ref/cont/hilite_current_page/

ritzkun
質問者

お礼

なるほど!これならできそうですね☆ 一度挑戦してみます! ありがとうございました!

関連するQ&A

  • PHPとSSIについて

    PHPとSSIについて サイト内で共通部分を作ろうと思っています。 PHPとSSI どちらがSEO、軽さ、サーバーの負担的にいいのでしょうか? ちなみに箇所は ヘッダー ナビゲーションバー 2カラム時のメインじゃない方(バナーや、お知らせなど) フッター の4つです。 実は今運営しているサイトでは SSIで作っているのですが、以下の事ができなくて困っています(僕の力不足かもしれませんが) ナビゲーションバーのボタンで、今現在いる箇所はロールオーバー時と同じ画像にしておく(今どこにいるかわかるように) つまり、ページによってナビゲーションの反転している箇所が変わる。 新しく作るページではナビゲーションバーの下にさらに 子ナビゲーションバーを作る予定なので、作り的にはPHPを考えています(PHPで可能なのかどうかわかりませんが) 参考サイト http://www.vogue.co.jp/ PHPをこれから勉強する僕に教えて下さい。

    • ベストアンサー
    • PHP
  • ナビゲーションの変更を全ページに反映させるには?

    一般のHPで、ブログのように左の帯にナビゲーションを、 右に記事内容を配置した場合についてお尋ねします。 記事を追加した場合、左の帯のナビゲーション部分に新しい記事 のリンクを反映しなければなりません。 たとえば、記事ごとのページが100ページあったとして、 すべてのページに、リンクの追加を反映させる方法として、 1.JavaScriptでページ読み込み時に書き出す。 2.<iframe>を使う 3.SSIを使う 4.サーバーサイドスクリプト(たとえばPerlによるCGI)   で、記事を追加したタイミングですべてのファイルを書き換える。 などが考えられます。 そこで質問です。 一般のブログではどの方法がとられているのでしょうか? 1では無いことは明らかです。 2でもなさそう... それとも1~4のどれでもないのでしょうか? 3の方法は可能なのですが、できれば4の方法を採りたいです。 プロバイダ(Hi-Ho)加入時に標準でついてくるWeb環境の場合、 変更を反映させるページが100ページ程度の場合の一括更新 って、プロバイダ側から見るとかなりきついものなのでしょうか? (1ページはせいぜい10KB~20KB程度) よろしくおねがいします。

  • 【特設】アンケートページ の過去の質問を表示できません...

    【特設】アンケートページ の過去の質問(561以前のページ)を 表示しようとすると『【特設】アンケートカテゴリーのご利用 にあたって』という表示が現れ、そのページ内のリンク『【特設】 アンケートカテゴリを見る』をクリックしても『561ページ』に 戻ってしまいます。皆さんは如何でしょうか。 また、解決方法があれば教えてください。

  • 動的ページのアクセス解析

    質問するカテゴリがよくわからないのでこちらで質問させてください。 カテゴリ違いであればご容赦くださいm(__)m。 現在ニンジャツールのアクセス解析を使っているのですが、こちらですとphpなどの動的URLまでは解析できないようです(すべて単体のページとして記録されます) phpなどの動的URLをそれぞれ個別に(わかり易いように名前を付けれればもっとよい)解析できるようなアクセス解析はないでしょうか?解析したいのは携帯サイトです。個人のページなのでアクセス数はそれほど多くありません。 よろしくお願いいたしますm(_ _)m

    • 締切済み
    • PHP
  • OKwaveのトップページ表示

    昨夜突然このサイト(OKwave)のデザインが変更されましたね。 以前のトップページにはカテゴリー関係なく最新質問がズラッと並んだんですが、おすすめQ&Aとナイナイアンサー等のバナーが画面上部に大きく表示されるようになり、最新質問が下の方に少しだけ、それもどういう訳か病気のカテゴリーしか表示されなくなりました。 使いにくいなー…。質問した方は自分の質問に辿り着いてもらい辛くなり、とても困るのではないでしょうか。 閲覧する側が得意分野だけ見れるように&冷やかしでない専門家の回答が得られるようにとの配慮なのかも知れませんが、カテゴリーが微妙で質問者が妥当なカテを選べなかった質問とか、得意分野じゃないけど経験者だからたまたま答えられるとか、そういう質問に今後は答えてあげられなくなってしまう気がするのはちょっと寂しいです。 お節介焼きには楽しいサイトなので(笑) 今まで通り、全部のカテゴリーの最新質問を一覧表示させるにはどうしたら良いんでしょうか?

  • 現在開いているWEBページを閉じるために、閉じるという文字で閉じたいのですが

    タイトルのとおりです リンク先のページで一番下に「閉じる」という 文字を付け、それをクリックするとそのページが閉じて最初のページのブラウザだけが残るようにしたいのですが、そのタグを教えてください 初心者ですが、以前タグの質問をしたところ、 こちらのカテゴリーに移動させられたので、 今回からこちらのカテゴリーに質問させていただきます。 よろしくお願いします。

    • ベストアンサー
    • CSS
  • 教えてgooのカテゴリ表示について教えて下さい

    教えてgooのトップページの左側にカテゴリの欄がありますよね。 「ライフ」 という大きいカテゴリを選択すると、小さなカテゴリが表示されます。 家電製品から始まって、料理、住宅と続きますが、生活お役立ちで終わってしまいます。 ところが、「一覧」 をクリックすると、実はその後にまだ 「その他」 というカテゴリがあって、多くの質問や回答があります。 上のような作業ではなぜ 「その他」 というカテゴリが表示されないのでしょうか? 「一覧から進んでいけばいいのだから、文句を言うな」 という回答はご容赦下さい。  単に疑問に感じただけですので、クレームではありません。

  • *.shtmlに対応したHTMLエディタありますか?

    無料サーバーで CGI/SSI が利用できるので今あるホームページを 新しくリニューアルしようと思っています。そして SSI で便利な #include 文を使って最上部には全ページで同じナビゲーションバーを 表示出来るように HTML → SHTML に書き換えています。 質問: (1)ローカル環境では SHTML をブラウザで見ても #include がコメントなので  なにも表示されません。今は自作したツールで一時ファイルの HTML を作成させて  ブラウザで確認しています。HTML エディタで SHTML の SSI 部分を展開して  ブラウザ(HTMLエディタの確認画面も含む)で見れるソフトはありますか? (2)SHTML 対応の HTML エディタがない場合はどのように SSI の #include 文を  展開してローカル・パソコンのブラウザ(IE)で見れば良いでしょうか?  良い方法があれば教えて下さい。 (3)その他に SSI を使ったホームページを作成している方はどのように SSI 命令を  展開して画面を確認していますか?  毎回、サーバーにアップロードして確認をしているのですか? 上記の3つ、または1つでもアドバイスが欲しいです。 質問内容を整理すると SSI 命令の確認はどうすれば良いでしょうか? です。特に #include など。 それでは回答(アドバイスも含む)をお待ちしています。 よろしくお願い致します。

    • ベストアンサー
    • HTML
  • 子供用ハンガーのサイズ表示シールはどこで入手できる?

    http://page18.auctions.yahoo.co.jp/jp/auction/w21211890 http://page4.auctions.yahoo.co.jp/jp/auction/d80575388 http://page9.auctions.yahoo.co.jp/jp/auction/k49391874 このような子供用ハンガーの、サイズ表示シールは、どこで手に入るでしょうか? 具体的なサイト名や店舗などを教えてください。 よろしくお願いします。 ちなみに、ストアエキスプレス(店研創意)にはありませんでした。 (以前投稿したキッズファッションカテゴリが、過疎カテゴリだったため、 改めてこちらで質問させてもらいました。 回答が一件も無い時点での締め方がわからないため、 前回質問はそのままで、二重質問になっていますが、ご容赦ください。)

  • Dreamweaver でのフレーム分割についていくつか質問です。

    DreamweaverMX2004 でホームページ作成に挑戦してる初心者です。左側のフレームをナビゲーションバーにして、右側をメインにして作っているのですが、分からないことがあり、いくつか教えていただけると助かります。 1)タイトルが「無題ドキュメント」になる 左側のフレームにも、右側のメインにもタイトルを付けているのですが、アップすると「無題ドキュメント」になります。フレーム作成で作った場合、どうすればサイトに反映できるタイトルを付けられるのでしょうか? 2)フレーム部分を固定したい フレーム部のナビゲーションバーで、たとえば「プロフィール」のページに行くようクリックすると、フレームセットごと移動します。できれば、フレーム部はいったん閉じたりせずに、右側だけページが変わるように設定したいのですが、どうすればいいのでしょうか。今は、単に新規作成のときにフレームセットにして、左のフレーム部に「フレーム内に開く」でフレームを挿入しています。 3)いま開いているページの項目をわかるようにしたい フレームのナビゲーション項目(たとえば「プロフィール」とか「日記」とか)で、いま開いているのがどの項目かをフレームを見てわかるようにしたいのですが、可能でしょうか?たとえばプロフィールを開いているときは、ナビゲーションの「プロフィール」だけ色が違うようにするとか・・・。その場合、フレームをそれぞれに作らないといけないということなんでしょうか。 以上、複数質問がありすみませんが、お分かりになる方にご教示いただけると幸いです。どうぞよろしくお願いします。