▣宇山 웹디자인/홈페이지 만들기

제로보드 XE로 홈페이지 만들기 - 제5장 서브메뉴(게시판용) 만들기 / 우산

woosanje 2013. 6. 26. 18:03

제로보드 XE로 홈페이지 만들기

 

제5장 서브메뉴(게시판용) 만들기

 

지난번에 메인메뉴를 만들어 보았습니다

이번에는 home 메뉴를 "홈페이지로 사용하기" 지정을 해주고

각 메인메뉴에 대한 하위 서브메뉴를 만들어 보겠습니다.

 

1. XE 관리자 페이지 로그인 하기

  먼저, 각자 닷홈 계정에 관리자로 로그인합니다

  (로그인 방법 두가지 : 지난 4강좌 참조)

 

2. 홈페이지로 사용하기 지정

관리자 페이지에서 "사이트메뉴편집"화면을 클릭해 살펴보면,

 

2-1 현재 홈페이지 확인

welcompage 폴더와 유랑_Wandering 폴더가 있는데

그림에서 보시면 welcom page옆에 홈 아이콘이 보입니다. 즉 홈페이지로 사용하고 있는걸 보여줍니다

 

 

2-2 홉페이지 바꾸기

이 지정을 유랑_Wandering 폴더에 있는 home으로 간단히 바꿔보겠습니다

①유랑 폴더에 있는 home을 클릭하면 오른쪽에 작업창이 나옵니다

②이 작업창에서 "홈페이지로 사용하기"를 클릭해주면 됩니다

 

 

3-3 홈페이지 바뀐 결과 확인

ㅇ아래 그림에서 보듯 홈페이지로 사용할 메뉴가 home으로 변경된 것을 확인할 수 있습니다

"홈페이지로 사용중"이라고 표시됩니다.

 

 

 

 

3. 메인메뉴에 서브메뉴 만들기

스토리보드를 참고해 보시면 메인메뉴 다섯개에서 home을 제외한 나머지 네개에

각각 2개씩의 서브메뉴가 있습니다

home -

여행 - 유럽여행, 아시아여행

포토 - 여행풍경, 항아갤러리

영상 - 플래시, 스위시

강좌 - 일러스트강좌, 홈페이지강좌

가 있습니다

 

오늘은 여행(위젯페이지)이라는 주메뉴에 -

유럽여행(게시판용), 아시아여행(게시판용) 이라는 서브메뉴를

만들어보겠습니다

 

4. 여행/유럽여행 게시판 추가 작업

 다음 순서(그림 참조)대로 클릭하세요

4-1 유랑폴더에서 여행 메뉴 클릭 / 메뉴추가 클릭 / 게시판 클릭 

 

 

4-2 게시판 작업창에서 입력

ㅇ메뉴이름은 유럽여행, 메뉴아이디는 europe 이라고 입력하고 확인 버튼 클릭

*각자 나름대로의 스토리보드로 진행하시고 계신분은 준비한대로 입력

 

 

4-3 게시판 생성 확인

ㅇ아래와 같이 유랑 폴더 - 여행(주메뉴)에 - 유럽여행(서브메뉴)가 생성된 것이 보입니다

 

 

 

5 여행/아시아여행 게시판 추가 작업

 

ㅇ똑같은 방법으로 하나 더 만듭니다.

5-1  유랑폴더에서 여행 메뉴 클릭 / 메뉴추가 클릭 / 게시판 클릭 

 

 

5-2 게시판 작업창에서 입력

ㅇ 메뉴이름은 아시아, 메뉴아이디는 asia로 입력하고 확인 버튼 클릭하여 생성

 

 

5-3 게시판 생성결과 확인 

ㅇ아래 그림과 같이 여행 이라는 주메뉴에

유럽여행과 아시아여행이라는 서브메뉴가 생성되었으며

이들은 추후 게시판으로 사용될 예정입니다

 

 

 

6. 나머지 메인메뉴에 대한 서브메뉴 만들기 : 생략

 나머지 메인메뉴에 대한 서브메뉴를 각자 만들기 바랍니다

위 4번 5번 항목을 따라하시면 됩니다.

(준비한 스토리보드를 보고 만드세요)

 

7. 서브메뉴 완성결과

제가 유랑 스토리보드에 따라 만든 서브메뉴 결과는 아래와 같습니다

 

 

 

 

다음 제6강좌 "레이아웃 적용하기" / 우산

다음 강좌에서는 우리가 만든 메뉴에 프레임, 폰트종류, 크기, 배경색 등의

디자인을 적용해 보겠습니다

 

※ 강좌 자료를 만들어가며 진행하기 때문에 다음 강좌를 너무 재촉하지 마세요~

현재 일주일에 두번정도 올리고 있습니다

다른 어느 시리즈 강좌에 비해도 진도가 매우 빠른겁니다.ㅎ