ウェブ

FRIDAY 2019 / 7 / 26

コピペで簡単!wordpressでアーカイブページのページャーの数字の数を固定する。<wordpress><pager><archive>

Text by Shinji Sato

  • カミナリツイッターカミナリtwitter
  • カミナリフェイスブックカミナリfacebook

こんにちは。

佐藤です。

 

 

wordpressのアーカイブページでページャーを

設置する関数「the_posts_pagination()

 

 

 

とても便利なこの関数ですが、表示するページ番号の数が

左右にそれぞれ表示するページ番号の数

となっており、最初や最後のページと、

中間あたりのページで表示される数が倍半分違ってきます。

 

 

 

それを解消するために、

その都度アーカイブに合わせたページャーを制作して使用していたのですが、

 

だんだん面倒になって来たので汎用的なものを作りました。

 

せっかくなので紹介します。

 

 

 

 

まず以下のコードをfunction.phpにコピー&ペースト

 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
/*
* original_pager
*
* ワードプレスのアーカイブページのページャーを作成する。
*
*
* @param array $args {
*   @type string prev_text :前ページリンクのテキスト、空にすると非表示。初期値、'←'.
*   @type string next_text :次ページリンクのテキスト、空にすると非表示。初期値、'→'.
*   @type string first_text :最初のページへのリンクのテキスト、空にすると非表示。初期値、'first'.
*   @type string last_text :最後のページへのリンクのテキスト、空にすると非表示。初期値、'last'.
*   @type int visit_nth :currentページを含む総ページ数。奇数を入力、偶数設定の場合は+1した場合と同じ結果。初期値、5.
*   @type boolean last_number :最後のナンバーが表示がされていない時に「...12」の様な表示をする。初期値、true.
*   @type string output :'return'もしくは'echo'を指定。'return'にすると文字列を返す。初期値、'echo'.
* }
*/
function original_pager($args = null){
  global $wp_query;
 
  $my_setting = array(
    'prev_text' => '←',
    'next_text' => '→',
    'first_text' => 'first',
    'last_text' => 'last',
    'visit_nth' => 5,
    'last_number' => true,
    'output' => 'echo',
  );
  if(is_array($args)) $my_setting = array_merge($my_setting,$args);
 
  //url関係
  $now_page_data = parse_url($_SERVER["REQUEST_URI"]);
  $base_url = preg_replace('/\/page\/.*/','/',$now_page_data['path']);
  $url_query = $now_page_data['query'] ? '?'.$now_page_data['query'] : '';
  $max_page = intval($wp_query->max_num_pages);
  $page_nth = (get_query_var('paged')) ? get_query_var('paged') : 1;
  $last_page = "{$base_url}page/{$max_page}/{$url_query}";
 
  //次のページと前のページの取得
  $next_page = $my_setting['next_text'] ? get_next_posts_link($my_setting['next_text']) : 'hidden';
  $prev_page = $my_setting['prev_text'] ? get_previous_posts_link($my_setting['prev_text']) : 'hidden';
 
  //数字の左と右の表示数を設定
  if($my_setting['visit_nth']%2==0){
    $base_nth = $my_setting['visit_nth']/2 ;
  }else{
    $base_nth = ($my_setting['visit_nth'] - 1) / 2;
  }
 
  ////前
  if(($max_page - $page_nth) < $base_nth){
    if($base_nth * 2 - ($max_page - $page_nth) >= $page_nth){
      $mae = $page_nth-1;
    }else{
      $mae = $base_nth * 2 - ($max_page - $page_nth);
    }
  }else{
    if($base_nth >= $page_nth){
      $mae = $page_nth - 1;
    }else{
      $mae = $base_nth;
    }
  }
 
  ////後
  if($base_nth >= $page_nth){
    if($base_nth*2 - $mae >= $max_page - $page_nth){
      $ato = $max_page - $page_nth;
    }else{
      $ato = $base_nth*2 - $mae;
    }
  }else{
    if($base_nth >= $max_page - $page_nth){
      $ato = $max_page - $page_nth;
    }else{
      $ato = $base_nth;
    }
  }
 
  ////点々表示
  $key = false;
  if(($ato + $page_nth) < $max_page){
    $key = true;
  }
 
 
  $html = '<nav class="pager">';
 
  //最初
  if($my_setting['first_text']){
    if($page_nth !== 1){
      $html .= "<p class=\"first\"><a href=\"{$base_url}{$url_query}\">{$my_setting['first_text']}</a></p>";
    }else{
      $html .= "<p class=\"first\"><span class=\"no-link\">{$my_setting['first_text']}</span></p>";
    }
  }
 
  //前
  if($prev_page !== 'hidden' && $prev_page){
    $html .= "<p class=\"prev\">{$prev_page}</p>";
  }elseif(!$prev_page){
    $html .= "<p class=\"prev\"><span class=\"no-link\">{$my_setting['prev_text']}</span></p>";
  }
 
  //数字関係
  $html .= '<p class="nth-box">';
 
  ////前の数字
  while($mae>0){
    $mae_nth = $page_nth - $mae;
    $html .= "<a href=\"{$base_url}page/{$mae_nth}/{$url_query}\">{$mae_nth}</a>";
    $mae--;
  }
 
  ////現在
  $html .= "<span class=\"current no-link\">{$page_nth}</span>";
 
  ////後の数字
  $i = 1;
  while($ato>0){
    $ato_nth = $page_nth + $i;
    $html .= "<a href=\"{$base_url}page/{$ato_nth}/{$url_query}\">{$ato_nth}</a>";
    $ato--;
    $i++;
  }
 
  ////数字それ以上
  if($key && $my_setting['last_number']){
    $html .= <<<EOT
    <span class="tenten">...</span>
    <a href="{$base_url}page/{$max_page}/{$url_query}" class="last-nth">{$max_page}</a>
EOT;
  }
 
  $html .= "</p>";
 
  //次
  if($next_page !== 'hidden' && $next_page){
    $html .= "<p class=\"next\">{$next_page}</p>";
  }elseif(!$next_page){
    $html .= "<p class=\"next\"><span class=\"no-link\">{$my_setting['next_text']}</span></p>";
  }
 
  //最後
  if($my_setting['last_text']){
    if($page_nth !== $max_page){
      $html .= "<p class=\"last\"><a href=\"{$last_page}\">{$my_setting['last_text']}</a></p>";
    }else{
      $html .= "<p class=\"last\"><span class=\"no-link\">{$my_setting['last_text']}</span></p>";
    }
  }
 
  $html .= "</nav>";
 
  if($my_setting['output'] == 'echo'){
    echo $html;
    return;
  }else{
    return $html;
  }
   
}

 

 

