質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
jQueryプラグイン

jQueryの拡張機能。 様々な種類があり、その数は膨大です。公開済みのプラグインの他にも、自作することもできます。 jQueryで利用できるようにしておくだけで、導入およびカスタマイズが比較的容易に行なえます。

WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Q&A

解決済

1回答

5429閲覧

ajax時に生成されるページネーションの調整

yamasen

総合スコア23

jQueryプラグイン

jQueryの拡張機能。 様々な種類があり、その数は膨大です。公開済みのプラグインの他にも、自作することもできます。 jQueryで利用できるようにしておくだけで、導入およびカスタマイズが比較的容易に行なえます。

WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

0グッド

0クリップ

投稿2018/12/11 04:52

編集2018/12/13 15:56

前提・実現したいこと

WordPressで生成されるページネーションのリンクを
「example.com/wp-admin/admin-ajax.php?paged=2」から
「example.com/news/page/2」としたい。

発生している問題・エラーメッセージ

お世話になります。この度は宜しくお願い致します。

当方WordPressでCookieの値に応じたajaxの実装に挑戦しており、ページリンクの調整で問題にぶつかりました。

たとえばCookieに「news」という値があるときには

$myargs = array('post_type' => 'news');
if ( $myquery->have_posts() ) :
// 記事のHTML
endif;

というサブループを適用させているのですが、

このときページネーションのリンクを「example.com/news/page/2」としたいのに、「example.com/wp-admin/admin-ajax.php?paged=2」になってしまいます。

生成後にjQeuryで無理矢理調整してもいいのですが、そもそも生成する時点から治す方法があれば教えて下さい。

該当のソースコード

<h2 id="title_news">news</h2> 等のクリックで「news」をCookieに保存し、それを基にループが適用されます。

php

1// 必要な変数やnonceを最初から出しておく 2function my_enqueue_scripts() { 3 $handle = 'my-script'; 4 // Ajaxの呼出しが書かれているスクリプトのパス 5 $jsFile = 'path/to/myscript.js'; 6 7 wp_register_script($handle, $jsFile, ['jquery']); 8 9 // アクション名 10 $acrion = 'my-ajax-action'; 11 // 配列をJSのオブジェクトに変換したscriptを出力する 12 wp_localize_script($handle, 'MY_AJAX', [ 13 'api' => admin_url( 'admin-ajax.php' ), 14 'action' => $acrion, 15 'nonce' => wp_create_nonce( $acrion ), 16 ]); 17 /* 18 上によってこれが出てくるからJSで使う 19 <![CDATA[ 20 var MY_AJAX = {"api":"http://example.com/wp-admin/admin-ajax.php","action":"my-ajax-action","nonce":"XXXXXXXXXX"}; 21 ]]> 22 */ 23 24 wp_enqueue_script($handle); 25} 26add_action( 'wp_enqueue_scripts', 'my_enqueue_scripts' ); 27 28// JSからデータ受け取ってHTML作る 29function my_ajax_event() { 30 // wp_create_nonce の引数に渡したものと同じアクション名 31 $action = 'my-ajax-action'; 32 33 // nonceのチェック 34 if( check_ajax_referer($action, 'nonce', false) ) { 35 36 // 選択した投稿タイプ 37 $submitType = esc_html( $_POST['submitType'] ); 38 39 // ページネーション 40 $paged = get_query_var('paged') ? get_query_var('paged') : 1; 41 42 // 共通ループ条件 43 $myargs = array( 44 'paged' => $paged, 45 'posts_per_page' => 7, 46 ); 47 48 // cookieによるループ条件 49 if( $submitType == 'news' ){ 50 $myargs['post_type'] = 'news'; 51 } 52 if( $submitType == 'product' ){ 53 $myargs['post_type'] = 'product'; 54 } 55 56 $myquery = new WP_Query( $myargs ); 57 58 // 条件に合わせた記事を出力 59 if ( $myquery->have_posts() ) : 60 61 while ( $myquery->have_posts() ) : $myquery->the_post(); 62 echo '<h2>'.the_title().'</h2>'; 63 endwhile; 64 65 // ページネーション出力 66 if ( function_exists( 'pagination' ) ) : 67 pagination( $myquery->max_num_pages, $paged ); 68 endif; 69 70 wp_reset_postdata(); 71 72 else : 73 esc_html_e( 'Sorry, no posts matched your criteria.' ); 74 endif; 75 76 } else { 77 // エラー 78 } 79 80 die(); 81} 82add_action( 'wp_ajax_my-ajax-action', 'my_ajax_event' ); 83add_action( 'wp_ajax_nopriv_my-ajax-action', 'my_ajax_event' );

