특정 메뉴 색상을 다르게 설정하기 - 그누보드팁

본문 바로가기
전체검색

그누보드팁

그누보드, 영카트 초보 제작자분들을 위한 다양한 스킨 제작 활용 팁을 공유합니다.

특정 메뉴 색상을 다르게 설정하기

관리자 18-09-18 13:19

그누보드 상단 메뉴 색상은 한가지로 통일되어 있는데 특정 메뉴만 다른 색상으로 변경하는 방법입니다.

관리자 페이지 메뉴 설정에서 메뉴를 추가하면 me_code 넘버가 부여되는데

해당 번호를 활용하는 방법입니다.


보통 메인메뉴는 10, 20, 30, 40,......

각 서브메뉴는 이런식으로 설정됩니다.

1010, 1020, 1030,..........

2010, 2020, 2030,........

원하는 메뉴 번호 확인 후 추가하면 됩니다.


메뉴가 10개 이상이면 숫자+영문조합으로 생성됩니다.

그럴 경우엔 me_code 넘버를 파악하기 힘드니 아래 팁을 참고하세요.

http://gnustudy.com/bbs/board.php?bo_table=gnu_tip&wr_id=198



수정 파일


1. default.css


별도의 색상 코드 class 추가

.color_red {color:#ff0000 !important}



2. head.php


2-1. 하위 메뉴까지 모두 일괄적으로 수정할 때


아래 코드를 찾은 후


if( empty($row) ) continue;


바로 밑에 추가 (default.css 파일에서 추가한 class를 설정했습니다.)


if ($row['me_code'] == '20' || $row['me_code'] == '40') {
    $menu_color = ' color_red';
} else {
    $menu_color = '';
}


메인메뉴 링크 부분을 이렇게 수정


<a href="<?php echo $row['me_link']; ?>" target="_<?php echo $row['me_target']; ?>" class="gnb_1da<?php echo $menu_color ?>"><?php echo $row['me_name'] ?></a>



수정하면 하위 메뉴까지 일괄적으로 변경됩니다.


3b521a607b6411d41b5915d0744d5172_1537244302_8285.png 




2-2. 하위 메뉴도 개별적으로 선택해서 수정할 때


아래 코드를 찾은 후


if( empty($row2) ) continue;


바로 밑에 추가


if ($row2['me_code'] == '1020' || $row2['me_code'] == '2010' ) {
    $menu_color = ' color_red';
} else {
    $menu_color = '';
}



서브메뉴 링크 부분을 이렇게 수정


<a href="<?php echo $row2['me_link']; ?>" target="_<?php echo $row2['me_target']; ?>" class="gnb_2da<?php echo $menu_color ?>"><?php echo $row2['me_name'] ?></a>


수정하면 하위 메뉴가 일괄적으로 모두 변경되지 않고 선택한 메뉴만 색상이 바뀝니다.


3b521a607b6411d41b5915d0744d5172_1537244279_6957.png

로그인 후 댓글 작성 가능합니다.
그누스킨닷컴

그누스터디는 그누보드, 영카트를 이용하시는 초보 사용자를 위한 정보를 공유합니다.

E-MAIL : gnustudy@naver.com / 카카오톡 : gnustudy / 텔레그램 : gnustudy
제작 문의를 제외한 일반 문의는 QA 게시판을 이용해주세요.

Copyright © GNUSTUDY. All rights reserved.