サポート » 使い方全般 » 絞り込み検索時に画像のURLが出力されなくなる

  • 解決済 nagisane

    (@nagisane)


    はじめまして。
    当方、ワードプレス初心者のため、おかしな表現がございましたら申し訳ございません。

    今回カスタムポストのカスタムフィールドで価格を入力できる項目を作成し、価格帯で絞り込めるようにしたところ、絞り込んだときになぜかカスタムフィールドで選択した画像URLの出力がされないようになってしまい困っております。

    絞り込みをしていないときは出力できているのですが、絞り込みをすると出力されずに代わりに「161」という数字が出力されている状態です。

    ちなみに画像URL以外の項目については正常に出力されております。

    調べても解決できなかったため、どなたか解決策がわかりましたらご教示くださいませ。
    何卒よろしくお願い致します。

    ■アーカイブページ ループ部分

    <?php
    $paged = get_query_var('paged');
    query_posts($query_string . '&posts_per_page=12&paged=' . $paged);
    if (have_posts()):
    while (have_posts()): the_post();
    ?>
    
    <div>
    <a href="<?php the_permalink(); ?>">
    <div class="product-archive-img" style="background-image: url(<?php the_field('main_img'); ?>); background-size: cover; background-position:center center; opacity: 0.8;">
    <div></div></div>
    <p class="ttl"><?php the_field('product-name'); ?>
    
    <p class="p-number"><?php the_field('product-number'); ?>
    
    <p class="p-price">価格: <?php if(get_post_meta($post->ID , 'product_price' ,true)): $num = get_post_meta($post->ID , 'product_price' ,true); echo number_format( $num ) ; endif; ?>円
    
    <p class="p-size">サイズ: <?php the_field('product_size'); ?>
    
    </a>
    </div>
    <?php
    endwhile;
    else:
    ?>
    申し訳ございません。こちらの製品情報は現在準備中です。
    <?php
    endif;
    wp_reset_query();
    ?>

    ■絞り込み検索

    <li><a href="<?php 
    $new_url = add_query_arg( 'product_price', 'low', 'http://test.nagisane-works.com/product/' ) ;
    echo esc_url($new_url); ?>">~100,000円</a></li>
    <li><a href="<?php 
    $new_url = add_query_arg( 'product_price', 'middle1', 'http://test.nagisane-works.com/product/' ) ;
    echo esc_url($new_url); ?>">100,000円~299,999円</a></li>
    <li><a href="<?php 
    $new_url = add_query_arg( 'product_price', 'middle2', 'http://test.nagisane-works.com/product/' ) ;
    echo esc_url($new_url); ?>">300,000円~499,999円</a></li>
    <li><a href="<?php 
    $new_url = add_query_arg( 'product_price', 'high', 'http://test.nagisane-works.com/product/' ) ;
    echo esc_url($new_url); ?>">500,000円~</a></li>

    ■絞り込み検索function

    function change_posts_per_page( $query ){
    if( !empty($_GET['product_price']) ){
    if( $_GET['product_price'] == 'low' ){
    $meta_query[] = array(
    'key' =>'product_price',
    'value' => 100000,
    'compare' => '<', //より小さい
    'type' => 'NUMERIC'
    );
    }
    elseif( $_GET['product_price'] == 'middle1' ){
    $meta_query[] = array(
    'key' => 'product_price',
    'value' => array(100000, 299999),
    'compare' => 'BETWEEN', //AとBの間(AとBも含む)
    'type' => 'NUMERIC'
    );
    }
    elseif( $_GET['product_price'] == 'middle2' ){
    $meta_query[] = array(
    'key' => 'product_price',
    'value' => array(300000, 499999),
    'compare' => 'BETWEEN', //AとBの間(AとBも含む)
    'type' => 'NUMERIC'
    );
    }
    elseif( $_GET['product_price'] == 'high' ){
    $meta_query[] = array(
    'key' => 'product_price',
    'value' => 500000,
    'compare' => '>', //より大きい
    'type' => 'NUMERIC'
    );
    }
    if( $meta_query ){
    $query->set( 'meta_query' , $meta_query );
    }
    }
    }
    add_action( 'pre_get_posts', 'change_posts_per_page' );
6件の返信を表示中 - 1 - 6件目 (全6件中)
  • こんにちは

    pre_get_posts フックの処理がメインクエリのみに制限していないのが原因ではないでしょうか?

    function change_posts_per_page( $query ){
    	if( !empty($_GET['product_price']) ){

    function change_posts_per_page( $query ){
    	if ( ! $query->is_main_query() ) return; // <- 追加
    	if( !empty($_GET['product_price']) ){
    トピック投稿者 nagisane

    (@nagisane)

    @ishitaka さん

    こんばんは。
    ご返信ありがとうございます。
    早速コードを書き換えてみましたが、画像URLが出力されない症状は変わらず、絞り込みもされなくなってしまいました。(どれで絞ってもすべての投稿が出てきてしまいます。)
    他に考えられる対処法はございますでしょうか…
    ご教示いただけますと幸いです。

    ループの部分のコードを変更していませんか?
    変更の前と後で HTML のソースコードは変わりましたか?
    background-image: url() の括弧内の URL は正しいでしょうか?

    トピック投稿者 nagisane

    (@nagisane)

    @ishitaka さん

    ループ部分のコードは変更していません。

    HTMLのソースコードは、
    元のfunctionコードだとbackground-image: url(161)
    教えていただいたコードに書き換えるとbackground-image: url()
    となり、いずれも正しいURLは吐き出されない状態でございます。

    <div class="product-archive-img" style="background-image: url(<?php the_field('main_img'); ?>); background-size: cover; background-position:center center; opacity: 0.8;">

    この部分を変更していませんか?

    トピック投稿者 nagisane

    (@nagisane)

    @ishitaka さん

    ご返信ありがとうございます。
    再度確認致しましたら、ご指摘の通りコードを変更してしまっていました。
    改めて、教えていただいたコードを挿入すると、無事に画像が出力されるようになりました!

    当方の確認不足で、お手数をおかけし申し訳ございませんでした。
    心より感謝いたします。

6件の返信を表示中 - 1 - 6件目 (全6件中)
  • トピック「絞り込み検索時に画像のURLが出力されなくなる」には新たに返信することはできません。