메뉴에 WooCommerce 제품 카테고리를 추가하는 방법

메뉴에 제품 카테고리를 포함하시겠습니까? 당신은 바로 이곳에 왔습니다. 이 게시물에서는 WooCommerce 제품 카테고리를 메뉴에 추가하는 2가지 방법을 보여 드리겠습니다.

메뉴에 제품 카테고리를 추가하는 이유는 무엇입니까?

전환을 위해 WooCommerce 상점을 최적화하는 것은 판매와 수익을 높이는 열쇠입니다. 훌륭한 체크아웃 페이지와 전문적인 테마 외에도 상점은 탐색하기 쉬워야 합니다. 이것은 일반적으로 간과되지만 매우 중요합니다. 사용자에게 훌륭한 구매 경험을 제공하려면 원하는 제품을 쉽게 찾을 수 있어야 합니다.

명확하고 잘 디자인된 메뉴는 사용자가 사이트를 탐색하는 데 도움이 됩니다. 메뉴에는 매우 중요한 정보가 있으므로 일반적으로 사이트 상단에 있습니다. 그러나 제품, 카테고리 및 하위 카테고리가 많은 경우 메뉴를 깔끔하고 체계적으로 유지하는 것이 어려울 수 있습니다. 그러나 우리는 당신을 위한 해결책을 가지고 있습니다.

여기에서는 사이트 탐색을 개선하기 위해 메뉴에 WooCommerce 제품 카테고리를 추가하는 방법을 배웁니다. 예를 들어, 쇼핑객이 온라인 상점에서 Samsung 휴대폰을 구매하려고 한다고 가정해 보겠습니다. 메뉴에서 바로 삼성휴대폰 코너로 이동하여 원하는 제품을 쉽게 찾을 수 있다면 좋지 않을까요? 더 나은 탐색은 고객 경험을 개선하고 전환율을 높이는 데 도움이 됩니다.

그렇기 때문에 메뉴에 제품 카테고리를 추가하면 비즈니스의 판도를 바꿀 수 있습니다.

메뉴에 WooCommerce 제품 카테고리를 추가하는 방법

이 가이드에서는 WooCommerce 제품을 두 가지 다른 방법으로 메뉴에 추가하는 방법을 보여줍니다.

1. WordPress 관리 섹션에서
2. 플러그인으로

각 방법을 자세히 살펴보고 상황에 더 적합한 방법을 선택할 수 있습니다.

1) 워드프레스 대시보드에서

메뉴에 WooCommerce 제품 카테고리를 포함하는 가장 쉽고 초보자 친화적인 방법입니다. 추가 도구가 필요하지 않으며 몇 분 밖에 걸리지 않습니다. 먼저 WordPress 대시보드 에 로그인하고 모양 > 메뉴 로 이동합니다.

기본 옵션을 방금 구성한 경우 메뉴가 표시되지 않을 수 있으므로 메뉴를 만들고 메뉴 위치를 지정해야 합니다. 어떻게 하는지 봅시다.

메뉴 만들기

메뉴를 만들려면 이름을 지정하고 위치를 지정한 다음 메뉴 만들기 버튼을 클릭하기만 하면 됩니다. 데모를 위해 테마의 기본 메뉴 위치에 메뉴를 배치합니다. 왼쪽 패널에는 메뉴에 추가할 수 있는 모든 요소와 블록이 표시됩니다.

• 페이지
• 게시물
• 카테고리
• WooCommerce 엔드포인트
• 제품
• 제품 카테고리

WooCommerce 제품 및 카테고리 옵션이 보이지 않습니까? 걱정하지 마세요. 숨겨져 있으므로 표시하기만 하면 됩니다. 화면 옵션 설정 으로 이동하여 아래와 같이 해당 확인란을 선택합니다.

그런 다음 WooCommerce 카테고리 섹션을 열고 온라인 스토어에서 사용 가능한 카테고리를 확인하십시오. 모두 보기 탭에서 사용 가능한 모든 범주를 볼 수 있습니다.

모든 범주를 선택하여 메뉴에 추가하거나 특정 범주를 포함할 수 있습니다.

메뉴에 제품 카테고리 추가하기

이 데모에서는 메뉴에 모든 범주를 추가합니다.

그런 다음 메뉴 섹션에서 항목을 사용자 정의할 수 있습니다. 항목 위치를 변경하고, 하위 메뉴를 만들고, 표시할 위치를 선택하는 등의 작업을 수행할 수 있습니다.

메뉴를 사용자 정의하려면 화면 옵션 섹션을 확인하십시오. 메뉴 항목에 적용할 수 있는 고급 메뉴 속성 이 표시됩니다.

변경 사항이 만족스러우면 메뉴 저장 을 누릅니다. 그럼 프론트엔드에서 결과를 확인해보자. 아래 스크린샷에서 볼 수 있듯이 WooCommerce 제품 카테고리가 메뉴에 나타납니다.

