워드프레스 / 우커머스 / 상점 페이지, 카테고리 페이지 등에서 진열되는 상품 수 설정하는 방법

기본적인 설정 방법

[설정 - 읽기]에서 [페이지 당 보여줄 글의 개수]를 변경하면 진열되는 상품의 개수도 바뀝니다.

만약 이 방법이 통하지 않거나, 포스트와 다른 개수로 정하고 싶다면 아래의 방법을 이용합니다.

우커머스에서 제공하는 코드

우커머스에서는 아래의 코드를 functions.php에 추가하면 된다고 합니다. 15를 적절히 수정합니다.

function new_loop_shop_per_page( $cols ) {
  $cols = 15;
  return $cols;
}
add_filter( 'loop_shop_per_page', 'new_loop_shop_per_page', 20 );

위 코드로 해결되지 않는다면 아래의 코드로 시도해보세요.

다른 코드

우커머스 관련 페이지에서는 24개의 목록을 출력하라는 뜻입니다. 여기의 코드를 약간 수정했습니다.

function change_product_query( $query ) {
  if ( is_shop() || is_woocommerce() || is_product_category() || is_product_tag() ) {
    $query->set( 'posts_per_page', 24 );
  }
}
add_action( 'pre_get_posts', 'change_product_query' );

같은 카테고리의 다른 글

워드프레스 강좌 / 자식 테마(Child Theme)의 뜻과 만드는 방법, 장단점

워드프레스 강좌 / 자식 테마(Child Theme)의 뜻과 만드는 방법, 장단점

자식 테마의 뜻 어떤 테마의 디자인과 기능을 그대로 상속 받는 테마를 자식 테마(Child Theme)라 합니다. 이때 상속해주는 테마를 부모 테마(Parent Theme)라 합니다. 자식 테마 만드는 방법 워드프레스의 기본 테마 중 하나인 Twenty Seventeen의 자식 테마를 만들어보겠습니다. 방법 1 wp-content/themes 폴더에 twentyseventeen-child 폴더를 만듭니다. (폴더 이름은 다른 것으로 해도 상관없습니다.) twentyseventeen-child 폴더 안에 다음의 내용을 가진 style.css ...

워드프레스 강좌 / 블록 에디터 / 코드 입력하는 방법

워드프레스 강좌 / 블록 에디터 / 코드 입력하는 방법

워드프레스에서 글 작성할 때 코드를 붙여넣으면, 들여쓰기가 제대로 표현되지 않거나 코드를 실행해버리는 등 원하는 모양으로 나오지 않는 경우가 있습니다. 그럴 경우 그대로 붙여넣지 말고 코드 블록으로 붙여넣습니다. + 아이콘을 클릭하고 를 클릭합니다. 그리고 코드를 붙여넣습니다.

워드프레스 강좌 / 관리자 이메일 주소 변경하는 방법

워드프레스 강좌 / 관리자 이메일 주소 변경하는 방법

워드프레스를 설치할 때 관리자 계정을 만들고 메일 주소를 입력합니다. 워드프레스가 자동 업데이트 되거나, 댓글이 달리는 등 주요 사건이 발생하면 그 메일로 알림을 보냅니다. 따라서 수신 가능한 메일 주소로 설정하고, 변경이 필요하면 바로바로 업데이트하는 것이 좋습니다. 워드프레스 이메일 주소 변경하기 으로 이동합니다. 이메일 주소를 입력합니다. 을 클릭합니다. 새로운 이메일 주소로 인증 메일이 ...

워드프레스 강좌 / 플러그인 / Rocket Font / 한글 글꼴 웹폰트로 설정하게 해주는 플러그인

워드프레스 강좌 / 플러그인 / Rocket Font / 한글 글꼴 웹폰트로 설정하게 해주는 플러그인

한글 글꼴 워드프레스 테마는 주로 영어권에서 개발합니다. 영어권이 아닌 곳에서 개발을 해도 영어 사용을 기준으로 개발합니다. 그래서 데모 사이트도 대부분 영어로 되어 있습니다. 여기서 문제가 발생합니다. 영어로 되어 있을 때는 아주 보기 좋은데, 한글로 바뀌면 이상해지는 경우가 많습니다. 멋진 디자인과 타이포그래피에 반해서 테마를 구입했는데, 한글을 사용하는 순간 기대했던 결과가 나오지 않는 ...

워드프레스 강좌 / Yoast SEO / 사이트맵(sitemap) 활성화하는 방법

워드프레스 강좌 / Yoast SEO / 사이트맵(sitemap) 활성화하는 방법

