WordPress 메뉴 만들기 — 헤더·푸터·모바일 메뉴 설계

Q: 메뉴를 만들었는데 사이트에 안 보여요.

메뉴 위치 지정 안 한 경우 흔함. 외모 > 메뉴 > 메뉴 설정에서 위치 체크 후 저장.

Q: 메뉴 항목에 아이콘 넣고 싶어요.

테마가 지원하면 옵션. 아니면 플러그인 Menu Icons 또는 CSS로 직접 (각 항목에 CSS 클래스 부여 → before 가상요소).

Q: 사이드바 메뉴를 만들 수 있나요?

가능. 외모 > 위젯에서 메뉴 위젯 추가 → 사이드바에 메뉴 표시.

Q: 특정 글에서만 다른 메뉴 표시?

플러그인 Menu Items Visibility Control — 페이지·역할별 메뉴 항목 표시 제어.

WordPress 메뉴는 사이트 어디든 자유롭게 배치할 수 있는 네비게이션 시스템입니다. 헤더·푸터·사이드바·모바일 등 여러 위치에 다른 메뉴 운영 가능. 사용자 경험을 좌우하는 핵심 요소.

메뉴 vs 블록 메뉴

WordPress 6+부터 두 시스템 공존:

	클래식 메뉴 (Menus)	블록 메뉴 (Navigation Block)
위치	외모 > 메뉴	사이트 편집기 (FSE 테마)
호환	모든 테마	블록 테마만
편집	GUI 위주	블록 에디터처럼

본 가이드는 클래식 메뉴 중심. 대부분 테마가 이걸 사용.

메뉴 만들기 — 5단계

1. 메뉴 페이지 진입

좌측 메뉴 외모 > 메뉴.

2. 메뉴 이름 정하기

내부 관리용 (사용자에게 표시 X). 예: 주 메뉴, 푸터 메뉴, 모바일 메뉴.

3. 메뉴 항목 추가

좌측 패널에서 추가 가능한 항목:

페이지: 사이트 페이지 직접 선택
글: 특정 글 링크
사용자 정의 링크: 외부 URL
카테고리: 카테고리 페이지
태그: 태그 페이지

각 항목 체크 → 메뉴에 추가.

4. 메뉴 항목 순서·계층

드래그 앤 드롭으로 순서 변경.

들여쓰기로 하위 메뉴(드롭다운):

회사 소개
  └ 비전
  └ 팀 소개
  └ 연혁

5. 메뉴 위치 지정

테마에 따라 사용 가능 위치 다름. 흔한 위치:

Primary Menu: 헤더
Footer Menu: 푸터
Mobile Menu: 모바일 전용 (테마 지원 시)
Top Bar Menu: 상단 바

체크 후 저장.

메뉴 항목 옵션

각 항목 클릭 → 펼침:

네비게이션 라벨: 표시 이름
타이틀 속성: 마우스 호버 시 툴팁
링크 대상: 같은 창 / 새 창
CSS 클래스: 디자인 커스텀 (자식 테마에서 정의)
링크 관계 (XFN): SEO/소셜 메타
설명: 메뉴 아래 보조 텍스트 (테마 지원 시)

옵션이 안 보이면

상단 화면 옵션 → 고급 메뉴 속성 체크.

외부 링크 추가

좌측 패널 사용자 정의 링크:

URL: https://blog.unwebs.co.kr
링크 텍스트: 블로그
메뉴에 추가

외부 사이트도 자유롭게.

카테고리 메뉴 — 동적

카테고리를 메뉴에 추가 → 카테고리 아카이브로 연결.

주메뉴
├─ 홈
├─ 회사 소개 (페이지)
├─ 서비스 (페이지)
├─ 공지사항 (카테고리: news)
├─ 블로그 (카테고리: blog)
└─ 문의 (페이지)

블로그 카테고리에 새 글 발행 시 자동으로 메뉴에서 도달 가능.

메뉴 위치별 활용

가장 자주 보임
5~7개 핵심 항목 권장
너무 많으면 모바일에서 어수선

보조 정보
개인정보 처리방침, 이용약관, 사이트맵 등
회사 정보·연락처

