LightningFortのグローバルメニューをカレント表示させたい

このトピックには4件の返信、2人の参加者があり、最後に匿名により5年、 12ヶ月前に更新されました。

5件の投稿を表示中 - 1 - 5件目 (全5件中)

投稿者

投稿
2018年11月23日 3:21 PM #13738

匿名
無効

Lightning Proバージョン: 0.4.0
Lightning Skin Fort
WordPress 4.9.8

他のスキンのようなグローバルメニューにしたいです。
（マウスを重ねたら色変更と下線が出て、選択ページは下線表示）
もうひとつのフォーラムから調べて下記CSSを入れましたが変わりません。

ul.gMenu > li.current-menu-ancestor > a,
ul.gMenu > li.current-menu-item > a,
ul.gMenu > li.current-menu-parent > a,
ul.gMenu > li.current-post-ancestor > a,
ul.gMenu > li.current_page_ancestor > a,
ul.gMenu > li.current_page_parent > a,
ul.gMenu > li > a:hover:after {
color: #f007300;
}

よろしくおねがいします。

2018年11月25日 12:04 PM #13758
石川＠Vektor,Inc.
キーマスター
制作実績
PC版のみに指定する場合は
```
@media (min-width: 992px){
ul.gMenu > li.current-menu-ancestor > a,
ul.gMenu > li.current-menu-item > a,
ul.gMenu > li.current-menu-parent > a,
ul.gMenu > li.current-post-ancestor > a,
ul.gMenu > li.current_page_ancestor > a,
ul.gMenu > li.current_page_parent > a,
ul.gMenu > li > a:hover:after {
color: #007300;
}
}
```
のように画面サイズ指定をしますが、今回の原因はそこではありません。

color: #f007300; ← 色コードが間違ってます（文字数が多い）。

#ff0000 のように 16進数の6桁か
#f00 のように16進数の3桁で指定してください。
2018年11月25日 2:23 PM #13761

匿名
無効

すいません、色コード修正し下記CSS追記しましたが、IE11でアクティブページのみ色変更になる状態です。
IEの時にオンマウスで色変更・下線表示、アクティブページで下線表示が出ません。
choromeだと何も変わりません。

@media (min-width: 992px){
ul.gMenu > li.current-menu-ancestor > a,
ul.gMenu > li.current-menu-item > a,
ul.gMenu > li.current-menu-parent > a,
ul.gMenu > li.current-post-ancestor > a,
ul.gMenu > li.current_page_ancestor > a,
ul.gMenu > li.current_page_parent > a,
ul.gMenu > li > a:hover:after {
color: #007300;
}
}

2018年11月25日 10:26 PM #13765
石川＠Vektor,Inc.
キーマスター
制作実績
after要素が邪魔でした。
下記でいけると思います。
```
@media (min-width: 992px){
ul.gMenu > li.current-menu-ancestor > a,
ul.gMenu > li.current-menu-item > a,
ul.gMenu > li.current-menu-parent > a,
ul.gMenu > li.current-post-ancestor > a,
ul.gMenu > li.current_page_ancestor > a,
ul.gMenu > li.current_page_parent > a,
ul.gMenu > li > a:hover {
color: #007300; /* 文字の色 */
position:relative;
}
ul.gMenu>li.current-menu-ancestor>a:after, ul.gMenu>li.current-menu-item>a:after, ul.gMenu>li.current-menu-parent>a:after, ul.gMenu>li.current-post-ancestor>a:after, ul.gMenu>li.current_page_ancestor>a:after, ul.gMenu>li.current_page_parent>a:after, ul.gMenu>li>a:hover:after {
    content: ".";
    line-height: 0;
    border-bottom: 1px solid #337ab7; /* 線の色はお好みで変更してください。 */
    bottom: 0;
    display: block;
    overflow: hidden;
    position: absolute;
    width: 100%;
    left: 0;
}
}
```
全てのWordPressテーマで使える！デザインをピンポイントで変更する方法〜親テーマのCSSは書き換えないで〜
2018年11月26日 10:47 AM #13778

匿名
無効

ありがとうございました。
いろいろ試した結果、下線表示はやめにしましたが
思い通りになりました。

実は会社にWEB解析士なる営業が来て
いろいろと指摘された次第です。
サイトはほぼデフォルトのままでしたので
指摘事項を提案として「バグ報告と提案」に新トピさせていただきます。
投稿者

投稿