워드프레스 메뉴 만들고 순서 바꾸는 방법|페이지·하위 메뉴·모바일 확인

페이지를 공개해도 메뉴에 연결하지 않으면 방문자가 찾기 어려울 수 있습니다.
이 글에서는 페이지·글·카테고리·외부 주소를 메뉴에 넣고 순서와 하위 메뉴를 정리하는 방법을 설명합니다.

이 글은 관리자에 모양 → 메뉴가 보이는 테마 기준입니다.
WPStart의 메뉴 화면을 예로 사용하며, 메뉴 위치의 이름은 테마마다 다를 수 있습니다.
모양 → 메뉴가 없고 사이트 편집기의 내비게이션 블록으로 메뉴를 관리하는 테마라면 아래 화면과 다릅니다.
그 경우에는 사이트 편집기에서 내비게이션을 확인하고, 이 글의 Primary Menu·Footer Menu 항목을 찾을 필요는 없습니다.

1. 워드프레스 메뉴 화면 열기

워드프레스 관리자 화면에서 모양 → 메뉴로 이동합니다.

워드프레스 관리자 화면에서 메뉴 편집 화면을 연 모습
워드프레스 관리자 화면에서 메뉴 편집 화면을 연 모습

화면 왼쪽에는 메뉴에 추가할 수 있는 항목이 표시됩니다.

메뉴에 추가할 페이지·글·사용자 정의 링크·카테고리를 선택하는 영역
메뉴에 추가할 페이지·글·사용자 정의 링크·카테고리를 선택하는 영역

현재 화면에서는 다음 항목을 선택할 수 있습니다.

  • 페이지
  • 글
  • 사용자 정의 링크
  • 카테고리

오른쪽의 메뉴 구조에서는 메뉴 이름과 현재 등록된 메뉴 항목을 확인할 수 있습니다.

이미 메뉴가 만들어져 있다면 기존 메뉴를 선택해 수정합니다.

새 메뉴가 필요하다면 새 메뉴 만들기를 누릅니다.

메뉴 이름은 관리자가 구분하기 위한 이름입니다.

방문자 화면에 반드시 그대로 표시되는 이름은 아닙니다.

예를 들어 사이트 상단에서 사용할 메뉴라면 주 메뉴, 사이트 하단에서 사용할 메뉴라면 하단 메뉴처럼 정할 수 있습니다.

메뉴 이름을 입력한 다음 사용할 메뉴 위치를 선택합니다.

현재 WPStart 테마에서는 Primary Menu와 Footer Menu를 선택할 수 있습니다.

Primary Menu는 사이트의 주요 메뉴에 사용하고, Footer Menu는 사이트 하단 메뉴에 사용합니다.

2. 페이지를 메뉴에 추가하기

왼쪽의 페이지 항목을 엽니다.

최신순, 모두 보기, 검색에서 메뉴에 넣을 페이지를 찾을 수 있습니다.

추가할 페이지의 선택 상자를 누른 다음 메뉴에 추가를 누릅니다.

선택한 페이지가 오른쪽 메뉴 구조에 나타나면 정상적으로 추가된 것입니다.

소개, 문의하기, 개인정보처리방침처럼 방문자가 자주 찾는 페이지를 메뉴에 연결할 수 있습니다.

페이지를 메뉴에 추가했다고 해서 페이지가 새로 만들어지는 것은 아닙니다.

기존 페이지로 이동할 수 있는 링크가 메뉴에 추가되는 것입니다.

개인정보처리방침·소개·문의 페이지를 아직 만들지 않았다면 먼저 워드프레스 개인정보처리방침·소개·문의 페이지 만들고 메뉴 연결하기에서 페이지 작성 방법을 확인할 수 있습니다.

3. 글과 카테고리를 메뉴에 추가하기

개별 글도 메뉴에 추가할 수 있습니다.

왼쪽의 글 항목을 열고 원하는 글을 선택한 다음 메뉴에 추가를 누릅니다.

