워드프레스 사이트에서 특정 카테고리의 최신 글 목록을 표시하는 메뉴(Category Archives) 만들기

반응형

워드프레스 사이트에서 특정 카테고리의 최신 글 목록을 표시하는 메뉴(Category Archives) 만들기

상단의 메뉴를 선택하면 특정 카테고리의 포스트를 표시하는 방법
포스트(Post)의 카테고리 설정하기
1)워드프레스 관리자페이지의 좌측 Posts 메뉴 All Posts에서 현재 발행한 포스트 목록을 확인합니다.
모든 포스트의 카테고리가 Uncategorized로 설정되어있는것을 확인할수있습니다.

 
2)좌측의 카테고리(Categories) 메뉴로 이동합니다.

 
3)카테고리 이름과 Slug를 입력하고 추가합니다. Slug(슬러그)는 해당 카테고리의 URL 주소에 사용되는 영문 식별자를 의미합니다. 예들들어 카테고리의 Slug를 restaraunt로 설정하면 이 카테고리의 URL 주소는 다음과 같습니다.
https://yourdomain.com/category/restaraunt

 
4)같은 방법으로 새로운 카테고리를 추가합니다.

 
5)포스트(Post)의 quick edit로 이동합니다.

 
6)해당 포스트의 카테고리를 선택 및 체크하고 업데이트합니다.

 
7)같은 방법으로 모든 포스트의 카테고리를 설정합니다.

 
카테고리 아카이브 템플릿 추가하기
8)사이트의 블록 편집기에서 Templates로 이동합니다. 상단의 Add Template를 클릭하여 새로운 템플릿을 추가합니다.

 
9)추가할 템플렛의 유형을 선택합니다. 카테고리 아카이브를 사용하려면 Category Archives를 선택합니다.

 
10)특정 항목에 대한 카테고리를 사용하려면 Category를 선택합니다.

 
11)해당 템플릿이 사용될 카테고리를 선택합니다.

 
12)패턴을 적용하려면 chose a pattern에서 패턴을 선택합니다 또는 닫기를 선택합니다.

 
패턴을 선택한 경우
13)블록 편집기에서 해당 패턴을 적용한 카테고리 템플릿을 표시하는것을 확인할수있습니다. save를 선택하여 저장합니다(19번으로 이동)

 
패턴을 선택하지않은 경우
14)새로운 블록을 추가합니다.

 
15)Blocks에서 추가 가능한 다양항 유형의 블록을 표시하는것을 확인할수있습니다.

 
16)query loop 블록을 검색하고 선택 및 추가합니다. Query Loop 블록은 글(Post), 페이지(Page), 카테고리 등 다양한 콘텐츠 목록을 자동으로 불러와서 표시하는 블록입니다.

 
17)추가한 query loop 블록에서 choose를 선택합니다.

 
18)query loop 블록에서 사용할 패턴(pattern)을 선택하고 저장합니다.

 
19)Templates에서 새로 추가한 템플릿을 확인할수있습니다.

 
네비게이션 메뉴에서 카테고리 페이지 링크하기
20)Navigation의 edit을 선택하여 네비게이션 편집으로 이동합니다.

 
21)상단의 네비게이션에서 메뉴를 선택하고 페이지 링크 주소를 입력합니다. 예에서 restaraunt 카테고리의 Slug를 restaraunt로 설정하여 페이지 링크 URL 주소는 다음과같습니다.
https://yourdomain.com/category/restaraunt

 
22)사이트 보기에서 상단 네비게이션의 메뉴를 선택합니다. 사이트의 카테고리 페이지로 이동하지만 이미지가 정상적으로 표시되지않는것을 확인할수있습니다.

 
포스트(Post)의 featured image 설정하기
Featured Image는 글(Post) 제목 위 또는 페이지(Page) 상단에 표시되는 대표 이미지로 사이트 템플릿이 featured image 블록을 포함하는 경우 글 또는 페이지의 Featured Image를 설정하지않으면 공백으로 표시됩니다.
23)query loop 블록 내부의 featured image 블록이 존재하는것을 확인할수있습니다.

 
24)워드프레스 관리자페이지의 Posts 메뉴에서 포스트의 편집으로 이동합니다(edit)

 
25)해당 포스트에 featured image 가 설정되지않은것을 확인할수있습니다. set featured image으로 이동합니다.

 
26)featured image로 설정할 이미지를 업로드하고 미리보기를 확인한후 set featured image 를 선택 및 저장합니다(save)

 
27)사이트 보기에서 메뉴를 선택하면 카테고리 페이지로 이동하며 이미지를 정상적으로 표시합니다. 

반응형

댓글

Designed by JB FACTORY