워드프레스에서 내비게이션 는 웹사이트 구조의 핵심입니다. 사용자가 콘텐츠를 쉽게 탐색하고 원하는 정보를 빠르게 찾을 수 있도록 도와줍니다. 이러한 메뉴는 웹사이트의 헤더, 푸터, 사이드바 등 다양한 위치에 나타나며 방문자와 검색 엔진 모두에게 웹사이트로 가는 길을 안내하는 역할을 합니다.
워드프레스 사이트를 처음 구축하든 방대한 콘텐츠 라이브러리를 관리하든, 사용자 지정 내비게이션 메뉴를 만들고 구성하고 표시하는 방법을 이해하면 사용자 경험을 크게 향상시킬 수 있습니다. 잘 구성된 내비게이션 메뉴는 내부 링크 및 크롤링 가능성을 개선하여 SEO에 긍정적인 영향을 미칠 수 있습니다.
WordPress에는 코드를 한 줄도 작성하지 않고 메뉴를 생성, 편집 및 관리할 수 있는 내장 메뉴 편집기가 있습니다. 기본 메뉴나 헤더 메뉴와 같은 특정 위치에 메뉴를 지정하는 것부터 사용자 정의 링크 탭을 사용하여 항목을 사용자 지정하는 것까지, 이 용어 설명 항목에서는 WordPress 탐색 메뉴에 대한 모든 것을 다룹니다.
워드프레스에서 내비게이션 메뉴 기능 이해하기
WordPress는 기본적으로 웹사이트 탐색을 관리할 수 있는 유연한 옵션을 제공합니다. 일반적인 WordPress 메뉴에는 페이지, 게시물, 카테고리, 태그 및 사용자 정의 링크를 포함할 수 있습니다. 여러 개의 탐색 메뉴를 만들고 테마의 메뉴 위치를 기반으로 각 메뉴를 서로 다른 위치에 표시할 수 있습니다.
예를 들어, 많은 테마는 헤더에 메인 메뉴, 사이드바에 보조 메뉴, 그리고 푸터 메뉴를 지원합니다. 이러한 메뉴는 사용자가 홈페이지 링크, 블로그 섹션 또는 연락처 페이지와 같은 중요한 콘텐츠를 찾는 데 도움이 됩니다.
최신 테마는 모바일 메뉴도 지원하여 반응형 디자인을 . 탐색 메뉴를 통해 사용자는 사이트를 논리적으로 탐색할 수 있으며, 제품 페이지, 서비스 영역 또는 잠재 고객 확보 양식과 같은 가치 있는 콘텐츠로 사용자를 안내할 수 있습니다.
워드프레스에서 사용자 정의 메뉴 만들기
외관 > 메뉴를 통해 메뉴 화면으로 이동하세요 . 여기에서 다음 단계를 따르세요.
- '새 메뉴 만들기' 를 클릭하세요 .
- 메뉴 이름 상자 에 "메인 탐색" 또는 "바닥글 링크"와 같이 알아보기 쉬운 이름을 입력하세요.
- 사용자 지정 메뉴를 생성하려면 ' 메뉴 만들기' 버튼을 클릭하세요
메뉴 구조 섹션이 생성되면 항목을 추가하고 순서를 정렬할 수 있습니다.
사용자 지정 탐색 메뉴 만들기
다음 단계는 새로 생성된 메뉴에 콘텐츠를 추가하는 것입니다. '메뉴에 추가' 버튼을 사용하여 페이지, 게시물, 카테고리 또는 사용자 지정 링크를 삽입하세요.
워드프레스 메뉴는 메뉴 구조 섹션에서 드래그 앤 드롭 인터페이스를 지원하여 항목을 논리적이고 사용자 친화적으로 쉽게 구성할 수 있습니다. 드롭다운 메뉴(또는 하위 메뉴)를 만들 때는 메뉴 항목을 상위 항목 바로 아래로 약간 오른쪽으로 드래그하면 됩니다.
설정을 완료하려면:
- 메뉴 설정 영역을 사용하여 메뉴를 기본 메뉴 또는 바닥글 메뉴와 같은 위치에 지정할 수 있습니다.
- 변경 사항을 저장하고 메뉴를 활성화하려면 '메뉴 저장' 버튼을 클릭하세요.
이 과정을 반복하여 사이트의 여러 섹션에 대한 메뉴를 여러 개 만들 수 있습니다.
메뉴에 항목 추가하기
WordPress를 사용하면 탐색 메뉴에 다양한 콘텐츠 유형을 추가하여 사용자가 사이트와 상호 작용하는 방식을 완벽하게 제어할 수 있습니다. 이러한 항목은 웹사이트의 주요 섹션으로 바로 연결되는 링크이며 사용자 여정을 간소화하는 데 도움이 됩니다.
다음과 같은 유형의 콘텐츠를 포함할 수 있습니다
- 정적 페이지 - 회사 소개, 연락처, 서비스 또는 FAQ 페이지와 같은 페이지입니다.
- 블로그 게시물 – 강조하고 싶은 특정 게시물에 직접 링크하세요.
- 카테고리 – 주제별로 블로그 콘텐츠를 정리하세요
- 태그 – 태그 기반 콘텐츠 모음에 연결하는 데 유용합니다.
- 사용자 지정 링크 – 외부 URL, 다운로드 가능한 파일 또는 사용자를 페이지의 특정 섹션으로 안내하는 내부 앵커 링크에 적합합니다.
메뉴에 항목을 추가하려면 다음 단계를 따르세요
- WordPress 관리자 화면에서 [외모] > [메뉴] 메뉴 페이지 로 이동하세요 .
- 화면 왼쪽에는 페이지, 게시물, 카테고리, 태그 및 사용자 지정 링크라고 표시된 여러 개의 접을 수 있는 패널이 있습니다.
- 포함시키고자 하는 각 콘텐츠 항목 옆의 확인란을 선택하세요.
- '메뉴에 추가 클릭하세요 .
선택한 항목은 이제 화면 오른쪽의 메뉴 구조 섹션에 나타나며, 여기에서 항목들을 재배열하고 정리할 수 있습니다.
타사 사이트, 파일 다운로드 또는 페이지의 특정 위치와 같이 연결하려는 콘텐츠가 자동으로 목록에 표시되지 않는 경우 사용자 지정 링크 탭을 사용할 수 있습니다. URL과 링크에 대한 레이블을 입력한 다음 메뉴에 추가를 클릭하세요.
이러한 유연성을 통해 사이트 탐색 기능을 완벽하게 맞춤 설정하고 방문자를 원하는 위치로 정확하게 안내할 수 있습니다.
워드프레스 메뉴에서 링크 사용하기
워드프레스 메뉴의 모든 항목은 기본적으로 메뉴 링크입니다. 이러한 링크는 내부 또는 외부 목적지를 가리킬 수 있습니다. 사용자 정의 링크 탭을 사용하면 타사 사이트 또는 웹사이트의 다른 섹션을 가리키는 URL을 쉽게 만들 수 있습니다.
예를 들어 다음과 같은 작업을 수행할 수 있습니다
- 전체 URL 또는 상대 경로를 사용하여 홈페이지 링크를 추가하세요.
- 캠페인별 랜딩 페이지에 대한 새 메뉴 링크를 삽입하세요.
- 다운로드 가능한 자료에 대한 메뉴 링크를 만드세요.
또한 새 탭에서 열기 또는 특정 CSS 클래스를 적용하여 스타일을 지정하는 등 이러한 링크의 동작 방식을 정의할 수 있습니다.
메뉴 항목을 효과적으로 구성하는 방법
메뉴 항목을 적절하게 구성하는 것은 사이트의 사용성을 크게 향상시킵니다. 워드프레스는 메뉴 구조 섹션에서 드래그 앤 드롭 인터페이스를 제공하여 이러한 요소들을 직관적으로 구성할 수 있도록 지원합니다.
모범 사례는 다음과 같습니다
- 관련 항목들을 드롭다운 메뉴 아래에 그룹화합니다.
- 메인 메뉴를 깔끔하고 간결하게 유지합니다.
- "1페이지"와 같은 일반적인 레이블 대신 명확하고 설명적인 레이블을 사용하십시오
내비게이션 메뉴에 너무 많은 항목을 넣지 마세요. 많은 항목을 표시해야 하는 경우, 보조 메뉴나 바닥글 메뉴와 같이 여러 영역에 걸쳐 여러 개의 내비게이션 메뉴로 나누는 것을 고려해 보세요.
사이트에 메뉴 표시하기
사용자 지정 메뉴를 만든 후에는 메뉴를 어디에 표시할지 결정해야 합니다. 워드프레스 테마에는 미리 정의된 메뉴 위치가 있으며, 이 위치들이 바로 메뉴를 표시할 수 있는 곳입니다.
일반적인 위치는 다음과 같습니다
- 헤더 메뉴(사이트 상단)
- 푸터 메뉴(사이트 하단)
- 사이드바 탐색
- 모바일 메뉴 (작은 화면에 맞춰 햄버거 메뉴 형식으로 제공)
위치에 메뉴를 할당하려면:
- 메뉴 구조 섹션 아래에 있는 메뉴 설정으로 스크롤하십시오.
- "표시 위치"에서 원하는 위치를 선택하세요
- 저장 메뉴 버튼을 클릭하세요.
일부 테마에서는 사용자 지정 메뉴 위젯과 같은 위젯을 사용하여 여러 탐색 메뉴를 정확한 위치에 추가할 수 있습니다.
고급 메뉴 옵션 및 설정
WordPress는 메뉴 기능을 향상시키는 고급 설정을 제공합니다
- 기존 메뉴에 새로운 최상위 페이지를 자동으로 추가합니다.
- 사용자 지정 스타일링이나 JavaScript 동작을 위해 CSS 클래스를 추가하세요.
- 링크 간의 관계를 설명하려면 XFN(XHTML Friends Network)을 사용하세요.
- 플러그인을 사용하여 이미지나 아이콘을 메뉴 항목에 포함시키세요.
또한 "메뉴 복제"와 같은 플러그인을 사용하여 메뉴 구조를 복제하고 새로운 레이아웃을 테스트할 수 있습니다. 복제된 메뉴를 클릭하고 이름을 변경한 다음 원본을 수정하지 않고 자유롭게 편집할 수 있습니다.
블록 테마 및 내비게이션 블록 작업하기
전체 사이트 편집(FSE) 기능이 도입되면서 사이트 편집기와 탐색 블록을 사용하여 메뉴를 관리하는 것이 더욱 시각적이고 유연해졌습니다.
WordPress에서 내비게이션 블록을 사용하여 메뉴를 추가하려면 다음 단계를 따르세요
- 외관 > 편집기를 통해 사이트 편집기에 액세스할 수 있습니다.
- 헤더 또는 푸터 템플릿에 탐색 블록을 삽입하세요.
- 블록 도구 모음을 사용하여 메뉴 항목을 추가, 제거 또는 재배열할 수 있습니다.
- 글꼴, 간격, 마우스 오버 효과 등 스타일을 사용자 지정할 수 있습니다.
- 블록을 표시 위치에 할당합니다.
내비게이션 블록은 모바일 토글 및 중첩 드롭다운 메뉴와 같은 최신 UX 패턴을 지원하여 직관적인 인터페이스를 더욱 쉽게 제공할 수 있도록 합니다.
플러그인을 사용하여 탐색 메뉴 기능 확장하기
워드프레스에 내장된 메뉴 편집기도 강력하지만, 플러그인을 사용하면 다음과 같은 추가 기능을 활용할 수 있습니다
- 여러 열로 구성된 대형 드롭다운 메뉴를 위한 메가 메뉴
- 사용자 역할 또는 장치에 따라 표시 여부를 조건부로 설정할 수 있습니다.
- 아이콘, 이미지 및 애니메이션을 활용한 향상된 스타일링 옵션.
인기 있는 플러그인은 다음과 같습니다
- 맥스 메가 메뉴
- WP 메가 메뉴
- 쿼드메뉴
이러한 도구는 메뉴 페이지와 직접 통합되어 사용 편의성을 저해하지 않으면서 더 많은 제어 권한을 제공합니다.
일반적인 탐색 메뉴 문제 해결
때때로 탐색 메뉴가 예상대로 표시되지 않거나 작동하지 않을 수 있습니다. 일반적인 문제는 다음과 같습니다
- 메뉴가 표시되지 않음: 가 테마의 올바른 메뉴 위치에 할당되었는지 확인하십시오.
- 깨진 링크: 사용자 지정 링크 탭에서 URL을 다시 확인하세요.
- 드롭다운 메뉴가 작동하지 않는 경우: 테마 충돌 또는 JavaScript 누락이 원인일 수 있습니다.
- 모바일 메뉴 문제: 테마가 반응형 메뉴를 지원하는지 확인하거나 플러그인을 사용하세요.
- 메뉴가 비어있는 경우: 메뉴 항목을 올바르게 추가하고 저장했는지 확인하십시오.
문제를 해결하려면 메뉴 설정을 다시 확인하고 옵션을 검증한 다음 '저장' 메뉴를 클릭하여 변경 사항을 적용하세요.
워드프레스 내비게이션 메뉴 모범 사례
워드프레스 내비게이션 메뉴를 만들려면 다음 팁을 참고하세요.
- 메인 메뉴에는 최상위 항목을 6~8개 이하로 사용하세요.
- 논리적인 계층 구조를 통해 항목들을 정리하세요.
- 물품에는 항상 설명적인 이름을 붙여주세요.
- 접근성을 우선시하십시오: 키보드 친화적인 디자인과 ARIA 역할을 사용하십시오.
- 모바일 기기에 최적화하려면 접이식 메뉴 버튼이나 햄버거 아이콘을 사용하세요.
- 사이트가 발전함에 따라 기존 메뉴를 정기적으로 검토하고 업데이트하십시오.
결론
워드프레스에서 내비게이션 메뉴를 제대로 활용하는 것은 탁월한 사용자 경험을 제공하고 사이트를 쉽게 탐색할 수 있도록 하는 데 필수적입니다. 내장 메뉴 편집기를 사용하든 블록 테마의 최신 내비게이션 블록을 사용하든, 사용자 정의 메뉴를 만들고 관리하고 표시하는 방법을 이해하는 것은 기본 기술입니다.
다음 사항을 기억하세요:
- 메뉴 화면을 사용하여 메뉴를 구성하고, 할당하고, 저장하세요.
- CSS 클래스를 활용하여
- 메뉴를 기본 메뉴, 바닥글 메뉴 또는 모바일 메뉴와 같은 적절한 표시 위치에 할당합니다.
- 변경 사항을 저장하려면 항상 저장 메뉴를 클릭하세요.
SEO를 개선하며 사이트의 전반적인 사용성을 향상시키는 강력한 도구가 됩니다
