워드프레스 페이지 글목록 꾸미기(Feat.플러그인)

글 목록은 2가지가 있습니다.

스크린샷423

하나는 웹사이트 페이지에 전체적으로 표시되는 글목록 입니다.

이 글목록은 웹사이트의 얼굴과도 같은 역할을 합니다.

 

스크린샷424

다른 하나는 포스트 본문 밑에 표시되는 글목록 입니다.

이 글목록은 방문자가 같은 카테고리의 있는 다른 글도 보도록 유도하여 사이트에 유치 시키는 데에 도움을 줍니다. 

 

이번 포스팅에서는 웹사이트의 페이지에 전체적으로 표시되는 글 목록을 꾸미는 방법에 대해 알아볼 것입니다.

제가 꾸미는 과정을 참고하여 여러분들만의 글목록을 만드시길 바랍니다.

 

 

페이지에 표시되는 글목록은 다양한 형태로 꾸밀 수 있습니다.

워드프레스는 기본적으로 테마를 통해 웹 사이트의 글목록을 꾸밀 수 있는데요. 

하지만, 테마에 따라 만들 수 있는 형태가 다르며, 기능의 한계가 있습니다.

그래서 저는 플러그인을 사용하는 것을 권장 드립니다.

플러그인을 사용하면 어떤 테마를 사용하든 상관 없이 내가 원하는 글목록을 간단하게 만들 수 있습니다.

 

글목록을 꾸미는 플러그인으로는 페이지 빌더 플러그인 포스트 플러그인이 있는데요.

페이지 빌더 플러그인은 글목록 뿐만 아니라 페이지를 전체적으로 꾸밀 수 있는 만큼 용량이 무겁습니다.

그만큼 웹 사이트에 영향을 줄 수 있고 사용 범위도 넓기 때문에 나중에 따로 다루기로 하고,   

이번 포스팅에서는 포스트 플러그인을 통해 글목록을 꾸미는 방법에 대해 알려드리겠습니다.

 

image 93

저는 티스토리 블로그의 리스트 형식처럼 꾸며 보려고 합니다.

완전 똑같이 만드는 것은 무리가 있지만 최대한 비슷하게는 만들 수 있습니다.

제가 사용하고 있는 플러그인을 소개하겠습니다.

 

 

추천 포스트 플러그인

 

콘텐츠 보기

icon

활성 설치 : 100,000+

다른 플러그인은 기능이 조금 적어 꾸미는데 한계가 있었던 반면, 이 플러그인은 기본적으로 기능이 많아 무료 버전으로도 충분히 사용 할만 합니다. 이를 증명하듯 이용자 수도 가장 많습니다.

물론, 다른 플러그인을 사용하셔도 좋습니다. 사용 방식은 같으니 참고만 하셔도 충분합니다.

프로 버전

 

 

 

포스트 플러그인으로 메인 페이지 꾸미기

우선, 웹사이트의 ‘메인 화면(첫 화면)‘부터 꾸며 보겠습니다.

스크린샷427

워드프레스 관리자 화면에서 [페이지 > 새 페이지 추가]를 클릭하여 새 페이지 화면으로 들어갑니다.

 

스크린샷429

페이지 편집기에서 제목은 비워두시고, 내용에서 “/list” 라고 입력하면 플러그인 기능이 나타납니다.

* 해당 기능을 사용하려면 ‘블록 에디터‘로 전환하셔야 합니다.

 

스크린샷430

해당 기능을 클릭하면 다음과 같이 해당 형태의 글목록과 설정창이 표시 됩니다.

지금부터 표시된 설정창을 통해 글목록을 꾸밀 것입니다.

꼭 똑같이 따라할 필요는 없습니다. 참고하시고 여러분 만의 글목록을 만드시길 바랍니다. 

 

428

* 리스트 형식이 아니라 다른 형태로 꾸미고 싶다면, 플러그인을 참고하여 해당 형태를 검색하시면 됩니다.

 

스크린샷445
[질문 항목] 페이지당 표시할 게시물 수
스크린샷431
[레이아웃] 항목
저는 우선 [질문] 항목에서 페이지당 표시할 게시물을 ’10’으로 변경하고, [레이아웃] 항목에서 갭을 ’40’으로 변경하였습니다.

갭은 포스트 간의 위 아래 간격 입니다.

 

스크린샷433 1
아이템 / 오버레이 > 상자 그림자

스크린샷435

[아이템 / 오버레이] 항목에서는 포스트 간의 간격이나 경계선 등을 설정할 수 있습니다.

[아이템 / 오버레이 > 수직 그림자]에서 수직오프셋에 ‘1’을 입력하면 다음과 같이 포스트 사이에 경계선이 생깁니다.

 

스크린샷444

[제목 텍스트] 항목에서는 제목 텍스트를 설정할 수 있습니다.

저는 설정을 따로 건드리지 않았습니다.

 

스크린샷437

[나타난 그림] 항목에서는 이미지를 설정할 수 있습니다.

키를 ‘0’으로 입력하면 썸네일 이미지가 짤리지 않고 전체적으로 표시됩니다.

 

