동적뷰의 텝 페이지를 드롭다운 메뉴로 변경시키기

그림1

그림2

동적뷰에서 탭 페이지는 <그림1>에서 처럼 헤더 아래 검은 바에 가로로 표시됩니다.
아래의 코드는 탭 페이지를 <그림2>와 같이 드롭다운 메뉴로 바꿔줍니다.

 #header.header .header-drawer #pages.tabs ul li{  
 margin: 100000px;  
 }  

코드 삽입 위치는 [대시보드 → 템플릿 → 맞춤설정 → 고급 → CSS추가] 이며, 코드의 출처는 해외 블로거 southernspeakers 입니다.

참고로, 드롭다운 메뉴 최상단에는 <그림2>에서 보시는 바와 같이 'Pages'라고 표시됩니다. 이 문구를 원하는 문구로 바꿀 수 있지 않을까 싶어서 테스트용 블로그에서 여러 방식으로 시도해보았습나다만, 방법을 찾을 수 없었습니다.


! 내용수정

'Pages' 바꾸는 방법에 대해 +Hui-Su Jeong 님께서 댓글로 링크를 남겨 주셨네요. 아래에 해당 코드를 추가하였습니다.

 #pages span:first-child{  
 font-size: 0px !important;  
 }  
 #pages .menu-heading:before, .ss{  
 content: "목록";  
 font-size: 15px !important;  
 }  

코드 삽입 위치는 마찬가지로 [대시보드 → 템플릿 → 맞춤설정 → 고급 → CSS추가] 입니다. 삽입하실 때 '목록' 대신 원하는 글자를 입력하시면 됩니다.