공지 글이나 처음 방문한 사람이 먼저 읽어야 할 안내 글을 메뉴에 직접 연결할 때 사용할 수 있습니다.

여러 글을 하나의 주제로 묶어 보여 주려면 개별 글보다 카테고리를 메뉴에 연결하는 방법이 편리합니다.

왼쪽의 카테고리 항목을 열고 연결할 카테고리를 선택한 다음 메뉴에 추가를 누릅니다.

방문자가 카테고리 메뉴를 누르면 해당 카테고리에 포함된 글 목록으로 이동합니다.

같은 이름의 글이나 카테고리가 있다면 제목만 보지 말고 연결 주소도 확인해야 합니다.

4. 사용자 정의 URL 추가하기

워드프레스에 등록된 페이지·글·카테고리가 아닌 주소를 연결하려면 사용자 정의 링크를 사용합니다.

왼쪽의 사용자 정의 링크를 엽니다.

URL에는 이동할 전체 주소를 입력합니다.

링크 텍스트에는 메뉴에서 방문자에게 보여 줄 이름을 입력합니다.

예를 들어 외부 자료실을 연결한다면 URL에는 실제 자료실 주소를 입력하고 링크 텍스트에는 자료실을 입력할 수 있습니다.

입력을 마친 다음 메뉴에 추가를 누릅니다.

주소를 입력할 때는 https://를 포함한 전체 주소를 사용합니다.

메뉴를 저장한 뒤에는 실제 사이트에서 링크를 눌러 올바른 주소로 이동하는지 확인해야 합니다.

5. 메뉴 순서 바꾸기

메뉴에 추가한 항목은 오른쪽 메뉴 구조에서 순서를 변경할 수 있습니다.

이동할 항목을 누른 상태로 위나 아래로 끌어놓습니다.

예를 들어 메뉴가 다음 순서로 되어 있다고 가정하겠습니다.

  1. 홈
  2. 다운로드
  3. 워드프레스 시작하기
  4. 문의하기

워드프레스 시작하기를 위로 끌어놓으면 다음과 같이 변경할 수 있습니다.

  1. 홈
  2. 워드프레스 시작하기
  3. 다운로드
  4. 문의하기

드래그가 어렵다면 메뉴 항목을 펼쳐 메뉴 순서에서 위치를 선택할 수도 있습니다.

메뉴 순서를 바꾸는 작업은 방문자 화면에 표시되는 링크의 위치만 변경합니다.

연결된 페이지나 글의 발행일, 주소와 본문은 변경되지 않습니다.

6. 하위 메뉴 만들기

관련된 항목을 한곳에 묶으려면 하위 메뉴를 사용합니다.

예를 들어 다운로드 아래에 다음 항목을 배치할 수 있습니다.

  • 다운로드
    • 테마 다운로드
    • 플러그인 다운로드
    • 프로그램 다운로드

하위 메뉴로 만들 항목을 부모 항목 바로 아래로 이동합니다.

그 상태에서 항목을 오른쪽으로 조금 끌어놓습니다.

항목이 들여쓰기되어 표시되면 하위 메뉴로 들어간 것입니다.

메뉴 부모와 메뉴 순서를 선택해 하위 메뉴와 표시 순서를 설정하는 화면
메뉴 부모와 메뉴 순서를 선택해 하위 메뉴와 표시 순서를 설정하는 화면

현재 메뉴 항목을 펼쳐 메뉴 부모에서 부모 항목을 선택하는 방법도 사용할 수 있습니다.

하위 메뉴를 다시 일반 메뉴로 바꾸려면 항목을 왼쪽으로 끌어 들여쓰기를 해제하거나 메뉴 부모를 부모 없음으로 변경합니다.

하위 메뉴를 너무 많이 겹쳐 만들면 모바일에서 원하는 항목을 찾기 어려울 수 있습니다.

처음에는 한 단계 정도로 단순하게 구성하는 것이 좋습니다.

