본 게시물에서는 세로 방향 메뉴를 구성하는 사이드바에 대해 알아보자.
지금까지 제작한 교재 사이트에는 [가로 방향 탐색]으로 메뉴가 구성되어 있다. 이 메뉴를 세로 방향 메뉴로 전환해보자. [작업 선택 메뉴 열기(m)]-[사이트 레이아웃 수정]을 누른다.
[사이트 레이아웃 수정]에 있는 [가로 방향 탐색]을 오프시키고 [사이드바]를 활성화시킨다.
그러면 가로 방향으로 배치되어 있던 메인 메뉴와 하위 메뉴가 아래 그림과 같이 세로 방향으로 나타난다.
[사이드바]의 세로 방향 메뉴에 마우스를 올리면 [탐색]이 나타난다. 이 [탐색]을 누른다.
[탐색 설정] 창이 나타나면 [내 탐색 트리를 자동으로 구성]에 체크가 되어 있는 것을 확인할 수 있다. 이 기능이 체크되어 있으면 [가로 방향 탐색]에 설정된 메뉴를 세로 방향으로 자동 배치하게 된다. 만약 여러분이 메뉴 구성을 새롭게 하고자 한다면 [내 탐색 트리를 자동으로 구성]에 체크를 풀어준다.
그러면 [가로 방향 탐색]에서 메뉴를 구성했던 창이 나타나게 된다. [페이지 추가]를 눌러 새롭게 배치할 메뉴 구성이 가능하다.
다음으로 왼쪽에 배치되어 있는 세로 방향 메뉴를 오른쪽으로 이동해보자. [사이드바]에 있는 [수정] 버튼을 누른다.
[사이드바 수정]에 있는 [오른쪽에]를 선택하고 [확인] 버튼을 누른다.
설정을 마치면 [닫기] 버튼을 누른다.
그러면 아래 그림과 같이 세로 방향 메뉴가 오른쪽에 배치되는 것을 확인할 수 있다. 세로 방향 메뉴를 오른쪽에 배치할 경우에는 [사이트 레이아웃 수정]의 [사이트 너비]를 조정하여 메뉴가 페이지의 본문과 겹치지 않도록 할 필요가 있다.
'웹과 인터넷' 카테고리의 다른 글
[웹인] Google 검색 (1) - 구글 검색의 특징 (0) | 2014.06.01 |
---|---|
[웹인] Google 사이트 도구 (27) - 템플릿 갤러리 사용하기 (0) | 2014.05.22 |
[웹인] Google 사이트 도구 (25) - 배경 바꾸기 (0) | 2014.05.21 |
[웹인] Google 사이트 도구 (24) - 모바일 페이지 설정 [완료] (0) | 2014.05.16 |
[웹인] Google 사이트 도구 (23) - favicon 이미지 삽입 (0) | 2014.05.16 |