1. XpressEngine에서 메뉴를 만드는 법에 대해 살펴보자. 메뉴를 만들기 위해서는 “사이트 설정”의 “메뉴”를 클릭한다음 “생성” 버튼을 클릭한다.
2. 메뉴관리 화면에서 적당한 메뉴제목을 정한다음 “등록” 버튼을 클릭한다. 여기서는 제목을 “메인메뉴”로 했다. 메뉴는 서로 다른 제목으로 다수의 메뉴를 생성할 수 있는데 여기서는 하나의 메뉴만 만들어 보겠다.
2. 등록 확인을 위한 팝업창에서 “확인” 버튼을 클릭한다.
3. 메뉴관리 화면에 “메인메뉴”라는 제목의 메뉴가 생성됐으면 환경설정 아이콘(톱니바퀴 모양)을 클릭한다.
4. 환경설정 화면은 아래와 같다. 여기서 녹색 “+” 아이콘을 클릭하면 “메뉴” 아래에 다른 메뉴를 생성할 수 있다. 이제 메뉴 생성을 위해 “+” 아이콘을 클릭해 보자.
5. “+” 기호를 누르면 창이 뜨는데 “메뉴명” 항목에 “공지사항”이라 입력한 뒤 “연결URL”의 “mid 찾기”를 클릭한다.
6. “연결 URL”을 클릭하면 아래와 같이 만들어진 게시판들의 목록을 나타내는 창이 뜨는데 여기서 공지사항 게시판 우측의 “선택” 버튼을 클릭한다. 이는 “공지사항” 메뉴를 클릭했을 때 “공지사항” 게시판으로 이동할 수 있도록 연결한다.
7. “연결 URL” 항목에 “notice”가 표시되었다. 이는 “공지사항” 게시판의 모듈이름이다. 이처럼 XpressEngine에 의해 생성된 모듈의 경우 모듈 이름을 “연결 URL”에 입력하면 메뉴를 클릭했을 경우 해당 모듈로 이동할 수 있다. 이제 “notice”를 확인했으면 “저장” 버튼을 클릭한다.
8. 팝업창에서 “확인” 버튼을 클릭한다.
9. 그러면 아래 그림과 같이 “메뉴” 아래에 “공지사항” 이란 이름으로 메뉴가 하나 달렸고 그 우측에 서브메뉴 추가 아이콘(+ 기호), 환경설정 아이콘(톱니바퀴 모양), 삭제 아이콘(- 기호)이 표시된다.
10. 위 과정을 참고하여 아래와 같은 메뉴를 생성하고 각 메뉴를 해당 게시판에 연결한다. 이때 각 게시판은 이미 만들어져 있어야 한다.
11. 위와 같은 형태의 메뉴를 만들었으면 “메뉴” 우측의 “+” 아이콘을 클릭하여 “메뉴명”에 “추천사이트”를 입력하고 “저장” 버튼을 클릭한다. 여기서 “연결 URL”에는 아무런 값도 입력하지 않았는데 이런 경우 실제 완성된 사이트에서 “추천사이트” 메뉴를 클릭해도 페이지 이동이 없고 아무런 변화도 나타나지 않는다.
12. 이제 “추천사이트” 아래에 서브메뉴를 만들기 위해 “추천사이트” 우측의 “+” 아이콘을 클릭한다.
13. 설정창이 뜨면 “메뉴명”에 “안산1대학”을 “연결 URL”에 안산1대학 홈페이지 주소인 “http://www.ansan.ac.kr”를 직접 입력한다. 이처럼 주소를 직접 입력하는 것도 가능하다. 주소를 입력했으면 “저장” 버튼을 클릭한다.
14. 마찬가지로 “추천사이트”에 “인터넷정보”과 메뉴를 추가해보자.
15. “메뉴명”에는 인터넷정보과”, “연결 URL”에는 “http://info.ansan.ac.kr”을 입력한다음 저장버튼을 클릭한다.
16. 이제 각 게시판 메뉴에 서브메뉴를 만들어 이 서브메뉴를 클릭하면 해당 게시판의특정 분류를 선택했을 때와 같은 화면으로 이동하도록 해 보겠다.
17. 우선 공지사항 게시판에서 “출사” 분류를 선택하 보자. 그러면 주소창의 주소가
“http://hostname/~unixid/xe/?mid=notice&category=xx”와 같은 형태로 바뀌는데 이때 “?”를 포함한 뒷 부분의 주소(?mid=notice&category=xx)를 복사한다.
18. 이제 메뉴관리 화면으로 돌아와 “공지사항” 메뉴 우측의 “+” 아이콘을 클릭하여 뜨는 창에 “메뉴명”을 “출사알림”, “연결 URL”에는 위에서 복사한 “?” 이후의 주소를 붙여 넣는다. 그런다음 “저장” 버튼을 클릭한다.
19. 그러면 “공지사항” 메뉴 아래에 서브메뉴 “출사알림”이 추가된것을 확인할 수 있다. 실제 사이트에서 “출사알림” 메뉴를 클릭하면 “공지사항” 게시판에서 “출사” 분류를 선택했을 때와 같은 화면으로 이동한다.
20. 위 내용을 토대로 아래와 같은 구조의 메뉴를 구성해 보자.
