상품 리스트 페이지에서 정렬 옵션 선택했을 때 활성화 효과 > 영카트 강좌

본문 바로가기
사이트 내 전체검색

아이디비번찾기

영카트 강좌

그누보드 영카트 초보 사용자를 위한 기본 매뉴얼, 스킨 제작 기초강좌를 공유합니다.

상품 리스트 페이지에서 정렬 옵션 선택했을 때 활성화 효과

페이지 정보

작성자 관리자 작성일17-09-29 04:13 조회165회

본문

영카트 강좌

상품 리스트 페이지에서 정렬 옵션을 각각 선택했을 때 선택한 탭만 활성화 효과를 주는 방법입니다.

배경색을 바꾸는 걸로 해보겠습니다.


영카트 basic 스킨 기준입니다.

테마용 스킨을 사용 중이라면 테마 폴더에 있는 스킨을 수정해야 합니다.



1. skin/shop/basic/list.sort.skin.php 파일 수정


상단에 이렇게 추가합니다.


if($sort == 'it_sum_qty') $sort_class1 = ' sort_bg1';

if($sort == 'it_price' && $sortodr == 'asc') $sort_class2 = ' sort_bg2';

if($sort == 'it_price' && $sortodr == 'desc') $sort_class3 = ' sort_bg3';

if($sort == 'it_use_avg') $sort_class4 = ' sort_bg4';

if($sort == 'it_use_cnt') $sort_class5 = ' sort_bg5';

if($sort == 'it_update_time') $sort_class6 = ' sort_bg6';


같은 파일에서 정렬 옵션 선택 부분을 수정합니다.

class 부분이 추가되었습니다.


    <ul id="ssch_sort">

        <li><a href="<?php echo $sct_sort_href; ?>it_sum_qty&amp;sortodr=desc" class="btn01<?php echo $sort_class1 ?>">판매많은순</a></li>

        <li><a href="<?php echo $sct_sort_href; ?>it_price&amp;sortodr=asc" class="btn01<?php echo $sort_class2 ?>">낮은가격순</a></li>

        <li><a href="<?php echo $sct_sort_href; ?>it_price&amp;sortodr=desc" class="btn01<?php echo $sort_class3 ?>">높은가격순</a></li>

        <li><a href="<?php echo $sct_sort_href; ?>it_use_avg&amp;sortodr=desc" class="btn01<?php echo $sort_class4 ?>">평점높은순</a></li>

        <li><a href="<?php echo $sct_sort_href; ?>it_use_cnt&amp;sortodr=desc" class="btn01<?php echo $sort_class5 ?>">후기많은순</a></li>

        <li><a href="<?php echo $sct_sort_href; ?>it_update_time&amp;sortodr=desc" class="btn01<?php echo $sort_class6 ?>">최근등록순</a></li>

    </ul>



2. skin/shop/basic/style.css 파일에 추가


.sort_bg1, .sort_bg2, .sort_bg3, .sort_bg4, .sort_bg5, .sort_bg6 {border:1px solid #626870 !important;background:#626870 !important;color:#ffffff !important}

로그인 후 댓글을 남겨주세요.
영카트 강좌 목록
번호 제목
24 인덱스 페이지에 특정 상품 분류 페이지를 직접 출력하기 댓글1
23 상품 목록용 썸네일 이미지 별도로 사용하기
22 상품목록 스킨에 최소 최대 구매 수량 출력
21 메인페이지에 상품 문의 최신글 출력 댓글1
20 영카트 레이아웃을 특정 게시판에 적용하기 모바일 지원
19 상품 여분 필드에 스마트 에디터 적용
열람중 상품 리스트 페이지에서 정렬 옵션 선택했을 때 활성화 효과
17 상품 썸네일 이미지 여백 없이 생성 크롭 설정 변경
16 상품 여분 필드 사용 방법
15 Datepicker 특정 요일 선택 금지 영카트 희망 배송일에 사용
14 주문내역 목록에서 운송장번호 일괄등록 댓글1
13 상품 유형 관리에 이벤트 항목 추가 댓글3
12 모바일 페이지에서 상품 유형 아이콘 출력
11 상품 썸네일 이미지 일괄 삭제
10 주문금액이 일정 금액 이상일 때만 포인트 결제 사용 가능
9 메인페이지나 상품 목록 스킨에서 글자수 자르기
8 상품 이미지 10개 이상 등록하기
7 상품 판매가격 회원들에게만 노출
6 영카트 분류메뉴 중간에 특정 메뉴를 끼워넣는 방법 - PC
5 영카트 분류메뉴 중간에 특정 메뉴를 끼워넣는 방법 - 모바일 댓글10
4 도메인 접속시 첫 화면에 쇼핑몰이 바로 나오게 하는 방법 댓글1
3 영카트 모바일에서 상품 상세페이지 화면을 PC화면처럼 보이기 댓글1
2 메인페이지 상품 최신글에 분류명 출력하기
1 상품 상세페이지에서 상품 정보 고시 삭제하기
게시물 검색


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

Copyright © GNUSTUDY. All rights reserved.
상단으로