PC와 다른 우선순위 가능
검색·계정·전화 같은 즉시 액션
햄버거(≡) 아이콘으로 접힘

메뉴 디자인 — 자식 테마

CSS 커스텀:

/* 메인 메뉴 */
#primary-menu li a {
  font-weight: 600;
  letter-spacing: -0.02em;
}

/* 활성 메뉴 항목 */
.current-menu-item a {
  color: #2563eb;
}

/* 드롭다운 메뉴 */
.sub-menu {
  background: white;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

각 메뉴 항목에 CSS 클래스 부여하면 개별 디자인 가능 (예: 강조 CTA 버튼).

모바일 햄버거 메뉴

대부분 모던 테마가 모바일 자동 햄버거. 없으면:

플러그인:

WP Mobile Menu — 모바일 전용 메뉴 + 햄버거
Max Mega Menu — 메가 메뉴 + 모바일 지원

메가 메뉴 — 큰 사이트용

카테고리·상품이 많으면 일반 드롭다운 부족. 메가 메뉴는 여러 컬럼·이미지·서브 카테고리.

플러그인 Max Mega Menu 또는 WP Mega Menu.

⚠️ 작은 사이트엔 오버킬. 메뉴 항목 30개+ 일 때만.

사이트맵 메뉴

방문자용 사이트맵 페이지 (SEO sitemap.xml과 별개):

페이지 만들기 → 모든 카테고리·페이지 링크 정리 → 푸터 메뉴에 추가.

자동 생성하려면 플러그인 Simple Sitemap 사용.

권한·접근 제어

특정 메뉴를 로그인한 회원에게만 표시:

플러그인 Nav Menu Roles — 사용자 역할별 메뉴 표시 조절.

활용:

로그인 안 한 사용자: 로그인·회원가입
로그인 회원: 내 계정·로그아웃
관리자만: 관리자 패널 링크

다국어 메뉴

다국어 사이트 (WPML·Polylang):

언어별 다른 메뉴 운영
동일 메뉴를 언어 자동 전환

SEO 영향

좋은 메뉴 = SEO 좋음

사이트 구조 명확히 → 크롤러가 잘 발견
모든 중요 페이지가 메뉴에서 도달 가능
앵커 텍스트가 키워드 (자연스럽게)

안 좋은 메뉴 = SEO 나쁨

메뉴 너무 많아 어디가 중요한지 불분명
핵심 페이지가 깊이 3단계 이상
메뉴에 키워드 박제 ("안산 이비인후과 예약 안산 본오동")

정기 점검 (월 1회)

죽은 링크 확인 (404 페이지)
신규 페이지 메뉴 추가 검토
사용자 행동 분석 (어떤 메뉴를 안 누르는지)

⚠️ 자주 하는 실수

메뉴 항목 너무 많음: 5~7개 핵심만
계층 3단계+: 사용자가 길을 잃음
위치 지정 안 함: 메뉴 만들고 위치 지정 안 해 표시 X
저장 안 누름: 메뉴 편집 후 반드시 메뉴 저장 클릭
모바일 미고려: PC에선 잘 보이지만 모바일 햄버거에서 어수선

❓ FAQ

Q. 메뉴를 만들었는데 사이트에 안 보여요. A. 메뉴 위치 지정 안 한 경우 흔함. 외모 > 메뉴 > 메뉴 설정에서 위치 체크 후 저장.

Q. 메뉴 항목에 아이콘 넣고 싶어요. A. 테마가 지원하면 옵션. 아니면 플러그인 Menu Icons 또는 CSS로 직접 (각 항목에 CSS 클래스 부여 → before 가상요소).

Q. 사이드바 메뉴를 만들 수 있나요? A. 가능. 외모 > 위젯에서 메뉴 위젯 추가 → 사이드바에 메뉴 표시.

Q. 특정 글에서만 다른 메뉴 표시? A. 플러그인 Menu Items Visibility Control — 페이지·역할별 메뉴 항목 표시 제어.

Q. 메뉴 깊이 4단계 가능? A. 기본 가능하지만 권장 X. UX·SEO 양쪽에 안 좋음. 3단계 이내.