현재 위치
  1. 게시판
  2. 유용한 웹 팁

유용한 웹 팁

쇼핑몰 운영에 도움이 되는 정보들입니다.

게시판 상세
제목 모바일 디자인 상단 메뉴바 색상 변경하기
작성자 별모아디자인 (ip:)
  • 평점 0점  
  • 작성일 2022-03-30
  • 추천 추천하기
  • 조회수 30

< 모바일 디자인 상단 메뉴바 색상 변경하기 >





위의 이미지에서 빨간박스 부분의 색상 변경 방법입니다.


 별모아 28번 모바일 디자인의 상단 메뉴바 색상은 현재 녹색입니다. 

다른 색상으로 수정하고싶으시면 아래 설명대로 해주세요. 

 

일단 상단 메뉴바 부분은 왼쪽의 전체 상품목록 부분과 오른쪽의 장바구니, 주문조회, 커뮤니티 로 나누어져있는데 

전체 상품목록 부분은 진한 녹색이고 장바구니, 주문조회, 커뮤니티 부분은 밝은 연두색입니다.


관리자 페이지에서 모바일 쇼핑몰 > 디자인 보관함에서 대표 디자인의 '수정' 버튼을 클릭하면 

스마트 디자인 편집창이 뜹니다. 

편집창 좌측 하단의 화면명 검색에서 layout.css 을 검색하신 후

/layout/basic/css/layout.css 에 체크 후 선택파일열기 버튼을 클릭하시면

해당 파일이 열립니다.


소스창에서 273행 근처에 보면 아래와 같은 소스가 보입니다. 

아래 소스는 전체 상품목록 부분의 소스입니다.

 



/* 전체 상품목록 */

.category_inner { 

           width:120px;

           height:34px;

           line-height:34px;

           background-color:#44aa00;

           margin: 0 auto; 

           font-size:14px;

           color:#ffffff;

           }


 


그리고 255행 근처에 보면 아래와 같은 소스가 보입니다. 

아래 소스는 장바구니, 마이쇼핑, 커뮤니티 부분의 소스입니다.

 


/* 장바구니, 마이쇼핑, 커뮤니티 */

#top_menu2 {

    margin-top:0px;

    background-color: #8bc223;

    height: 34px;

    width: 100%;

    }


 


위의 소스에서 각각 빨강색으로 표시된 부분을 원하시는 색상 코드로 각각 수정해주신 후 

스마트 디자인 편집창 상단 왼쪽의 ‘저장’ 버튼을 클릭해주시면 됩니다. 

색상 코드 수정하실 때 색상 코드 바로 뒤에 있는 ; 가 지워지지않도록 유의해주세요. 

 




첨부파일
비밀번호 수정 및 삭제하려면 비밀번호를 입력하세요.
댓글 수정

비밀번호 :

/ byte

비밀번호 : 확인 취소

댓글 입력
댓글달기 이름 : 비밀번호 : 관리자답변보기

영문 대소문자/숫자/특수문자 중 2가지 이상 조합, 10자~16자

/ byte

왼쪽의 문자를 공백없이 입력하세요.(대소문자구분)

관리자에게만 댓글 작성 권한이 있습니다.