아래는 별모아 No 82 디자인의 상단 메뉴바 색상을 변경하는 방법입니다.
PC디자인과 모바일 디자인 각각 수정해주셔야 합니다.
< 상단 메뉴바 색상 수정하기 - PC디자인 >
PC디자인 상단의 로고 바로 아래에 있는 검정색으로 된 메뉴바 색상을 원하시는 색상으로 수정하는 방법입니다.
디자인 관리 > 디자인 보관함 에서 해당 디자인의 수정 버튼을 클릭하여
스마트 디자인 편집창이 뜨면 편집창 왼쪽 하단의 화면명 검색에서 layout.css 파일을 검색하여
/layout/basic/css/layout.css 에 체크 후 선택파일열기 버튼을 클릭합니다.
편집창 하단에 3개의 작은 아이콘이 있는데 가장 오른쪽 아이콘을 클릭하시면
소스 편집창을 넓게 사용 가능합니다.
소스 중에서 44행 근처에 아래 소스가 있습니다.
아래 소스 중에서 빨간색으로 된 부분을 원하시는 색상 코드로 수정해주시기 바랍니다.
(유의사항) 색상코드 바로 뒤의 ; 가 지워지지않도록 유의 바랍니다.
코드 수정 후 스마트 디자인 편집창 왼쪽 상단의 ‘저장’ 버튼을 반드시 클릭해주세요.
/* 모든환경 : 상단메뉴2 전체영역 (전체 상품목록 & 카테고리 or 메뉴) */
#top_menu2_outer { width:100%; background-color:#4f4f4f; z-index:99; }
아래는 참고사항입니다.
메뉴바에 있는 현재 흰 색으로 되어있는 텍스트 색상도 다른 색상으로 수정하고싶으시면
모바일쇼핑몰 > 디자인 보관함에서 해당 디자인의 수정 버튼을 클릭하여
스마트 디자인 편집창이 뜨면 편집창 왼쪽 하단의 화면명 검색에서 nav.css 파일을 검색하여
/css/nav.css 에 체크 후 선택파일열기 버튼을 클릭합니다.
소스 중에서 11행 근처에 아래 소스가 있습니다.
아래 소스 중에서 빨간색으로 된 부분을 원하시는 색상 코드로 수정해주시기 바랍니다.
(유의사항) 색상코드 바로 뒤의 ; 가 지워지지않도록 유의 바랍니다.
코드 수정 후 스마트 디자인 편집창 왼쪽 상단의 ‘저장’ 버튼을 반드시 클릭해주세요.
/* 대분류 */
#category-lnb .d1-wrap { display:inline-block; text-align:center; margin-left:-24px; }
#category-lnb .d1-wrap li { z-index:1; float:left; padding-right:50px; height:50px; line-height:50px; }
#category-lnb .d1-wrap li a { font-size:15px; color: #ffffff; font-weight:bold; }
#category-lnb .d1-wrap a:hover { color:#fb8728; }
------------------------------------------------------------------------------------------------------------------------------------
< 상단 메뉴바 색상 수정하기 - 모바일디자인 >
모바일 디자인 상단의 상품 검색창 바로 아래에 있는
검정색 메뉴바 색상을 원하시는 색상으로 수정하는 방법입니다.
모바일쇼핑몰 > 디자인 보관함에서 해당 디자인의 수정 버튼을 클릭하여
스마트 디자인 편집창이 뜨면 편집창 왼쪽 하단의 화면명 검색에서 layout.css 를 검색하여
/layout/basic/css/layout.css 에 체크 후 선택파일열기 버튼을 클릭합니다.
소스 중에서 324행 근처에 아래 소스가 있습니다.
아래 소스 중에서 빨간색으로 된 부분을 원하시는 색상 코드로 수정해주시기 바랍니다.
(유의사항) 색상코드 바로 뒤의 ; 가 지워지지않도록 유의 바랍니다.
코드 수정 후 스마트 디자인 편집창 왼쪽 상단의 ‘저장’ 버튼을 반드시 클릭해주세요.
/* 상단메뉴 2 전체영역 - 전체 상품목록, 장바구니, 마이쇼핑, 커뮤니티 */
#top_menu2 {
margin-top:0px;
border-top: 0px solid #999999;
border-bottom: 0px solid #e1e1e1;
background-color:#333333;
font-weight:bold;
height: 34px;
width: 100%;
}
아래는 참고사항입니다.
메뉴바에 있는 현재 흰 색으로 되어있는 텍스트 색상도 다른 색상으로 수정하고싶으시면
388행 근처에 아래 소스에서 아래 4개의 색상코드를 수정해주신 후
스마트 디자인 편집창 왼쪽 상단의 ‘저장’ 버튼을 반드시 클릭해주세요.
/* 상단메뉴 2 전체 링크영역 */
#top_menu2 a:link {
color:#ffffff;
}
#top_menu2 a:visited {
color:#ffffff;
}
#top_menu2 a:hover {
color:#ffffff;
}
#top_menu2 a:active {
color:#ffffff;
}
관리자에게만 댓글 작성 권한이 있습니다.