その後archive.phpのページャを出力したい箇所に以下を記述するとその場所にページャーが出力されます。

1
<?php original_pager() ?>

 

 

この時引数に配列で値を渡してやることで色々設定可能です。

効果のある設定と初期値は以下の通りです。

1
2
3
4
5
6
7
8
9
$args = array(
  'prev_text' => '←',
  'next_text' => '→',
  'first_text' => 'first',
  'last_text' => 'last',
  'visit_nth' => 5,
  'last_number' => true,
  'output' => 'echo',
);

●prev_text (string)
前ページリンクのテキスト、空にすると非表示。

●next_text (string)
次ページリンクのテキスト、空にすると非表示。

●first_text (string)
最初のページへのリンクのテキスト、空にすると非表示。

●last_text (string)
最後のページへのリンクのテキスト、空にすると非表示。

●visit_nth (int)
currentページを含む総ページ数。奇数を入力、偶数を入力した場合は+1場合と同じ結果。

●last_number (boolean)
最後のナンバーが表示されていない時に「…12」の様な表示をする。

●output (string)
‘echo’もしくは’return’。
‘return’を指定すると文字列を返す。

入力例:

1
2
3
4
5
6
7
8
9
10
$args = array(
  'prev_text' => '←',
  'next_text' => '→',
  'first_text' => '',
  'last_text' => '',
  'visit_nth' => 7,
  'last_number' => false,
  'output' => 'echo',
);
<?php original_pager($args) ?>

 

 

 

 

 

カテゴリーアーカイブやカスタム投稿タイプのアーカイブなど

大概のアーカイブで問題なく使えます。(のはず)

※スタイルは出力しないので各自好みのスタイルを適応して使おう。

 

 

 

 

 

 

 

 

48

TEXT by

佐藤 真司さとうしんじ)

1990年 鳥取県米子市生まれ。
株式会社マジックワード フロントエンドエンジニア。

この人が書いた他の記事を読む