jquery

1"use strict"; 2(function($){ 3 $('h2').on('click', function(){ 4 var selectedType = $(this).attr('id').split('_')[1]; 5 $.ajax({ 6 url: MY_AJAX.api, 7 type: 'POST', 8 data: { 9 // 呼び出すアクション名 10 action: MY_AJAX.action, 11 // アクションに対応するnonce 12 nonce: MY_AJAX.nonce, 13 // 渡したいデータ 14 submitType: selectedType 15 } 16 }) 17 // scusess 18 .done(function( response ) { 19 $articleOuter = $('#ajaxdayo'); // 表示箇所 20 $response = response; // 返されたデータを変数に格納 21 $articleOuter.html(''); // #ajaxdayo内のHTMLを一度削除する 22 $articleOuter.html($response); // my_ajax_actionで生成されたデータ(response)を再度挿入する 23 // title変更 24 $('h2').removeClass('current'); 25 $('h2#title_'+selectedType).addClass('current'); 26 // 現在URL変更 27 history.replaceState('','',selectedType); 28 // 履歴追加 29 var page = $(self).attr('href'); 30 history.pushState(null, null, page); 31 }) 32 // error 33 .fail(function( jqXHR, textStatus, errorThrown ) { 34 alert('error'); 35 }); 36 }); 37})(jQuery);

追記

ページネーション出力関数を追記致します。

php

1/** 2* ページネーション出力関数 3* $paged : 現在のページ 4* $pages : 全ページ数 5* $range : 左右に何ページ表示するか 6* $show_only : 1ページしかない時に表示するかどうか 7*/ 8function pagination( $pages, $paged, $range = 2, $show_only = false ) { 9 10 $pages = ( int ) $pages; //float型で渡ってくるので明示的に int型 へ 11 $paged = $paged ?: 1; //get_query_var('paged')をそのまま投げても大丈夫なように 12 13 //表示テキスト 14 $text_first = "« 最初へ"; 15 $text_before = "‹ 前へ"; 16 $text_next = "次へ ›"; 17 $text_last = "最後へ »"; 18 19 // 表示形式 20 $big = 9999999999; 21 $args = array( 22 'base' => str_replace( $big, '%#%', esc_url( get_pagenum_link( $big ) ) ), 23 'format' => '%#%', 24 ); 25 26 if ( $show_only && $pages === 1 ) { 27 // 1ページのみで表示設定が true の時 28 echo '<div class="pagination"><span class="current pager">1</span></div>'; 29 return; 30 } 31 32 if ( $pages === 1 ) return; // 1ページのみで表示設定もない場合 33 34 if ( 1 !== $pages ) { 35 //2ページ以上の時 36 echo '<div class="pagination"><span class="page_num">Page ', $paged ,' of ', $pages ,'</span>'; 37 if ( $paged > $range + 1 ) { 38 // 「最初へ」 の表示 39 echo '<a href="', get_pagenum_link(1) ,'" class="first">', $text_first ,'</a>'; 40 } 41 if ( $paged > 1 ) { 42 // 「前へ」 の表示 43 echo '<a href="', get_pagenum_link( $paged - 1 ) ,'" class="prev">', $text_before ,'</a>'; 44 } 45 for ( $i = 1; $i <= $pages; $i++ ) { 46 47 if ( $i <= $paged + $range && $i >= $paged - $range ) { 48 // $paged +- $range 以内であればページ番号を出力 49 if ( $paged === $i ) { 50 echo '<span class="current pager">', $i ,'</span>'; 51 } else { 52 echo '<a href="', get_pagenum_link( $i ) ,'" class="pager">', $i ,'</a>'; 53 } 54 } 55 56 } 57 if ( $paged < $pages ) { 58 // 「次へ」 の表示 59 echo '<a href="', get_pagenum_link( $paged + 1 ) ,'" class="next">', $text_next ,'</a>'; 60 } 61 if ( $paged + $range < $pages ) { 62 // 「最後へ」 の表示 63 echo '<a href="', get_pagenum_link( $pages ) ,'" class="last">', $text_last ,'</a>'; 64 } 65 echo '</div>'; 66 } 67}

試したこと

ここまでのソースコード

補足情報(FW/ツールのバージョンなど)

WordPress、PHP、いずれも最新です。
尚Cookie保存には、jQueryプラグイン「jquery.cookie.js」を利用しております。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

kei344

2018/12/13 05:04

インストール直後のWordPressにはpaginationという関数がありません。関数定義部分も提示してください。
yamasen

2018/12/13 15:43 編集

ありがとうございます。ページネーション関数にそれらしい部分がありました。 $big = 9999999999; $args = array( 'base' => str_replace( $big, '%#%', esc_url( get_pagenum_link( $big ) ) ), 'format' => '?page=%#%', ); baseかformatかだと思うのですが、たとえばどのような変更で出来そうでしょうか。 恐れ入りますが一例をお教えて頂けますと幸いでございます。
kei344

2018/12/13 15:43

この「質問への追記・修正の依頼」の部分はデフォルトで表示されませんので、関数全体を質問本文に追記することをお勧めします。
yamasen

2018/12/13 15:54

ありがとうございます。追記しておきました。以後気を付けます。
kei344

2018/12/14 01:49

まだ質問が「受付中」になっていますが、いったん「解決済」にされてはいかがでしょうか。また、解決されていないなら状況を質問文に追記ください。
yamasen

2018/12/14 02:54

失礼致しました。ご指摘感謝致します。ありがとうございました。
guest

回答1

0

ベストアンサー

get_pagenum_link() の中の、$request = remove_query_arg( 'paged' ); の部分で admin-ajax のURを基準にしてしまうため、そうなるようです。
よさそうなフックも見当たらないので、出力結果を置換してしまうのが早いと思います。

【get_pagenum_link() | Function | WordPress Developer Resources】
https://developer.wordpress.org/reference/functions/get_pagenum_link/

【remove_query_arg – WordPress私的マニュアル】
https://elearn.jp/wpman/function/remove_query_arg.html

投稿2018/12/13 16:48

kei344

総合スコア69366

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

yamasen

2018/12/13 17:04

厄介ですね。打開策ありがとうございます。 検索してみると、こう…でしょうか?(これでは変化ありませんでしたけど。) function vc_remove_wp_ver_css_js( $src ) { if ( strpos( $src, 'ver=' ) ) $src = remove_query_arg( 'ver', $src ); return $src; } add_filter( 'style_loader_src', 'vc_remove_wp_ver_css_js', 9999 ); add_filter( 'script_loader_src', 'vc_remove_wp_ver_css_js', 9999 );
kei344

2018/12/13 17:06

何をしているのでしょうか。
yamasen

2018/12/13 17:24

失礼致しました。コピペがすべって意図したものと別のソースコードを貼ってしまいました。何をしているのでしょうね。汗 なるほどreplaceですか。やってみます。ありがとうございます。
yamasen

2018/12/13 22:16

おはようございます。お世話になっております。最後に1つだけ具体的な書き方を教えて頂きたくご返信致しました。もしよろしければお付き合いください。str_replaceについてです。 たとえば、 この部分であれば echo '<a href="', get_pagenum_link(1) ,'" class="first">', $text_first ,'</a>'; こうしてstr_replaceするわけですよね。 echo '<a href="', str_replace("wp-admin/admin-ajax.php?paged=", "", get_pagenum_link(1)) ,'" class="first">', $text_first ,'</a>'; あと一歩のように思うのですが、上だけですと これが 「example.com/wp-admin/admin-ajax.php?paged=2」 こうなります。 「example.com/2」 間に文字(page)を挟んでこうするためには、 「example.com/page/2」 どのように書けばよろしいでしょうか?
kei344

2018/12/13 23:58

echo '<a href="', str_replace("wp-admin/admin-ajax.php?paged=", "page/", get_pagenum_link(1)) ,'" class="first">', $text_first ,'</a>';
yamasen

2018/12/14 00:00

str_replaceはそういう意味だったのですか…!最後までお付き合いありがとうございました。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問