如何為自定義帖子類型創建 WordPress 分頁

已發表: 2020-02-24

WordPress自定義帖子類型分頁 為自定義帖子類型創建分頁不應該是一個挑戰,因為您可以重新利用我們在這裡使用的相同想法——如何在 WordPress 中創建自定義查詢分頁。 我們需要查詢自定義帖子類型,然後顯示該帖子類型或多個帖子類型中的查詢帖子。

在這篇文章中,我將向您展示如何為自定義帖子類型創建 WordPress 分頁。 分頁將類似於此數字分頁。 我們將創建一個自定義查詢來獲取所有自定義帖子類型,然後使用循環和數字分頁顯示自定義帖子類型。

創建自定義帖子類型

第一步是使用以下代碼創建自定義帖子類型

 /**
  * 自定義帖子類型 - register_post_type()
  * @description- Njengah 教程自定義帖子類型示例 
  * @link -https://gist.github.com/Njengah/839466b773085ac2430772e081357cee
  *
  */ 


	add_action('init', "njengah_tutorial_cpt");
  
  
	函數 njengah_tutorial_cpt(){
		
		$標籤=數組(
				'name' => _x('Tutorials', '帖子類型通用名稱'),
				'singular_name' => _x('Tutorial', 'post type 單數名稱'),
				'menu_name' => _x('Tutorials', 'admin menu'),
				'name_admin_bar' => _x('Tutorial', 'add new on admin bar'),
				'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 = 數組(
				'分層' => 真的,     
				'標籤' => $標籤,
				'公共' => 真的,
				'publicly_queryable' => 真,  
				'描述' => __('描述'),
				'show_ui' => 真, 
				'show_in_menu' => 真,
				'show_in_nav_menus' => 真,			
				'query_var' => 真,
				'重寫' => 真的,
				'query_var' => 真,
				'rewrite' => array('slug' => 'tutorial'),
				'capability_type' => '頁面',
				'has_archive' => 真, 
				'menu_position' => 22,
				“show_in_rest” => 真,
				'supports' => array('title', 'editor', 'author', 'thumbnail', 'comments', 'revisions', 'page-attributes', 'custom-fields' )
			); 

			register_post_type('tutorial', $args);
		
		
	}

將此代碼添加到您的 functions.php 文件中,您將看到自定義帖子類型“教程”出現在您的 WordPress 儀表板上。

自定義帖子類型的 WordPress 分頁

可以更改此代碼以適合您的特定自定義帖子類型。 自定義帖子類型也可以使用自定義帖子類型生成插件創建。

創建頁面模板以顯示自定義帖子類型

我們需要創建一個自定義頁面模板,用於使用 WordPress 循環顯示自定義帖子類型。

要創建自定義頁面模板,您應該在主題的根文件夾中創建一個新文件。

為文件命名 - custom -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 = new 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 = new WP_Query($args);


?> 

<!-- 步驟2:顯示我們在步驟1中查詢的帖子-->

<div class="wrap">
 
	<div id="primary" class="content-area">
		
		<main id="main" class="site-main" role="main">
		
			<?php
			
			如果($customPostQuery->have_posts()): 
			
               while($customPostQuery->have_posts()) :
                   
				       $customPostQuery->the_post();
					   
					     全球 $post;
                ?>
		
		          <div class ="inner-content-wrap">
				  
						<ul class ="cq-posts-list">
						
						 <li>
						   <h3 class ="cq-h3"><a href="<?php the_permalink(); ?>" ><?php the_title(); ?></a></h3>
								<div>
								  <ul>
									<div>
											<a href="<?php the_permalink(); ?>"><?php the_post_thumbnail('thumbnail'); ?></a>
									</div>
								  </ul>
								  
								  <ul>
											<p><?php echo the_content(); ?></p>
								  </ul>
								
								</div>
						  </li>
						</ul>
				</div> <!-- 結束博文-->
						  
			<?php 結束; 
			
	     萬一; 
	 
			 wp_reset_query();

創建 WordPress 自定義帖子分頁功能

在這一步中,我們現在應該創建一個自定義帖子類型分頁函數,該函數將添加到主題函數中,並在循環顯示自定義帖子類型後調用。

應將以下代碼添加到 functions.php 以創建自定義帖子類型分頁功能。

 // 自定義帖子類型分頁功能 
	
    函數 cpt_pagination($pages = '', $range = 4)
    {
        $showitems = ($range * 2)+1;
        全局 $paged;
        if(空($paged)) $paged = 1;
        if($pages == '')
        {
            全局 $wp_query;
            $pages = $wp_query->max_num_pages;
            如果(!$頁)
            {
                $pages = 1;
            }
        }
        如果(1!= $頁)
        {
            echo "<nav aria-label='頁面導航示例'> <ul class='pagination'> <span>Page ".$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>";
            迴聲“</ul></nav>\n”;
        }
  }

在頁面模板中調用自定義帖子類型分頁功能

由於我們已經創建了自定義帖子類型分頁功能,並且我們已經運行了循環並顯示了自定義帖子類型,所以我們現在需要在自定義頁面模板的底部添加分頁功能,以便我們顯示分頁。

以下是用於檢查自定義後分頁功能是否存在的代碼,如果存在,我們應該調用它來顯示分頁

// 第三步:在這裡調用分頁函數  
			 
  if (function_exists("cpt_pagination")) {
				
   cpt_pagination($customPostQuery->max_num_pages); 
			 
}

我們創建了自定義帖子類型,自定義頁面模板,添加了自定義帖子類型分頁功能,並顯示了帶有查詢的自定義帖子類型和自定義帖子類型分頁功能。

自定義帖子類型分頁樣式

您需要使用以下代碼將樣式添加到自定義帖子類型分頁:

 /**
 *自定義帖子類型分頁樣式
 * @作者喬恩傑加
 */ 

.分頁{
   明確:兩者;
   位置:相對;
   字體大小:16px; 
   行高:13px;
   浮動:對; 
	列表樣式類型:無;
	寬度:100%
}
.pagination 跨度,.pagination 一個 {
   顯示:塊;
   向左飄浮;
   邊距:2px 2px 2px 0;
   填充:6px 9px 5px 9px;
   文字裝飾:無;
   寬度:自動;
   顏色:#fff; 
   背景:#237697; 
}
.分頁:懸停{
   顏色:#fff;
   背景:#000; 
}
.分頁 .current{
   填充:6px 9px 5px 9px;
   背景:#999; 
   顏色:#fff;

我們準備好查看這段代碼的結果。 要查看自定義帖子類型分頁,您需要使用我們在第二步中創建的自定義頁面模板創建一個新頁面。

自定義帖子類型分頁功能

創建此頁面後,您應該會看到該頁面顯示了我們查詢的自定義帖子類型和我們創建的分頁,如下圖所示:

自定義帖子類型分頁

最後的想法

要創建自定義帖子類型分頁,您需要創建自定義頁面模板,添加自定義查詢以獲取您要顯示的所有自定義帖子並調用您添加到 functions.php 的自定義分頁函數。 為了獲得完整的代碼,我已將其添加到 git 存儲庫中,您可以在此處訪問它——WordPress 自定義帖子類型分頁。