워드프레스 일기의 메가 메뉴 3

엘리멘터에서 한국어 메가 메뉴를 구현하는 방법에 대하여 살펴본 적이 있습니다. 최상위 메뉴 위에 마우스를 올리면 전체 메뉴가 펼쳐지도록 하는 메뉴가 우리나라에서 많이 이용되고 있습니다.상기 영상과 같이 구현하려면 ElementsKit라는 엘리멘터 애드온을 사용할 수 있습니다. 이 플러그인을 사용하면 엘리멘터의 기능을 확장할 수 있기 때문에 편리하지만, 한편으로는 덩치가 큰 추가적인 플러그인을 사용하기 때문에 사이트 속도에 영향을 미칠 수 있습니다. 또한, 입맛대로 커스텀하기에 쉽지 않을 수 있습니다.개별 메뉴 항목 위에 마우스를 올렸을 때 각 메뉴 항목에 따라 다른 메가 메뉴 콘텐츠가 펼쳐지도록 하고 싶은 경우 엘리멘터 프로의 Menu 엘리먼트를 사용할 수 있습니다. 자세한 방법은 다음 글을 참고하시기 ..

앞서 엘리멘터 프로(Elementor Pro)에서 메가 메뉴 및 한국형 메가 메뉴를 만드는 방법에 대하여 살펴본 적이 있습니다. 조금 응용하여 아스트라(Astra) 테마에서 한국형 메가 메뉴를 만들어 보았습니다. 엘리멘터(Elementor)로 한국형 메가 메뉴 만들기메가 메뉴는 SEO적인 측면에서 그리 바람직하지 않지만 많이 사용되고 있어 아바다 등 인기 테마에서는 메가 메뉴 기능을 기본적으로 제공합니다. 그리고 엘리멘터 프로에서도 메가 메뉴 기능이avada.tistory.com워드프레스 아스트라(Astra) 테마: 한국형 메가 메뉴 만들기아스트라 테마 무료 버전과 엘리멘터 페이지 빌더, 그리고 Elementor Header & Footer Builder 플러그인을 사용하여 메가 메뉴 기능을 구성해 보았..

인터넷을 돌아다니다 보면 위의 그림과 같이 메뉴를 클릭했을 때 특수한 형식으로 표시되는 메뉴를 만나곤 합니다. 이런 형식의 메뉴를 메가 메뉴(Mega Menu)라고 합니다. 워드프레스의 경우 아바다, 뉴스페이퍼 같은 일부 테마에서 메가 메뉴 기능을 제공하고 있습니다. 워드프레스 아바다 테마에서 메가 메뉴 사용하기 Elegant Themes의 Divi에서 메가 메뉴 만들기 HTML에서 메가 메뉴를 구현하고 싶은 경우 다음 W3Schools 자료를 참고할 수 있습니다. How TO - Mega Menu (메가 메뉴를 만드는 방법) 반응형까지 고려하여 제대로 만들려면 제법 시간이 걸릴 것 같습니다. 직접 만들기에는 시간이 너무 소요되고 결과물도 시원찮은 경우 코드캐년 마켓에서 판매하는 스크립트를 활용해볼 수 ..