스크린샷438

[상위 메타] 항목에서는 카테고리, 태그 등의 표시를 설정할 수 있습니다.

저는 비활성화 했습니다.

 

스크린샷439

[콘텐츠] 항목에서는 발췌문을 설정할 수 있습니다.  

저는 발췌문의 글자 수를 ’40’으로 설정 하였습니다.

 

스크린샷441

[더 읽기] 항목에서는 더보기 버튼 설정을 할 수 있습니다.

저는 비활성화 했습니다.

 

스크린샷443

[바텀 메타] 항목에서는 포스트 하단에 표시할 메타의 설정을 할 수 있습니다.

저는 날짜 / 작성자 / 댓글만 표시했습니다.

 

446

[쪽수 매기기] 항목에서는 페이지의 쪽수를 설정할 수 있습니다.

 

스크린샷447

여기까지 모든 설정을 마쳤다면, 이제 페이지를 ‘공개‘ 합니다.

 

스크린샷449

이제 만들어진 페이지를 메인 화면(첫 화면)으로 설정해야 되는데요.

워드프레스 관리자 페이지에서 ①[설정 > 읽기] 이동하여 홈페이지 표시를 ②정적인 페이지로 선택하고, ③만들었던 페이지를 선택하고 ④변경사항 저장을 클릭하시면 됩니다.

 

 

스크린샷451
콘텐츠 보기 플러그인으로 만든 홈페이지 메인 화면 글목록.

홈페이지를 확인해보면 만들었던 페이지로 바뀐 화면을 볼 수 있습니다.

 

스크린샷425 1
generatepress 테마로 만든 홈페이지 글목록.

이전에 제가 generatepress 테마로 만들었던 글목록과 비교해보시면 확실히 차이를 느낄 수 있습니다.

제가 테마로 최대한 티스토리 블로그의 리스트형식으로 비슷하게 만들어 보았지만,

이미지 크기가 들쭉날쭉하고, 요약글이 이미지 영역을 침범하고, 메타 표시도 약간 중구난방이어서 지저분한 느낌이 강하게 들었는데요.

반면, 이번에 콘텐츠 보기 플러그인으로 만든 글목록은 굉장히 깔끔해서 훨씬 보기가 좋습니다.

 

 

 

포스트 플러그인으로 메뉴 페이지 꾸미기

웹사이트의 메인 화면(첫 화면)을 만들었으니, 그 다음은 메뉴 페이지를 만들어보도록 하겠습니다.

스크린샷452

우선, 아까 만들었던 페이지의 블록을 복사하여 새 페이지에 붙여넣기를 합니다.

* 페이지를 각각 다르게 디자인하여 구성하셔도 상관은 없지만, 통일성이 있어야 보기 편합니다.

 

스크린샷454

[질문] 항목에서 분류학하위 항목을 설정하면 표시되는 글목록이 해당 카테고리의 글목록으로 변경됩니다. 

변경되었다면 페이지를 공개 합니다. 

 

스크린샷457

참고로, 저는 페이지 구분을 위해 제목을 짓고, 거추장스러운 List 글자를 [제목 텍스트] 항목에서 지웠습니다.

 

스크린샷455

만들었던 페이지를 메뉴로 설정하려면 관리자 페이지 ①[디자인 > 메뉴]에서 ②페이지를 추가하고 ③제목을 설정한 뒤 ④메뉴 저장을 합니다.

기존의 카테고리 메뉴가 있다면 삭제해줍니다.

 

스크린샷460

해당 메뉴로 접속하면 만들었던 페이지로 바뀐 것을 볼 수 있습니다.

이런 방식으로 글목록을 꾸미고 페이지를 설정하시면 됩니다.

 

 

 

 

 

마치며

여기까지 플러그인으로 페이지 글목록을 만드는 방법에 대해 알아보았는데요.

다른 플러그인도 사용 방식은 비슷하니 원하는 플러그인과 구조로 여러분들만의 페이지를 만드시길 바랍니다.   

페이지 빌더로 웹 사이트를 꾸미는 것은 나중에 기회가 된다면 다루도록 하겠습니다. 

 

 

 

읽어주셔서 감사합니다. 

밑에 좋아요 버튼을 눌러주시면 저에게 큰 힘이 되고 콘텐츠의 방향성을 잡는 데에도 도움이 됩니다.

혹시 궁금한 점이나 원하시는 주제가 있으시다면 댓글 남겨주세요.

구글 검색 키워드(첫 페이지 순) : 워드프레스 글목록

 

 

  • 네이버 블로그 공유하기
  • 카카오톡 공유하기
  • 네이버 밴드에 공유하기
  • 페이스북 공유하기
  • 트위터 공유하기

“워드프레스 페이지 글목록 꾸미기(Feat.플러그인)”에 대한 2개의 생각

  1. 블로그 꾸미는데 많은 도움이 되었습니다.
    혹시 첫화면 말고 카테고리 클릭했을때 나오는 리스트 페이지도 이런식으로 처리할수 있는 방법이 있을까요?

    응답

댓글 남기기