사이트맵(sitemap) 사이트맵은 사이트에 있는 콘텐츠를 정리한 XML 파일입니다. 네이버 웹마스터 도구나 구글 웹마스터 도구에 사이트맵을 등록해야 검색이 잘 됩니다. 사이트맵은 보통 Google XML Sitemaps 플러그인으로 만듭니다. 사이트맵 생성 플러그인 중에서는 가장 인기있는 플러그인입니다. 만약 Yoast SEO를 사용한다면 Google XML Sitemaps를 사용할 필요가 없습니다. Yoast SEO에 포함되어 있기 때문입니다. Yoast SEO의 사이트맵 기능 활성화하기 General의 Features 탭에 XML sitemaps가 ...

워드프레스 강좌 / Crayon Syntax Highlighter / 글 목록에서 코드 제거하는 방법

워드프레스 강좌 / Crayon Syntax Highlighter / 글 목록에서 코드 제거하는 방법

Crayon Syntax Highlighter은 워드프레스에서 사용하는 코드 하이라이트 플러그인입니다. 최근엔 업데이트가 별로 없지만, 사용에는 문제가 없습니다. Crayon Syntax Highlighter를 사용하면 한 가지 문제가 발생합니다. 글 시작 부분에 코드가 있으면 글 목록에서 그 코드가 나온다는 것입니다. 글 목록에 텍스트만 출력되는 상황이라면 그리 보기 싫지는 않지만, 썸네일이 들어가거나 2열로 배열한다면 모양이 이상해질 수 있습니다. CSS로 ...

워드프레스 강좌 / 플러그인 / Responsive Lightbox & Gallery / 이미지 클릭했을 때 확대하는 플러그인

워드프레스 강좌 / 플러그인 / Responsive Lightbox & Gallery / 이미지 클릭했을 때 확대하는 플러그인

워드프레스 테마는 일반적으로, 이미지를 본문에 넣을 때 이미지가 아무리 커도 본문 가로폭을 넘어가지 못하게 만듭니다. 보기에는 좋지만, 그렇게 하면 큰 이미지가 작게 보여서 이미지 안의 내용을 보기 힘들 수가 있습니다. 이를 해결하는 방법은 라이트박스 플러그인을 사용하는 것입니다. 이미지를 클릭하면 원본 이미지로 또는 크게 확대 되는 걸 본 적 있으시죠? 그게 ...

워드프레스 강좌 / 플러그인 / Crayon Syntax Highlighter / 코드 문법 하이라이트 플러그인

워드프레스 강좌 / 플러그인 / Crayon Syntax Highlighter / 코드 문법 하이라이트 플러그인

Crayon Syntax Highlighter 프로그래밍을 주제로 하는 블로그나 사이트라면 수많은 코드를 글에 포함하게 됩니다. 코드는 <pre> 태그나 <code> 태그를 이용하여 고정폭 글꼴로 나타낼 수도 있으나, 단색으로 나타내므로 읽는게 불편합니다. 워드프레스에는 이런 불편을 해소해주는 Syntax Highlighter 플러그인이 많습니다. 그 중 사용하기 편하고 다양한 기능을 가진 플러그인이 Crayon Syntax Highlighter입니다. Crayon Syntax Highlighter는 꽤 오랫동안 업데이트가 되지 않고 있어서 ...

워드프레스 강좌 / 멀티사이트 만드는 방법

워드프레스 강좌 / 멀티사이트 만드는 방법

서브 도메인과 서브 디렉토리 멀티사이트를 만드는 방법에는 서브 도메인 방식과 서브 디텍토리 방식이 있습니다. cmsfactory.net이라는 도메인이 있을 때, abc.cmsfactory.net 이 서브 도메인이고 cmsfactory.net/abc 가 서브 디렉토리입니다. 서브 도메인 방식으로 멀티사이트를 만드는 것은 언제든 가능하지만, 서브 디렉토리 방식으로 멀티사이트를 만드는 것은 처음 설치했을 때만 가능합니다. 기존 URL과 멀티사이트의 URL이 충돌할 수 있기 때문입니다. 운영 중인 사이트에 멀티사이트를 추가하려고 하면 다음처럼 ...

워드프레스 강좌 / 플러그인 / Ad Inserter / 애드센스 광고 쉽게 삽입할 수 있게 해주는 플러그인

워드프레스 강좌 / 플러그인 / Ad Inserter / 애드센스 광고 쉽게 삽입할 수 있게 해주는 플러그인

Ad Inserter 워드프레스로 만든 사이트 또는 블로그에 애드센스 광고를 넣는 방법은 여러 가지입니다. 그 중 Ad Inserter 플러그인으로 광고를 삽입하는 방법을 소개합니다. Ad Inserter는 광고를 삽입하게 해주는 플러그인으로, 애드센스 광고를 본문 위, 본문 중간 등에 쉽게 넣을 수 있게 해줍니다. 설치 WordPress.ORG에서 공유되는 플러그인이므로 워드프레스 관리자에서 바로 설치할 수 있습니다. 본문에 애드센스 광고 넣기 본문 상단 설정은 ...