메뉴 버튼 활성화 방법 소개

     <li loop="$m_bottom_menu->list=>$key1,$val1" class="on"|cond="$val1['selected']" data-menu-id="home">
        <a href="{$val1['href']}">
          <ion-icon cond="$val1['icon']" name="{$val1['icon']}" class="side-nav-icon"></ion-icon>
          <ion-icon cond="!$val1['icon']" name="alert-circle-outline" class="side-nav-icon"></ion-icon>
        </a>
      </li>

예제)

 

css는 이걸 추가 

 

.on a { 
  color: var(--color-black) !important; 
}

 

 

 

LNB라던지 어떤 네비게이션 목록을 loop문으로 돌려서 출력되는 걸거예요
그 루프문 안에다가
선택되었을 경우의 리스트 클래스를 넣어줘요(물론 루프문 코드를 자세히 봐야 정확한 코드를 알려드리겠지만요..)
<li class="on"|cond="$val1['selected']"><a href="{$val1['href']}">{$val1['link']}</a></li>

class="on"을 조건부로 가져오는겁니다 뒤에 붙은 |cond="조건" 에 해당되지 않으면 그냥 li속성만 남게되겠죠

예시일 뿐입니다~ 암튼..
이러고 on에만 백그라운드 밝게 글씨 어둡게 이런식으로 스타일 변화를 줘놓으면 해당 모듈에서 밝게 불이 켜지겠죠?