본문 바로가기
Wordpress/theme

Twenty Twenty 테마 살펴보기 - (2/3)

by aegypius 2020. 6. 14.
728x90
반응형

  아직 어떠한 메뉴도 만들지 않았기 때문에  테마디자인 -> 사용자 정의하기 -> 메뉴를 선택하면 새로운 메뉴를 생성할 수 있는 '새 메뉴 생성' 버튼과 그 아래의 메뉴 위치에서 모든 위치 보기를 선택할 수 있다. 여기서 twenty twenty 테마는 메뉴가 표시될 수 있는 영역이 모두 다섯 곳이라는 것을 알 수 있다. 이것은 적용한 테마마다 다르며, 위젯이나 플러그인 등을 통해서 변화를 줄 수 있다.

  새 메뉴 생성버튼을 클릭하면 아래와 같이 생성할 메뉴의 이름메뉴의 위치를 선택할 수 있다.

  워드프레스는 메뉴를 만들 수 있는 메뉴(?)가 여러 경로에 있다. 어떤 경로를 통해서 접근하던지 메뉴의 생성, 삭제, 수정 등을 위한 영역이지만, 접근 경로에 따라서 인터페이스가 조금 다를 수 있다. 위의 그림과 같이 테마 디자인->사용자 정의하기->메뉴테마 디자인->메뉴는 조금 다르다. 기본 메뉴를 작성한 후에 편한 곳에서 작업하자.

  테마 디자인->메뉴의 경로를 통해서 메뉴를 생성해보자.

  메뉴 생성의 첫 단계는 메뉴의 이름을 지어주는 것이다. 중앙의 메뉴 구조에서 메뉴 이름을 설정하자. 한글이나 영문 어떤 것이든 상관없다. 일단 토끼메뉴1로 설정하고 그 옆의 메뉴 생성 을 클릭하자.

  좌측의 메뉴 아이템 추가에서는 메뉴에 포함될 항목을 설정할 수 있고, 우측의 메뉴 설정에서는 메뉴의 위치를 설정한다.

  메뉴 아이템 추가를 보자. 페이지, 글, 사용자 정의 링크, 카테고리 이렇게 4개로 요소가 바로 워드프레스의 메뉴가 될 수 있는 항목들이다. 페이지의 모두보기 탭을 선택하여 메뉴로 사용할 페이지를 선택해보자. 기본 등록되어 있는 홈을 포함해서 About US, Careers, Products, Service 등 모든 페이지를 선택하고 아래의 메뉴에 추가버튼을 클릭하자. 글에서도 애국가와 테마 두 개를 모두 선택하여 메뉴에 추가하자. 마지막으로 카테고리의 두 항목 news와 공지사항도 모두 메뉴에 추가하자.

  우측의 메뉴 구조 영역에 지금까지 메뉴로 사용하기 위해 추가했던 항목들이 세로로 나열된다. 나열된 순서대로 메뉴에 나타나며 원하는 순서대로 정렬할 수 있다.

  아래의 이미지는 메뉴 구조의 최종 설정과 사이트에 접속했을 때의 모습이다.  메뉴 설정옵션의 '페이지 자동 추가' 때문에 페이지가 자동으로 메뉴에 추가되었나보다.

 상단의 위치 관리하기 탭을 선택하면 보다 구체적으로 메뉴를 관리할 수 있다. 일반 데스크탑에서 보여지는 메뉴(Desktop Horizontal Menu)와 확장메뉴(Desktop Expanded Menu), 모바일로 접속했을 때 보여지는 메뉴(Mobile Menu), 하단의 푸터메뉴(Footer Menu), 그리고 소셜메뉴(Social Menu) 등을 모두 별개의 메뉴로 만들어서 접속자의 상황에 맞게 메뉴를 달리할 수도 있다. 직접 테스트 해보자.


728x90
반응형

'Wordpress > theme' 카테고리의 다른 글

아스트라(ASTRA) 테마...  (0) 2021.10.29
Twenty Twenty 테마 살펴보기 - (1/3)  (0) 2020.06.12

댓글