사용자 정의 게시물 유형에 대한 WordPress 페이지 매김을 만드는 방법

게시 됨: 2020-02-24

WordPress 사용자 정의 게시물 유형 페이지 매김 여기에서 사용한 것과 동일한 아이디어(WordPress에서 사용자 지정 쿼리 페이지 매김을 만드는 방법)를 재사용할 수 있으므로 사용자 지정 게시물 유형에 대한 페이지 매김을 만드는 것은 어려운 일이 아닙니다. 사용자 정의 게시물 유형을 쿼리한 다음 해당 게시물 유형 또는 여러 게시물 유형에 있는 쿼리 게시물을 표시해야 합니다.

이 게시물에서는 사용자 정의 게시물 유형에 대한 WordPress 페이지 매김을 만드는 방법을 보여 드리겠습니다. 페이지 매김은 이 숫자 페이지 매김과 유사합니다. 모든 사용자 지정 게시물 유형을 가져오는 사용자 지정 쿼리를 만든 다음 루프 및 번호 페이지 매김과 함께 사용자 지정 게시물 유형을 표시합니다.

사용자 정의 게시물 유형 만들기

첫 번째 단계는 다음 코드를 사용하여 사용자 정의 게시물 유형을 만드는 것 입니다.

 /**
  * 사용자 정의 게시물 유형 - register_post_type()
  * @description- Njengah 튜토리얼 커스텀 포스트 타입 예시 
  * @링크 -https://gist.github.com/Njengah/839466b773085ac2430772e081357cee
  *
  */ 


	add_action('초기화', "njengah_tutorial_cpt");
  
  
	함수 njengah_tutorial_cpt(){
		
		$labels = 배열(
				'이름' => _x('튜토리얼', '게시물 유형 일반 이름'),
				'singular_name' => _x('튜토리얼', '포스트 유형 단수 이름'),
				'menu_name' => _x('튜토리얼', '관리자 메뉴'),
				'name_admin_bar' => _x('튜토리얼', '관리자 표시줄에 새로 추가'),
				'add_new' => _x('새로 추가', ''),
				'add_new_item' => __('새 튜토리얼 추가'),
				'edit_item' => __('튜토리얼 편집'),
				'new_item' => __('새 튜토리얼'),
				'all_items' => __('모든 튜토리얼'),
				'view_item' => __('튜토리얼 보기'),
				'search_items' => __('검색 튜토리얼'),
				'not_found' => __('튜토리얼을 찾을 수 없음'),
				'not_found_in_trash' => __('휴지통에 튜토리얼이 없습니다'), 
				'parent_item_colon' => __('부모 튜토리얼:'),
				
		);

			$args = 배열(
				'계층적' => 참,     
				'labels' => $labels,
				'공개' => 참,
				'publicly_queryable' => 참,  
				'설명' => __('설명.'),
				'show_ui' => 사실, 
				'show_in_menu' => 참,
				'show_in_nav_menus' => 참,			
				'query_var' => 참,
				'다시 쓰기' => 사실,
				'query_var' => 참,
				'다시 쓰기' => 배열('슬러그' => '자습서'),
				'capability_type' => '페이지',
				'has_archive' => 참, 
				'메뉴_위치' => 22,
				"show_in_rest" => 사실,
				'supports' => array( 'title', 'editor', 'author', 'thumbnail', 'comments', 'revisions', 'page-attributes', 'custom-fields' )
			); 

			register_post_type('자습서', $args);
		
		
	}

이 코드를 functions.php 파일에 추가하면 WordPress 대시보드에 사용자 정의 게시물 유형 ' Tutorials' 가 표시되는 것을 볼 수 있습니다.

사용자 정의 게시물 유형에 대한 WordPress 페이지 매김

이 코드는 특정 사용자 정의 게시물 유형에 맞게 변경할 수 있습니다. 사용자 정의 포스트 유형은 사용자 정의 포스트 유형 생성 플러그인을 사용하여 생성할 수도 있습니다.

사용자 정의 게시물 유형을 표시하는 페이지 템플릿 만들기

WordPress 루프를 사용하여 사용자 정의 게시물 유형을 표시하는 데 사용할 사용자 정의 페이지 템플릿을 만들어야 합니다.

사용자 정의 페이지 템플릿을 만들려면 테마의 루트 폴더에 새 파일을 만들어야 합니다.

파일 이름을 사용자 지정 -page.php로 지정 하거나 사용자 지정 게시물 유형을 설명하는 다른 이름을 지정합니다. 예를 들어 이름 위에 생성된 사용자 지정 게시물 유형의 경우 tutorials-page.php가 될 수 있습니다.

