워드프레스 아바다 테마에서 메가 메뉴 사용하기

6

워드프레스 베스트셀링 테마인 아바다에는 메가 메뉴 기능이 탑재되어 있습니다. 아바다 테마에서 제공되는 데모 중 하나인 University 데모를 로드하고 Events 메뉴에 마우스를 올려보면 그림과 같이 메가 메뉴로 표시됩니다.

워드프레스 아바다 테마 메가 메뉴

위의 그림에서 Events 아래에 4개의 하위 메뉴 항목이 있으며, 각 하위 메뉴 항목에 별도의 위젯 영역이 할당되어 있습니다.

Avada 테마에서 메가 메뉴를 구성하는 방법

아바다에서 메가 메뉴를 구성하려면 하려면 먼저 외모 > 메뉴에서 다음과 비슷하게 메뉴 구조를 만들도록 합니다.

아바다 메가 메뉴 만들기

상위 메뉴 항목(위의 그림에서는 COURSES)을 클릭하고 Avada Mega Options(아바다 메가 옵션) 아이콘을 클릭합니다.

아바다 테마 메가 메뉴

그러면 아바다 메가 메뉴 옵션 창이 표시됩니다.

아바다 테마 메가 메뉴

Fusion Mega Menu(퓨전 메가 메뉴)의 옵션을 Off에서 On으로 설정하면 숨겨진 옵션이 표시됩니다.

전체 폭으로 메가 메뉴를 표시하려는 경우 Full Width Mega Menu(전체 너비 메가 메뉴)On으로 설정합니다. 그리고 원하는 경우 Mega Menu Number of Columns(메가 메뉴 열 개수)를 조정할 수도 있습니다. 기본적으로 자동으로 설정되어 있습니다.

이제 하위 메뉴 항목 각각에 대하여 위젯 영역을 배정합니다. 이 작업을 수행하기 전에 먼저 각 위젯 영역에 위젯을 배치하도록 합니다. 가령 이미지나 텍스트 등을 적절히 배치할 수 있습니다.

위젯 영역이 추가로 필요한 경우 외모 > 위젯에서 Add New Widget Section(새 위젯 섹션 추가)을 클릭하여 새로운 위젯 영역을 하나 만들도록 합니다.

아바다 위젯 영역 추가하기

메가 메뉴에 표시할 위젯 영역에 적절한 위젯을 추가했다면, 각 하위 메뉴 항목에 해당 위젯 영역을 배정합니다.

하위 메뉴 항목(예: Business Seminar)에서 Avada Menu Options를 클릭합니다.

아바다 메가 메뉴 구성하기

아바다 메가 옵션에서 다양한 옵션을 설정할 수 있습니다. 예를 들어, 아이콘을 선택하거나 Menu Highlight Label(강조 표시 레이블)을 추가할 수 있습니다.

아바다 메가 메뉴 옵션

아래로 내려서 Mega Menu Widget Area(메가 메뉴 위젯 영역)로 이동합니다.

아바다 메가 메뉴 구성하기

Mega Menu Widget Area에서 원하는 위젯 영역을 선택하도록 합니다. 이외에 Mega Menu Thumbnail(메가 메뉴 썸네일)Mega Menu Background Image(메가 메뉴 배경 이미지) 등도 지정할 수 있습니다.

각 하위 메뉴에 대하여 이 작업을 수행하면 메뉴 메뉴 구성이 완료됩니다. 이제 확인해보면 구성한 대로 메가 메뉴가 표시될 것입니다.

개인적으로는 심플한 메뉴 구조를 선호합니다. 이 블로그에 적용된 Publisher 테마에도 메가 메뉴가 있지만 메가 메뉴 기능을 사용하지 않고 꼭 필요하다고 생각되는 메뉴 항목만 표시하도록 노력했습니다. (Enfold, Newspaper 등 인기 유료 테마에서도 메가 메뉴 기능을 제공합니다.)

메뉴와 SEO에 대한 내용은 다음 글을 참고해보시기 바랍니다.

참고로 부분적으로 번역된 아바다 언어 파일을 여기에서 다운로드할 수 있습니다.

Related Posts