7. 메뉴 이름과 새 탭 설정하기

메뉴 구조에서 수정할 항목의 오른쪽 화살표를 누릅니다.

페이지나 카테고리의 실제 제목과 별도로 메뉴에서 표시할 이름을 탐색 라벨에서 변경할 수 있습니다.

예를 들어 실제 페이지 제목이 길다면 메뉴에서는 의미가 유지되는 짧은 이름을 사용할 수 있습니다.

새 탭 설정이 보이지 않는다면 화면 오른쪽 위의 화면 옵션을 엽니다.

화면 옵션의 고급 메뉴 속성에서 링크 대상을 표시하는 화면
화면 옵션의 고급 메뉴 속성에서 링크 대상을 표시하는 화면

고급 메뉴 속성 표시에서 링크 대상을 선택합니다.

이후 메뉴 항목을 펼치면 새 탭에서 링크 열기 설정을 사용할 수 있습니다.

메뉴 항목의 링크를 새 탭에서 열도록 설정하는 화면
메뉴 항목의 링크를 새 탭에서 열도록 설정하는 화면

내 사이트 안의 페이지와 글은 일반적으로 현재 탭에서 여는 것이 자연스럽습니다.

외부 사이트나 별도의 외부 서비스는 필요한 경우에만 새 탭에서 열도록 설정합니다.

모든 메뉴를 새 탭으로 열 필요는 없습니다.

8. 자동 페이지 추가와 직접 만든 메뉴의 차이

메뉴 설정에는 이 메뉴에 새 최상위 페이지를 자동으로 추가 항목이 있습니다.

이 항목을 선택하면 새로 공개한 최상위 페이지가 해당 메뉴에 자동으로 들어갈 수 있습니다.

자동 추가를 사용하면 새 페이지를 메뉴에 넣는 작업을 줄일 수 있습니다.

하지만 메뉴에 표시하고 싶지 않은 페이지까지 추가될 수 있으므로 페이지를 공개할 때마다 메뉴를 확인해야 합니다.

자동 추가를 사용하지 않으면 운영자가 필요한 페이지·글·카테고리만 직접 선택해 메뉴에 넣을 수 있습니다.

메뉴 항목과 순서를 일정하게 관리하려면 자동 추가를 끄고 수동으로 구성하는 방법이 더 알기 쉽습니다.

자동 추가를 사용하더라도 글, 카테고리와 외부 주소는 필요한 항목을 직접 추가해야 합니다.

9. 메뉴 항목만 제거하기

메뉴에서 사용하지 않을 항목의 오른쪽 화살표를 누릅니다.

아래쪽의 제거를 누르면 해당 링크가 메뉴 구조에서 빠집니다.

이 작업은 메뉴에 표시된 링크만 제거합니다.

연결되어 있던 페이지, 글 또는 카테고리 원본은 삭제되지 않습니다.

예를 들어 메뉴에서 문의하기를 제거해도 문의하기 페이지 자체는 그대로 남아 있습니다.

필요하면 나중에 같은 페이지를 메뉴에 다시 추가할 수 있습니다.

화면 아래쪽의 메뉴 삭제는 메뉴 항목 하나가 아니라 현재 메뉴 구성 전체를 삭제하는 기능입니다.

링크 하나만 빼려는 경우에는 반드시 해당 항목 안의 제거를 사용해야 합니다.

10. 메뉴 위치 선택하고 저장하기

메뉴 정리가 끝나면 메뉴 설정에서 사용할 위치를 확인합니다.

사이트 상단에 표시하려면 현재 테마의 Primary Menu를 선택합니다.

사이트 하단에 표시하려면 Footer Menu를 선택합니다.

테마에서 제공하는 위치의 이름과 개수는 테마마다 다를 수 있습니다.

원하는 위치를 선택한 다음 메뉴 저장을 누릅니다.

저장 버튼을 누르지 않으면 순서 변경, 하위 메뉴와 추가한 링크가 실제 사이트에 반영되지 않습니다.

