2026, 새로운 도약을 시작합니다.

상품목록에서 정렬방법 선택 시 선택한 탭의 색상을 변경하기

이건 질문이 아니고, 혹시 필요하실 분들을 위해 남기는 팁입니다.

상품목록에서

<판매많은순/낮은가격순/높은가격순/평점높은순/후기많은순/최근등록순>

정렬을 선택할 시, 상품의 정렬은 바뀌지만

038c4ce812b609289d2bd5db44fef60b_1487953

위의 사진처럼 탭의 색상은 그대로입니다.

그래서 자신이 어떤 기준으로 상품 정렬을 했는지 알 수 있게 

아래와 같이 선택한 탭의 색상이 바뀌도록 하였습니다.


038c4ce812b609289d2bd5db44fef60b_1487953

gnucommerce/skin/shop/<선택한 스킨: 저의 경우 16-summer-ipha>/list.sort.skin.php에서 

 [code]
<?php      
if( !defined('GC_NAME') ) exit;     
      
$sct_sort_href = gc_get_shop_url();        
do_action( GC_NAME.'_skin_action', __FILE__, plugin_dir_path( __FILE__) );
  
$query4ssch_sort="#E78B90 !important";      
?>      
      
<!-- 상품 정렬 선택 시작 { -->      
<section id="sct_sort">      
   <h2>상품 정렬</h2>     
    <ul id="ssch_sort">      
        <li id="sort_style"><a style="color: <?php if($_GET['orderby']=="it_sum_qty"){echo htmlspecialchars($query4ssch_sort);} ?>" href="<?php echo add_query_arg( array('orderby'=>'it_sum_qty'), $sct_sort_href); ?>">판매많은순</a></li>     
        <li id="sort_style"><a style="color: <?php if($_GET['orderby']=="price-asc"){echo htmlspecialchars($query4ssch_sort);} ?>" href="<?php echo add_query_arg( array('orderby'=>'price-asc'), $sct_sort_href); ?>">낮은가격순</a></li>     
        <li id="sort_style"><a style="color: <?php if($_GET['orderby']=="price"){echo htmlspecialchars($query4ssch_sort);} ?>" href="<?php echo add_query_arg( array('orderby'=>'price'), $sct_sort_href); ?>">높은가격순</a></li>      
        <li id="sort_style"><a style="color: <?php if($_GET['orderby']=="rating"){echo htmlspecialchars($query4ssch_sort);} ?>" href="<?php echo add_query_arg( array('orderby'=>'rating'), $sct_sort_href); ?>">평점높은순</a></li>     
        <li id="sort_style"><a style="color: <?php if($_GET['orderby']=="comment_count"){echo htmlspecialchars($query4ssch_sort);} ?>" href="<?php echo add_query_arg( array('orderby'=>'comment_count'), $sct_sort_href); ?>">후기많은순</a></li>    
        <li id="sort_style"><a style="color: <?php if($_GET['orderby']=="post_date"){echo htmlspecialchars($query4ssch_sort);} ?>" href="<?php echo add_query_arg( array('orderby'=>'post_date'), $sct_sort_href); ?>">최근등록순</a></li>      
 </ul>
</section>      
<!-- } 상품 정렬 선택 끝 -->  
 [/code]

1. 변수 $query4ssch_sort를 선언하여, 이 안에 정렬선택시 변경색상을 입력할 수 있게 하였습니다.

2. li 태그 안에 id를 삽입하여 css 커스터마이징이 가능하게 하였습니다.

3. 또한 a 태그 안에 style을 집어넣어 정렬 선택 시 색상이 변경되도록 하였습니다.

|

댓글 1개

멋지네요. 감사합니다.

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

그누커머스 팁자료실

그누커머스와 관련된 팁을 여러분들과 함께 공유하세요.
나누면 즐거움이 커집니다.
번호 제목 글쓴이 날짜 조회
25 6년 전 조회 2,422
24 7년 전 조회 5,123
23 7년 전 조회 2,411
22 7년 전 조회 3,170
21 8년 전 조회 3,440
20 8년 전 조회 7,222
19 8년 전 조회 4,987
18 8년 전 조회 4,475
17 8년 전 조회 3,670
16 8년 전 조회 3,611
15 9년 전 조회 3,092
14 9년 전 조회 3,451
13 9년 전 조회 5,143
12 9년 전 조회 4,821
11 9년 전 조회 5,014
10 9년 전 조회 5,228
9 9년 전 조회 5,265
8 9년 전 조회 4,610
7 9년 전 조회 5,138
6 9년 전 조회 7,296
🐛 버그신고