이 파일에서 다음 코드를 사용하여 사용자 정의 페이지 템플릿의 헤더를 추가하고 변경 사항을 저장합니다.

 <?php
/**
 * 템플릿 이름: 튜토리얼 템플릿
 */
 
 get_header(); 

이제 아래와 같이 페이지 속성 템플릿 옵션에 사용자 정의 페이지 템플릿이 표시됩니다.

사용자 정의 게시물 유형에 대한 WordPress 페이지 매김 만들기

사용자 정의 게시물 유형 사용자 정의 쿼리 만들기

사용자 지정 쿼리는 기존 사용자 지정 게시물 유형을 쿼리하고 이전 단계에서 만든 사용자 지정 페이지 템플릿에 표시할 수 있는 첫 번째 단계입니다.

다음은 튜토리얼 사용자 정의 게시물 유형을 쿼리하고 처음 두 개의 게시물을 검색한 다음 위에서 만든 사용자 정의 페이지 템플릿에 표시하는 코드입니다.

 <?php
/**
 * 템플릿 이름: 튜토리얼 템플릿
 */
 
 get_header(); 
 
 
 // 1단계: 사용자 지정 쿼리 만들기 
 
 $paged = ( get_query_var( 'paged' ) ) ? get_query_var( '페이징' ) : 1;
 
  $args = 배열(
               'posts_per_page' => 2,// 지난 2개의 게시물 쿼리  
			   'post_type' => '자습서', 
               '페이징' => $페이지
             );
			 
$customPostQuery = 새로운 WP_Query($args);


?>

사용자 정의 페이지 템플릿에 튜토리얼 사용자 정의 게시물 표시

다음은 사용자 정의 게시물 유형을 쿼리하고 사용자 정의 페이지 템플릿에 표시하는 코드입니다.

 <?php
/**
 * 템플릿 이름: 튜토리얼 템플릿
 */
 
 get_header(); 
 
 
 // 1단계: 사용자 지정 쿼리 만들기 
 
 $paged = ( get_query_var( 'paged' ) ) ? get_query_var( '페이징' ) : 1;
 
  $args = 배열(
               'posts_per_page' => 2,// 지난 2개의 게시물 쿼리  
			   'post_type' => '자습서', 
               '페이징' => $페이지
             );
			 
$customPostQuery = 새로운 WP_Query($args);


?> 

<!-- 2단계: 1단계에서 쿼리한 게시물 표시 -->

<div 클래스="랩">
 
	<div id="기본" 클래스="콘텐츠 영역">
		
		<메인 아이디="메인" 클래스="사이트-메인" 역할="메인">
		
			<?php
			
			if($customPostQuery->have_posts() ): 
			
               동안($customPostQuery->have_posts()) :
                   
				       $customPostQuery->the_post();
					   
					     글로벌 $post;
                ?>
		
		          <div 클래스 ="내부 콘텐츠 포장">
				  
						<ul 클래스 ="cq-posts-list">
						
						 <리>
						   <h3 클래스 ="cq-h3"><a href="<?php the_permalink(); ?>" ><?php the_title(); ?></a></h3>
								<div>
								  <울>
									<div>
											<a href="<?php the_permalink(); ?>"><?php the_post_thumbnail('썸네일'); ?></a>
									</div>
								  </ul>
								  
								  <울>
											<p><?php echo_content(); ?></p>
								  </ul>
								
								</div>
						  </li>
						</ul>
				</div> <!-- 블로그 게시물 종료 -->
						  
			<?php 그 동안; 
			
	     엔디프; 
	 
			 wp_reset_query();

WordPress 사용자 정의 포스트 페이지 매김 기능 만들기

이 단계에서는 이제 테마 함수에 추가되고 루프가 사용자 정의 게시물 유형을 표시한 후 호출될 사용자 정의 게시물 유형 페이지 매김 함수를 만들어야 합니다.

