xedition 레이아웃에서 활성화된 메뉴를 달리 보이도록 하려면 - 묻고답하기

DoorWeb

레이아웃 끝자락에

.gnb>ul>li.on>a{color:#원하는 색}

과 .body.fixed-width .lnb ul ul li.on a{color:#원하는색} 넣으면 되긴 될거 같은데

서브쪽은 html 구조를 안봐서 이 부분이 맞는지 잠담드리기 힘듭니다. ul ul 두번 내려가다 보니 보여지는것 하위 메뉴가 아닌가 싶기도 하고...

레이아웃 만드시는 분들마다 html 구조가 조금씩 달라서..

댓글 2015-06-11
최황삼

알려주신데로 수정하고 살펴보았더니, 1차 메뉴(2차 메뉴를 갖지 않은 1차 메뉴임)만 hover 색이 아닌 것으로 나타나고 그외 모든 메뉴는 전혀 변화가 없군요. 이 문제는 참으로 어려운가 봅니다. 아뭏튼 친절하고 자세히 알려주시어 감사할 따름입니다. 항상 좋은 일만 있기를 빕니다.

댓글 2015-06-11

ehii

layouts/xedition/layout.html 의 266줄, 270, 273줄을 아래와 같이 수정하시고

<!-- GNB -->
<nav cond="$GNB->list" class="gnb" id="gnb">
<ul>
<li loop="$GNB->list => $key1, $val1">
<a href="{$val1['href']}" target="_blank"|cond="$val1['open_window'] == 'Y'" class="selected"|cond="$val1['selected']">{$val1['link']}</a>
<block cond="$val1['selected']">{@ $_selected_menu = $val1}</block>
<ul cond="$val1['list']" class="depth2">
<li loop="$val1['list'] => $key2, $val2" class="more"|cond="$val2['list']">
<a href="{$val2['href']}" target="_blank"|cond="$val2['open_window'] == 'Y'" class="selected"|cond="$val2['selected']">{$val2['link']}</a>
<ul cond="$val2['list']" class="depth3">
<li loop="$val2['list'] => $key3, $val3">
<a href="{$val3['href']}" target="_blank"|cond="$val3['open_window'] == 'Y'" class="selected"|cond="$val3['selected']">{$val3['link']}</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</nav>
<!-- /GNB -->

layouts/xedition/css/layout.min.css 에서 /* GNB */ 부분을 찾아 아래의 내용을 추가해 보세요.

.gnb>ul>li .selected{color:green}
.gnb>ul .depth2>li .selected{color:green}
.gnb>ul .depth3>li .selected{color:green}

.gnb>ul>li .selected 가 1차 메뉴

.gnb>ul .depth2>li .selected 가 2차 메뉴

.gnb>ul .depth3>li .selected 가 3차 메뉴입니다. 원하시는 색깔로 바꿔서 적용하세요.

댓글 2015-06-11

최황삼

ehii님, 정말 감사합니다.

1차메뉴와 2차메뉴인 슬라이드메뉴(또는 팝메뉴라고 할까요. 명칭을 몰라서)에는 정확히 적용되는 군요.

제가 질의하는 것 중 1차메뉴의 색은 해결되었습니다만....
사이드바에 활성화된 2차메뉴의 색을 나타내는 코드를 가르쳐 주시면 감사하겠습니다.

알려주신 코드로 수정한 후, 해당되는 페이지 소스를 보면 아래와 같습니다. 아마 사이드바에 나타나는 2차메뉴는" <nav class="lnb">"내의 하위 코드같은데, 수정하려고 애써보지만 역시 부족한 실력으로는 해결할 수 없군요. 부탁합니다.

<li> <a href="/xe/freeboard_p" class="selected">Free Board</a>
   <ul class="depth2">
   <li><a href="/xe/freeboard">자유게시판</a></li>
   <li><a href="/xe/goodword">좋은 글</a></li>
   <li><a href="/xe/history" class="selected">역사공부</a></li>
   <li><a href="/xe/my_board">My Board</a></li>
   <li><a href="/xe/my_blog">My Blog</a></li>
   </ul>
</li>

(중간 생략)


<nav class="lnb">
   <ul>
       <li class="on"><a href="/xe/freeboard">자유게시판</a></li>
       <li class="on"><a href="/xe/goodword">좋은 글</a></li>
       <li class="on"><a href="/xe/history">역사공부</a></li>
       <li class="on"><a href="/xe/my_board">My Board</a></li>
       <li class="on"><a href="/xe/my_blog">My Blog</a></li>
     </ul>

댓글 2015-06-12

ehii

lnb부분도 비슷하게 적용하시면 됩니다.

다만, lnb메뉴는 2차메뉴부터 보이기 때문에

<li loop="$_selected_menu['list'] => $key1, $val1">에서 {$val1['link']}부분이 2차메뉴에 해당합니다.

{$val2['link']}는 3차메뉴에 해당되구요.

layout.html 351줄을 수정하시고,

<!-- LNB -->
<nav cond="$_selected_menu['list'] && $layout_info->layout_type === 'sub' && $layout_info->sidebar_position !== 'none'" class="lnb">
<ul>
<li loop="$_selected_menu['list'] => $key1, $val1">
<a href="{$val1['href']}" target="_blank"|cond="$val1['open_window'] == 'Y'" class="selected"|cond="$val1['selected']">{$val1['link']}</a>
<ul cond="$val1['list']">
<li loop="$val1['list'] => $key2, $val2" class="on"|cond="$val2['selected']">
<a href="{$val2['href']}" target="_blank"|cond="$val2['open_window'] == 'Y'">{$val2['link']}</a>
</li>
</ul>
</li>
</ul>
</nav>
<!-- /LNB -->

lauout.min.css 에서 /* LNB */부분을 찾아 아래 내용을 추가해 보세요.

.body.fixed-width .lnb>ul>li .selected{color:green}

댓글 2015-06-12

최황삼

ehii님, 정말 감사합니다.

20일 전부터 이 문제를 해결하려고 애를 썼는데

ehii님의 친절하신 가르침으로 오늘 완전무결하게 해결했습니다.

항상 건강하시고 뜻하는 바를 이루시길 빕니다.

감사합니다.

댓글 2015-06-12