11. PC 화면에서 메뉴 확인하기

메뉴를 저장한 다음 실제 사이트를 새 탭에서 엽니다.

다음 항목을 확인합니다.

  • 메뉴가 선택한 위치에 표시되는가
  • 메뉴 순서가 설정한 순서와 같은가
  • 각 항목이 올바른 페이지로 이동하는가
  • 하위 메뉴가 부모 메뉴 아래에서 열리는가
  • 외부 주소가 정확하게 연결되는가
  • 같은 항목이 중복으로 표시되지 않는가

관리자 화면에서 저장됐다는 안내만 확인하고 작업을 끝내지 않습니다.

방문자가 보는 공개 화면에서 링크를 직접 눌러야 메뉴 연결이 완료됐는지 알 수 있습니다.

저장한 메뉴가 바로 보이지 않는다면 먼저 올바른 메뉴 위치를 선택했는지 확인합니다.

캐시 기능을 사용하는 사이트라면 이전 메뉴가 남아 보일 수 있으므로 저장 상태를 확인한 다음 캐시도 점검합니다.

12. 모바일 메뉴 확인하기

PC에서 정상적으로 보이는 메뉴도 작은 화면에서는 다른 방식으로 표시될 수 있습니다.

스마트폰에서는 메뉴 항목이 접히고 메뉴 버튼으로 표시되는 경우가 많습니다.

실제 스마트폰이나 브라우저의 모바일 화면에서 사이트를 엽니다.

메뉴 버튼을 누른 다음 다음 항목을 확인합니다.

모바일 화면에서 메뉴 버튼을 눌러 전체 메뉴와 하위 메뉴를 펼친 모습
모바일 화면에서 메뉴 버튼을 눌러 전체 메뉴와 하위 메뉴를 펼친 모습
  • 메뉴 버튼을 눌렀을 때 전체 메뉴가 열리는가
  • 모든 메뉴 이름이 잘리지 않고 보이는가
  • 하위 메뉴를 열고 선택할 수 있는가
  • 각 항목을 눌렀을 때 올바른 주소로 이동하는가
  • 메뉴가 본문이나 다른 버튼과 겹치지 않는가
  • 메뉴를 다시 닫을 수 있는가

메뉴 항목이 너무 많으면 PC에서는 한 줄로 보이더라도 모바일에서는 사용하기 불편할 수 있습니다.

모바일 메뉴가 복잡하다면 중요도가 낮은 항목을 줄이거나 관련 항목을 하위 메뉴로 정리합니다.

마지막 확인 목록

  • 모양 → 메뉴에서 수정할 메뉴를 열었다.
  • 필요한 페이지·글·카테고리를 메뉴에 추가했다.
  • 사용자 정의 URL의 주소를 정확하게 입력했다.
  • 메뉴 항목을 원하는 순서로 정리했다.
  • 관련 항목을 하위 메뉴로 구성했다.
  • 필요한 외부 링크에만 새 탭 열기를 설정했다.
  • 자동 페이지 추가 사용 여부를 확인했다.
  • 메뉴 항목 제거와 원본 콘텐츠 삭제의 차이를 확인했다.
  • 사용할 메뉴 위치를 선택했다.
  • 메뉴 저장을 눌렀다.
  • PC 공개 화면에서 모든 링크를 확인했다.
  • 모바일에서 펼침 메뉴와 하위 메뉴를 확인했다.

메뉴를 정리한 다음 확인할 것

홈 메뉴가 글 목록으로 갈지 고정된 소개 화면으로 갈지는 최신 글과 고정 홈페이지 설정 방법에서 확인할 수 있습니다.
메뉴 항목이 많아 원하는 글을 찾기 어렵다면 검색창 추가와 검색 결과 확인 방법도 함께 살펴보세요.

답글 남기기

이메일 주소는 공개되지 않습니다. 필수 필드는 *로 표시됩니다