사용자 정의 포스트 유형 페이지 매김 기능을 생성하려면 다음 코드를 functions.php에 추가해야 합니다.

 // 사용자 정의 포스트 유형 페이지 매김 기능 
	
    함수 cpt_pagination($pages = '', $range = 4)
    {
        $showitems = ($범위 * 2)+1;
        글로벌 $페이지;
        if(empty($paged)) $paged = 1;
        if($페이지 == '')
        {
            전역 $wp_query;
            $pages = $wp_query->max_num_pages;
            if(!$페이지)
            {
                $ 페이지 = 1;
            }
        }
        if(1 != $페이지)
        {
            echo "<nav aria-label='페이지 탐색 예제'> <ul class='pagination'> <span>페이지 ".$paged." of ".$pages."</span>";
            if($paged > 2 && $paged > $range+1 && $showitems < $pages) echo "<a href=".get_pagenum_link(1)."'>&laquo; First</a>";
            if($paged > 1 && $showitems < $pages) echo "<a href='".get_pagenum_link($paged - 1)."'>&lsaquo; 이전</a>";
            ($i=1; $i <= $pages; $i++)
            {
                if (1 != $pages &&( !($i >= $paged+$range+1 || $i <= $paged-$range-1) || $pages <= $showitems ))
                {
                    에코($paged == $i)? "<li class=\"page-item active\"><a class='page-link'>".$i."</a></li>":"<li class='page-item' > <a href='".get_pagenum_link($i)."' class=\"page-link\">".$i."</a></li>";
                }
            }
            if ($paged < $pages && $showitems < $pages) echo " <li class='page-item'><a class='page-link' href=\"".get_pagenum_link($paged + 1)." \">i class='flaticon flaticon-back'></i></a></li>";
            if ($paged < $pages-1 && $paged+$range-1 < $pages && $showitems < $pages) echo " <li class='page-item'><a class='page-link' href=' ".get_pagenum_link($pages)."'><i class='flaticon flaticon-arrow'></i></a></li>";
            echo "</ul></nav>\n";
        }
  }

페이지 템플릿에서 사용자 정의 게시물 유형 페이지 매김 함수 호출

사용자 정의 게시물 유형 페이지 매김 기능을 만들고 이미 루프를 실행하고 사용자 정의 게시물 유형을 표시했으므로 이제 사용자 정의 페이지 템플릿의 맨 아래에 페이지 매김 기능을 추가하여 페이지 매김을 표시해야 합니다.

다음은 사용자 정의 후 페이지 매김 기능이 있는지 확인하는 데 사용해야 하는 코드입니다. 존재하는 경우 페이지 매김을 표시하기 위해 호출해야 합니다.

 // 3단계: 여기에서 페이지 매김 함수를 호출합니다.  
			 
  if (function_exists("cpt_pagination")) {
				
   cpt_pagination($customPostQuery->max_num_pages); 
			 
}

우리는 사용자 정의 게시물 유형, 사용자 정의 페이지 템플릿을 만들고 사용자 정의 게시물 유형 페이지 매김 기능을 추가했으며 쿼리가 있는 사용자 정의 게시물 유형과 사용자 정의 게시물 유형 페이지 매김 기능을 모두 표시했습니다.

사용자 정의 게시물 유형 페이지 매김 스타일

다음 코드를 사용하여 사용자 정의 게시물 유형 페이지 매김에 스타일을 추가해야 합니다.

 /**
 * 사용자 정의 게시물 유형 페이지 매김 스타일
 * @저자 Joe Njenga
 */ 

.페이지 매김 {
   지우기:둘 다;
   위치:상대적;
   글꼴 크기: 16px; 
   라인 높이: 13px;
   플로트:오른쪽; 
	목록 스타일 유형:없음;
	폭:100%
}
.페이지 매김 범위, .페이지 매김 a {
   디스플레이:블록;
   왼쪽으로 뜨다;
   여백: 2px 2px 2px 0;
   패딩:6px 9px 5px 9px;
   텍스트 장식:없음;
   너비: 자동;
   색상:#fff; 
   배경: #237697; 
}
.페이지 매김 a:hover{
   색상:#fff;
   배경: #000; 
}
.페이지 매김 .현재{
   패딩:6px 9px 5px 9px;
   배경: #999; 
   색상:#fff;

이 코드의 결과를 볼 준비가 되었습니다. 사용자 지정 게시물 유형 페이지 매김을 보려면 두 번째 단계에서 만든 사용자 지정 페이지 템플릿으로 새 페이지를 만들어야 합니다.

사용자 정의 포스트 유형 페이지 매김 기능

이 페이지를 만든 후 아래 이미지와 같이 쿼리한 사용자 정의 게시물 유형과 생성한 페이지 매김이 페이지에 표시되어야 합니다.

사용자 정의 게시물 유형 페이지 매김

마지막 생각들

사용자 지정 게시물 유형 페이지 매김을 만들려면 사용자 지정 페이지 템플릿을 만들고 표시하려는 모든 사용자 지정 게시물을 가져오는 사용자 지정 쿼리를 추가하고 functions.php에 추가하는 사용자 지정 페이지 매김 함수를 호출해야 합니다. 이 전체 코드를 얻으려면 git repo에 추가했으며 여기에서 액세스할 수 있습니다. WordPress Custom Post Type Pagination.