메뉴에 WooCommerce 제품 카테고리를 추가하는 이 방법은 간단하면서도 매우 효과적입니다. 말 그대로 몇 분이면 탐색을 크게 개선하는 데 도움이 될 수 있습니다. 그리고 가장 좋은 점은 초보자도 추가 도움 없이 할 수 있다는 것입니다. 약간의 코딩으로 메뉴 색상, 글꼴 등을 사용자 정의할 수도 있습니다. 반면에 코딩 없이 메뉴를 편집할 수 있도록 하려면 다음 방법을 살펴보는 것이 좋습니다.

2) QuadMenu로 메뉴에 제품 카테고리 추가

이 섹션에서는 QuadMenu를 사용하여 메뉴에 제품 카테고리를 포함하는 방법을 보여 드리겠습니다. QuadMenu는 다양한 유형의 메뉴를 쉽게 만들고 관리할 수 있는 우수한 프리미엄 메가 메뉴입니다. 이 플러그인에는 여기에서 다운로드할 수 있는 기본 기능이 있는 무료 버전과 15 USD(일회성 결제)부터 시작하는 고급 기능이 포함된 3개의 프리미엄 플랜이 있습니다.

또한 OceanWP, Avada, Divi, Astra, GeneratePress 등을 포함한 모든 WordPress 테마와 QuadMenu를 통합할 수 있습니다. 이 데모에서는 GeneratePress 테마를 사용하여 메뉴에 WooCommerce 제품 카테고리를 추가하는 방법을 보여줍니다.

설치 및 활성화

먼저 사이트에 QuadMenu를 설치하고 활성화합니다. 그렇게 하려면 플러그인 섹션으로 이동하여 QuadMenu를 검색하고 설치를 누르 십시오 .

그런 다음 QuadMenu GeneratePress 애드온을 설치해야 합니다. Divi 또는 Avada와 같은 다른 테마를 사용하는 경우 WooCommerce 스토어에 대한 특정 확장을 설치해야 합니다. 여기에서 모든 확장을 볼 수 있습니다.

확장 프로그램을 활성화하면 플러그인 설정으로 리디렉션됩니다. 거기에서 플러그인, 메뉴 및 기본 설정을 설정할 수 있습니다. QuadMenu의 무료 버전에는 메뉴에 제품 범주를 쉽게 추가할 수 있는 기본 기능이 포함되어 있습니다. 그렇게 하려면 모든 기본 구성 옵션을 볼 수 있는 기본 테마 설정으로 이동합니다. 메뉴에 대해 세 가지 레이아웃 옵션을 선택하고 정렬을 선택할 수 있습니다. 또한 고정 메뉴, 모바일 메뉴 그림자, 전환, 제목, 아이콘, 버튼 및 타이포그래피 옵션을 만들고 애니메이션을 포함할 수 있습니다. 예를 들어 메뉴의 글꼴 모음을 변경하는 방법을 살펴보겠습니다.

먼저 타이포그래피 섹션으로 이동합니다.

QuadMenu는 기본적으로 모든 Google 글꼴과 함께 제공되므로 드롭다운에서 원하는 글꼴을 선택하세요.

그런 다음 글꼴 크기와 문자 간격을 변경할 수도 있습니다. 변경 사항에 만족하면 저장 을 누릅니다. 그 위에 애니메이션을 추가할 수도 있습니다. 애니메이션 섹션으로 이동하여 텍스트, 자막, 아이콘 및 기타 요소에 적용할 효과를 선택하기만 하면 됩니다.

몇 번의 마우스 클릭으로 기본 WordPress 메뉴를 다른 수준으로 끌어올릴 수 있습니다. 이제 더 나아가고 싶다면 더 고급 기능이 필요합니다. 이를 위해서는 QuadMenu의 프리미엄 버전이 필요합니다.

QuadMenu의 프리미엄 버전 설치 및 활성화

공식 스토어에서 단 15달러에 QuadMenu의 프리미엄 버전을 구입할 수 있습니다. 그런 다음 QuadLayers 계정에 로그인하고 플러그인 파일을 다운로드합니다. 또한 계정 대시보드에서 라이선스 정보를 가져옵니다. 그런 다음 상점에 플러그인을 설치하고 활성화하십시오.

그런 다음 라이선스 섹션으로 이동하여 라이선스 키를 확인합니다.

QuadMenu는 다음에서 사용할 수 있습니다.

• 쿼드레이어의 웹사이트
• 엔바토
• 엘레강트 마켓 플레이스

따라서 드롭다운에서 해당 마켓플레이스를 선택해야 합니다. 우리의 경우 QuadLayers를 선택할 것입니다. 그런 다음 라이선스 키와 등록된 이메일을 입력하고 변경 사항 저장 을 클릭합니다. 이제부터 귀하의 사이트는 공식 개발자로부터 모든 플러그인 업데이트 및 지원을 받게 됩니다.

이제 WordPress 메뉴를 사용자 정의하는 방법을 살펴보겠습니다.

