読者です 読者をやめる 読者になる 読者になる

WordPress

アフリエイトブログの作成と運営を考える

商品を検索する機能を追加してみました。

検索項目も自由に追加することができます。あいまい検索、数値の範囲、検索対象をタイトル、記事内容、カテゴリ、タグといった指定ができるで、それらを組み合わせることが使い勝手の良い検索機能を追加することができるのでは

商品名、商品説明からのキーワード検索、価格帯を指定、カテゴリー(ブランド)での絞込といった検索項目です。

 

f:id:yumeji773:20170323113015p:plain

 

プラグイン「WP Custom Fields Search」使おうと思って調べてたら、あまり設定の事とか解説されてなくて、奮闘記を少しかいきます。

「ダッシュボード」⇒「プラグイン」⇒「新規追加」からインストールしてください。

 

lovelog.eternal-tears.com

 

「ダッシュボード」⇒「設定」に「WP Custom Fields Search」が追加されるのでクリックして設定画面を開きます。

 

f:id:yumeji773:20170323114018p:plain

 

ラベル

ここには項目のタイトルとして表示される文字を入力します。
因みに、このフィールドに

 

1
<img src=http://kotori-blog.com/hogehoge/images/hoge.gif alt=ホゲ />

 

の様な書き方(プロパティを”(ダブルコーテーション)で囲わない)のimgタグ埋め込めば、項目のタイトルとして画像を表示させることができます。

 

★データタイプ

以下の中から選択します。

記事フィールド

  • カスタムフィールド
  • カテゴリー
  • タグ
  • PostType

 

データフィールド

「データタイプの中のどのデータから検索するか」を選択します。

 

ウィジェット

以下の中から選択します。

「テキストを入力」は「全角スペースの複数ワード検索」可能な検索フォームが表示されます。

 

比較

どういう条件で絞り込むか?を指定します。
選択項目を見ていただければ、分かっていただけるかと。。。

  • 同等
  • の中のフレーズ
  • の中の言葉
  • 未満
  • 以上 
  • At Most

  • At Least
  • 範囲

 

★数値

数値で~以上や~未満等の比較を行う場合、チェックを入れてください。

 

ウィジェットの設定


ラジオボタンやドロップダウンの項目の設定。
カンマ区切りで入力する。

 

ドロップダウンやラジオボタンで「選択してください」項目を入れたい場合は
「:選択してください,項目1,項目2・・・」と入力してください。


※「選択してください」追加だけ気をつけてください。:(セミコロン)を前に付ける


※絞り込み項目追加したいときは、「フィールドを追加」をクリックです。

 

テンプレート用

1
2
<?php if(function_exists('wp_custom_fields_search'))
wp_custom_fields_search(); ?>

 

記事内用

1
「wp-custom-fields-search」

 

「」[ ]に直してください。

検索結果ページ(search.php)で、前のページで入力した絞り込みキーワードを表示する。

 

この画像は実際に絞り込み検索を行って表示された検索結果ページ(search.php)です。

 

ブラウザのアドレスバーに注目すると、絞り込みフォームで選択した絞り込みのキーワードがURLにそのまま表示されてます。

これはPHPの「GETメソッド」というやつで、HTMLからスクリプトに要求を出す手段の一つです。

このURLにひっついてるキーワードをページに出力してやればよろしいのです。

 

※詳しくはこちらを参考にして下さい。

konayuki1026.blogspot.jp

 

画像の例でいくと絞り込み条件の「目的」で選択した値を出力する場合

 

1
echo '目的 :'.$_GET['cs-mokuteki-0'];
 

 

コードの $_GET[‘cs-mokuteki-0‘] はURLの表示したいキーワードの=(イコール)前の文字列です。

 

絞り込み条件「テーマ」で選択した値を出力する場合は

1
echo 'テーマ :'.$_GET['cs-theme-1'];

 

どうですか。簡単でしょう。

検索結果ページ(search.php)でページ送り

 

ページ送りですが、プラグインWP Page-Navi」を使用すれば問題なくいけます。

 

※コメントでカスタムフィールド名を日本語にすると正常に動かないです。

 

カスタムフィールドの名称(meta_key)が日本語だとパーマリンクデフォルトにしないと正常に動作しないようです。検索語自体は日本語でもOKでした。もちろんカスタムフィールドに登録するデータ(meta_value)も日本語でOKです。これで、なんとか使えそうです。

※外国で生まれたツールは、とりあえず半角英数使いえば無難ですね。

 

「WP Page-Navi」でページ送りを付けた時のコードを挙げときます。

1
2
3
4
5
6
7
8
9
10
<?php if(have_posts()) :while(have_posts()): the_post();?>
 
<div><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></div>
<div><?php the_content(); ?></div>
 
<?php
endwhile;endif;
?>   
 
<div><?php wp_pagenavi(); ?></div>
 
「is_search()」での条件分岐が効かない

※「Custom Field Search」を利用した検索結果ページ(search.php)は「is_search()」での条件分岐が効きませんでした。

 

これを利用して条件分岐します。

 

「Custom Field Search」を利用した検索結果ページの場合、必ずURLのお尻に「?search-class=○○&widget_number=○○…」の様なパラメーターが付いているはずです。

header.php等の共通テンプレートにこんな感じのタグを書くと今表示しているのが検索結果ページかどうかを判定できます!

1
2
3
<?php if($_GET['search-class']){ ?>
<!--検索結果ページにだけ表示されるコンテンツ-->
<?php } ?>

 

パラメーターで渡された「search-class」に値が入っているかどうかで今表示しているのが検索結果ページかどうかを判定できる。