Elegant Themes의 Divi에서 메가 메뉴 만들기

Avada, Enfold, Newspaper 등 일부 유료 워드프레스 테마에 메가 메뉴 기능이 내장되어 있어 메뉴 항목을 클릭했을 때 메뉴가 모두 표시되도록 만들어지는 메가 메뉴를 구현할 수 있습니다. Elegant Themes의 Divi에서도 간단히 메가 메뉴를 만들 수 있습니다.

참고로 메가 메뉴는 SEO에 좋지 않은 것으로 알려져 있습니다. SEO에 유리한 메뉴 구조에 대하여 "SEO(검색엔진최적화)에 유리한 웹사이트 메뉴 구조"를 참고해보세요.

[ 이 글은 2021년 12월 13일에 최종 업데이트되었습니다. ]

Elegant Themes의 Divi 테마 메가 메뉴 만들기

Divi 테마 메가 메뉴(Mega Menu) 만들기 단계 요약

실제 작동은 여기에서 확인해볼 수 있습니다. 자세한 방법을 "Creating Mega Menus In Divi (Divi에서 메가메뉴 만들기)"에서 확인할 수 있습니다. 그리고 위의 과정이 다음 동영상에 설명되어 있으니 참고하세요.

메가 메뉴를 지원하지 않는 테마의 경우 플러그인을 사용하여 메가 메뉴 기능을 구현할 수 있습니다.

• UberMenu 메가 메뉴
• 메가 메뉴 플러그인
• 반응형 메뉴 플러그인 Superfly

Enfold 테마에서 메가 메뉴 사용하기

인기 테마인 Enfold 테마에서도 쉽게 메가 메뉴를 구성할 수 있습니다. Enfold에서는 외모 > 메뉴에서 해당 메뉴 항목에 있는 "Use as Mega Menu"(메가 메뉴로 사용) 옵션을 클릭하면 됩니다.

그러면 다음과 같이 Mega Menu가 작동합니다.

다음 동영상을 참고해보세요. (Enfold 메가 메뉴 항목에 이미지를 추가하는 방법도 설명하고 있습니다.)

아바다 테마에서 메가 메뉴 사용하기

워드프레스 유료 테마 중 가장 많이 판매되고 있는 베스트셀링 테마인 아바다(Avada)에도 메가 메뉴 기능이 기본적으로 내장되어 있습니다. 아바다는 테마 옵션에서 메가 메뉴 설정을 구성할 수 있습니다.

그리고 실제 메뉴에 메가 메뉴 기능을 추가하려면 외모 > 메뉴에서 원하는 메뉴의 1차 메뉴 항목에 표시되는 "Avada Options"를 클릭하면 됩니다.

Avada Optoins를 클릭하면 메뉴 옵션이 표시됩니다. 맨 아래의 Fusion Mega Menu의 옵션을 "On"으로 설정하면 추가로 "Full Width Mega Menu"(전체 폭 메가 메뉴), 메가 메뉴 컬럼 수, Mega Menu Thumbnail(메가 메뉴 썸네일)이라는 숨겨진 옵션이 표시됩니다.

메가 메뉴 옵션은 1차 메뉴 항목(최상위 메뉴 항목)에서만 구성이 가능합니다.

GeneratePress 테마 메가 메뉴 만들기

제너레이트프레스 테마에는 메가 메뉴 기능이 탑재되어 있지 않지만 심플한 메가 메뉴를 원하는 경우 CSS를 사용하여 메가 메뉴를 추가할 수 있습니다. 자세한 내용은 "워드프레스 GeneratePress 테마 메가 메뉴 만드는 방법"을 참고해보세요.

참고:

• Divi에서 레볼루션 슬라이더(Revolution Slider)를 전체 너비로 추가하는 방법