쿼드 메뉴 활성화

먼저 이전 방법과 마찬가지로 모양 > 메뉴 로 이동하여 메뉴에 제품 카테고리를 추가합니다. 메뉴를 저장하기 전에 메뉴 설정 에서 QuadMenu Dev 확인란을 선택하십시오. 이것은 중요한 단계이므로 해당 확인란을 선택해야 합니다.

메뉴를 저장한 후 메뉴 항목을 확인하십시오. 항목 위로 마우스를 가져가면 아래와 같이 QuadMenu 라는 새 메뉴가 표시됩니다.

요소를 편집하려면 QuadMenu 옵션을 클릭하기만 하면 됩니다. 마법이 일어나는 곳입니다. 사용자 정의 아이콘을 추가하고 링크 제목, 설명, 자막 등을 변경할 수 있습니다.

기본 탭에는 메뉴 섹션에서 구성하는 기본 설정이 있으므로 일반 및 아이콘 탭에 집중하는 것이 좋습니다. 일반 탭에는 사용자 정의할 수 있는 옵션이 표시됩니다.

• 부제
• 배지
• 뜨다
• 디스플레이 크기 사용자 정의
• 드롭다운 플로트

예를 들어 WooCommerce 제품 카테고리에 대한 사용자 정의 아이콘을 설정하려는 경우를 가정해 보겠습니다. 해당 옵션을 클릭하고 원하는 아이콘을 선택합니다.

WooCommerce 상점 메뉴에 여러 카테고리를 추가할 때 아이콘이 매우 유용합니다. QuadMenu를 사용하면 수동으로 추가할 필요 없이 WooCommerce 카테고리에 사용자 정의 아이콘을 표시할 수 있습니다. 목록에서 원하는 아이콘을 선택하고 변경 사항을 저장하기만 하면 됩니다.

원하는 아이콘을 선택한 후 프런트엔드에서 웹사이트를 확인하면 메뉴에 아이콘이 표시됩니다.

스타일 변경

이제 QuadMenu 테마 설정 을 사용하여 메뉴를 조금 더 사용자 정의해 보겠습니다. 좋은 소식은 한 줄의 코드를 작성하지 않고도 많은 요소를 사용자 지정할 수 있다는 것입니다.

예를 들어 메뉴의 색상을 변경해 보겠습니다. 패널에서 원하는 색상을 선택하고 변경 사항을 저장할 수 있습니다. 이 데모에서는 메뉴의 배경색을 수정했습니다.

따라서 프런트 엔드에서 이제 배경색이 파란색임을 알 수 있습니다.

변경 사항을 저장한 후 프런트엔드에 변경 사항이 표시되지 않으면 WordPress 캐시를 지우고 변경 사항을 다시 적용하십시오. 이것이 QuadMenu를 사용하여 WooCommerce 메뉴를 편집하는 방법입니다.

제품 카테고리를 추가하고 색상을 변경하는 것 외에도 애니메이션 효과를 포함하고, 타이포그래피를 변경하고, 스티커 옵션을 추가하는 등의 작업을 할 수 있습니다. 따라서 메뉴를 한 단계 업그레이드하려면 QuadMenu가 탁월한 선택입니다.

결론

사이트 탐색은 성공적인 온라인 상점의 핵심입니다. 사용자는 원하는 것을 쉽게 찾을 수 있어야 합니다. 메뉴가 얼마나 중요한지 고려할 때 탐색을 개선하는 가장 좋은 솔루션 중 하나는 메뉴에 WooCommerce 제품 카테고리를 추가하는 것입니다. 이 가이드에서는 이를 수행하는 두 가지 간단한 방법을 보았습니다.

1. WordPress 대시보드에서
2. 쿼드 메뉴 사용

WordPress 관리 대시보드에서 제품 카테고리를 포함하는 것은 매우 쉽고 몇 분 밖에 걸리지 않습니다. WordPress 사용자 지정 도구나 기본 WordPress 메뉴 설정을 사용하여 변경할 수 있지만 코딩 기술이 없으면 사용자 지정 옵션은 매우 기본적일 수 있습니다.

반면에 QuadMenu는 메뉴를 만들고 관리하는 매우 강력하고 사용하기 쉬운 플러그인입니다. 메뉴를 완전히 제어하고, 사용자 정의 글꼴 아이콘, Google 글꼴을 추가하고, 색상, 레이아웃 등을 변경할 수 있습니다. 또한 QuadMenu를 사용하면 많은 제품이 있는 매장에 매우 적합한 메가 메뉴를 쉽게 만들 수 있습니다. 따라서 많은 수정을 가하고 메뉴를 한 단계 끌어올리고 싶다면 QuadMenu가 탁월한 선택입니다.

메뉴에 제품 카테고리를 추가하는 다른 방법을 알고 있습니까? 튜토리얼을 따라가는 동안 문제가 있었나요? 아래 의견 섹션에서 알려주십시오!