オートナビで現在のページが強調表示される方法

2014年7月27日 at 19:28

HTMLのごく一部をかろうじて読める程度の素人です。
そんな自分でも自由にホームページを作れるconcrete5って素晴らしいと思います。

どなたか教えて下さい。

現在、右サイドバー部分にオートナビブロックを配置して、全メニューを表示しておりますが、
現在のページがどこか分かりやすくするため、メニュー中の該当ページ部分を強調表示(色が変わるなど)したいのですが、どうしたら良いでしょうか?

・使用サーバー : ファーストサーバ 共用サーバー ビズ2
・使用PC : windows8

# concrete5 Version
5.6.3.1

# Server Software
Apache

# Server API
apache2handler

# PHP Version
5.3.19

# PHP Extensions
apache2handler, Core, ctype, curl, date, dba, dom, ereg, exif, fileinfo, filter, firstserver, gd, hash, iconv, json, libxml, mbstring, mcrypt, mhash, mysql, mysqli, openssl, pcre, PDO, pdo_mysql, pdo_pgsql, pdo_sqlite, pgsql, Phar, posix, Reflection, session, SimpleXML, SPL, SQLite, sqlite3, standard, tokenizer, xml, xmlreader, xmlwriter, xsl, zip, zlib.

# PHP Settings
max_execution_time - 3600

タグ:

Re: オートナビで現在のページが強調表示される方法

2014年7月27日 at 21:31
いろいろやり方があります。
オートナビでは現在のページには nav-selected というクラスが付きますが、テーマのCSSに書くか、ブロックのカスタムテンプレートに書くかだと思います。

具体的に説明したいと思いますので、どのようなサイトか下記の項目を教えてください。

・使われているテーマ。
・オートナビブロックを使うのはこの箇所だけですか?
・オートナビの表示にカスタムテンプレートは使用されていますか?
 

Re: オートナビで現在のページが強調表示される方法

2014年7月28日 at 7:40
acliss様

早速の返信有難うございます。
concrete5の有難さは、ソフトの良さもさることながら、コミュニティーの親切さも有難いです。
いつか恩返しに、私もアドバイスできるように勉強していきます。

・テーマはflatstrapというテーマを購入して利用しています。
・オートナビブロックはほぼ全ページで右のサイドバーにスタックとして配置しています。
なので、スタック中のオートナビブロックのカスタムテンプレートを作ればいいのかな?と思っています。
・オートナビの表示にはカスタムテンプレートは利用しておりません。

以上です。よろしくお願いします。
 

Re: Re: オートナビで現在のページが強調表示される方法

2014年7月28日 at 9:23
有料のテーマということで試せないのです。申し訳ありません。
もし、テーマ側でオートナビのCSSを設定していないとすれば、添付したファイルをルートのblocksの中に入れて(concrete/blocksではありません)、カスタムテンプレートを適用すれば、現在のページが太く赤色になります。
view.css を変更してお好みの形に変更してみてください。
添付: autonav.zip
 

Re: オートナビで現在のページが強調表示される方法

2014年7月28日 at 9:30
flatstrapはBootstrap2.3.2を使用しているようですので、このような出力に調整すればうまく表示されると思います

<ul class="nav nav-pills nav-stacked">
<li class="active"><a href="#">Home</a></li>
<li><a href="#">Profile</a></li>
<li><a href="#">Messages</a></li>
</ul>

http://getbootstrap.com/2.3.2/components.html#navs
 

Re: Re: Re: オートナビで現在のページが強調表示される方法

2014年7月28日 at 10:45
acliss様

教えられたとおり実行したら、一発で思ったことが実現できました。
色は自分でオレンジ色に変えました。これも簡単でした。

こんなにも早く、こんなにも的確に、回答いただけるとは思ってもいませんでした。
本当に感謝しています。

また、hissy様もご指導、ありがとうございます。

ホームページのちょっとした変更が、業者に頼まずともすぐできるというのが、concrete5の魅力です。
皆様のご尽力に感謝します。
 

Re: オートナビで現在のページが強調表示される方法

2014年7月28日 at 11:17
このテーマはbootstrapというcssフレームワークを使用しているということですので
僕がお渡ししたカスタマイズ方法では、実現はできますが、あまりお作法としては良くないかもしれません。カスタムテンプレートを多用されるとデザインが崩れる可能性もありますのでご注意ください。