본 게시물에서는 세로 방향 메뉴를 구성하는 사이드바에 대해 알아보자.



지금까지 제작한 교재 사이트에는 [가로 방향 탐색]으로 메뉴가 구성되어 있다. 이 메뉴를 세로 방향 메뉴로 전환해보자. [작업 선택 메뉴 열기(m)]-[사이트 레이아웃 수정] 누른다.



[사이트 레이아웃 수정]에 있는 [가로 방향 탐색] 오프시키고 [사이드바]활성화시킨다. 



그러면 가로 방향으로 배치되어 있던 메인 메뉴와 하위 메뉴가 아래 그림과 같이 세로 방향으로 나타난다.



[사이드바]의 세로 방향 메뉴에 마우스를 올리면 [탐색]이 나타난다. 이 [탐색]을 누른다.



[탐색 설정] 창이 나타나면 [내 탐색 트리를 자동으로 구성]에 체크가 되어 있는 것을 확인할 수 있다. 이 기능이 체크되어 있으면 [가로 방향 탐색]에 설정된 메뉴를 세로 방향으로 자동 배치하게 된다. 만약 여러분이 메뉴 구성을 새롭게 하고자 한다면 [내 탐색 트리를 자동으로 구성]에 체크를 풀어준다.



그러면 [가로 방향 탐색]에서 메뉴를 구성했던 창이 나타나게 된다. [페이지 추가]를 눌러 새롭게 배치할 메뉴 구성이 가능하다.



다음으로 왼쪽에 배치되어 있는 세로 방향 메뉴를 오른쪽으로 이동해보자. [사이드바]에 있는 [수정] 버튼을 누른다.



[사이드바 수정]에 있는 [오른쪽에]를 선택하고 [확인] 버튼을 누른다.



설정을 마치면 [닫기] 버튼을 누른다. 



그러면 아래 그림과 같이 세로 방향 메뉴가 오른쪽에 배치되는 것을 확인할 수 있다. 세로 방향 메뉴를 오른쪽에 배치할 경우에는 [사이트 레이아웃 수정][사이트 너비]를 조정하여 메뉴가 페이지의 본문과 겹치지 않도록 할 필요가 있다.



Posted by inulibarts
,