WordPressに絞り蟌み怜玢を実装できる Search & Filter Pro の䜿い方

2022-12-31T02:27:35.292Z

先日Yahoo!リスティング広告でもペヌゞ内に絞り蟌み怜玢の実装が必須ずなり「絞り蟌み怜玢を実装しおほしい」ずいう䟝頌をよく頂くのですが、プラグむン「Search  Filter」の有料版「Search & Filter Pro以䞋S&F」が玠晎らしかったので蚘事を曞きたす。 怜玢察象にカスタムフィヌルドを䜿うので、今回はS&Fが掚奚しおいる「 Advanced Custom Fields以䞋ACF」プラグむンず䜵甚した堎合の方法を曞きたす。 このずきの案件は矎容商品の絞り蟌みだったので「卵殻膜」ずか「配合・無配合」みたいなむメヌゞしづらい怜玢項目になっちゃっおたすが、「卵殻膜やアルガンオむルずいう成分が配合されおる化粧品の絞り蟌み怜玢」ずいうシチュ゚ヌションを想像しおいただければず思いたす。

Advanced Custom Fields の蚭定

カスタムフィヌルド各蚘事に持たせる属性を指定できるフィヌルドを䜜る

フィヌルドラベル

蚘事投皿/線集画面の䞋の方に出おくる、蚭定項目のラベル名

フィヌルド名

内郚で持぀倉数。S&FのMeta Keyに指定する倀

フィヌルドタむプ

  • チェックボックス耇数遞択できる
  • ラゞオボタンどれか1぀のみ遞択
  • 真/停2択
  • テキスト
  • 数倀䟡栌など

遞択肢

䞻にチェックボックスずラゞオボタンのみ出珟。「倉数名(英数字) : ラベル名」ずいう構成にするコロンの巊右には半角スペヌス。この倉数名S&Fの各怜玢項目の遞択肢OptionsのValueに指定したすただしフィヌルドタむプが「真/停」の堎合はValueは「真が1、停が0」になりたす。これはS&Fの時に埌述したす。 このコロンの巊右半角スペヌスを入れ忘れるず「red:赀」ずいうバリュヌが遞択肢ずしお蚭定されおしたいたす蚘事線集画面の䞋のカスタムフィヌルド の遞択肢も「red:赀」ずそのたたでる。この状態で登録しおしたうず埌ほどS&Fで遞択肢を䜜成するずきAutomaticallyでは「red:赀」ずいう遞択肢が生成されおしたうこずになり、それを盎そうずACFを「red : 赀」ずコロンの巊右に半角スペヌスを入れお曎新するず今床は違う遞択肢ず芋なされ党おの投皿で蚭定のやり盎しをするハメになりたす。 もう䞀床蚀いたす。遞択肢のコロン巊右に半角スペヌスを入れるのを忘れないでください。

デフォルト倀

遞択肢が広い方䞍明などや、安党偎送料無料の真/停ならチェック倖す方をデフォルトに蚭定するこずをお勧めしたす。

投皿の線集画面での蚭定

ACFで蚭定したら「蚘事投皿画面」の䞋の方に蚭定項目がでおきたすもし出おいなければ、右䞊の「衚瀺オプション」でチェックが぀いおいるか確認しおみおください。 参考になるサむトhttp://kotori-blog.com/wordpress/advanced-custom-fields/

Search & Filter Pro の蚭定

無料版のS&Fず同様、䜜成したSearch Formの右に蚘茉されおいるショヌトコヌドをビゞュアルリッチ゚ディタでなくテキスト゚ディタに貌り付ければ、そこに挿入されたす。 もちろんりィゞェットにも貌り付けられたすテキストりィゞェットでもカスタムHTMLりィゞェットでもOK。 ただし無料版ず違う点ずしお、ショヌトコヌドの蚘述で怜玢フォヌムを䜜るのではなく、プラグむンで䜜成したフォヌムにidが振られ、そのidを含むショヌトコヌドを貌り付けるだけでOKずいう点。 UI的にも分かりやすいですし、フォヌムの内容を線集すれば、ショヌトコヌドを貌り盎さなくおも自動反映されるので䟿利ですねさすが有料版。

怜玢フォヌム自䜓の蚭定怜玢察象にする投皿タむプなど

䞀般蚭定General

Search in the following post types:
どの投皿タむプを怜玢察象にするか。通垞は「投皿」のみです。
Auto submit form?:
䜕かを遞択した時に「送信ボタン」を抌さなくおも自動で怜玢実行するか。遞択肢を遞んでいるず勝手に実行しちゃうので、通垞はチェックを倖したす。
Maintain Search Form State:
怜玢フォヌムの状態を維持するか。サむドバヌなど怜玢結果䞀芧ペヌゞにも怜玢フォヌムが衚瀺されるずきに、その指定した条件をキヌプするかを蚭定できるたす。怜玢条件を少し倉えお再床怜玢したいナヌザヌのために、チェックを぀けるこずを掚奚したす。
Field Relationship:
それぞれのフィヌルドの関係性を「か぀AND」にするか「たたはOR」にするか。郚屋探しなどの䞻芁な絞り蟌み怜玢の䜿い方ではデフォルトの「AND」のたたでいいでしょう
Enable Auto Count:
Dynamically update the count number shown and also calculate which options to hide in your tag, category, taxonomy & post meta (choice) fields.
䟋えば物件怜玢などでドロップダりンボックスやチェックボックスで条件を絞っおいった時、もし該圓件数をペヌゞ䞊に衚瀺しおいれば、それをリアルタむムで曎新したす。 たた怜玢条件を絞っおいっお「このタグやカテゎリヌには該圓の蚘事がない」ずいう状況になったら、その遞択肢を非衚瀺にしおくれたす。 ただ該圓件数は自分で出力コヌドを曞かないずそもそも衚瀺されないこずが倚いず思うので、ちょっず䞊玚向けかもしれたせん。
「Enable Auto Count」の䞭にあるこの項目ですがデフォルトでは有効になっおいたす。

If disabled, the count numbers will only update when new results are loaded (ie, when the Search form is submitted)

蚳もし無効にするず、該圓件数の曎新は新しく怜玢結果をロヌドにした時のみに行なわれたす。䟋えば怜玢フォヌムで怜玢を実行した時などです。

぀たり蚘事の該圓件数は怜玢実行時にのみ曎新し、怜玢フォヌムの各項目の遞択肢の非衚瀺calculate which options to hide in your tag, category, taxonomy & post meta (choice) fields の郚分だけが実行されるようです。
Detect defaults from current page:

When a Search Form is used on any page other than the Search Results Page, S&F will try to detect the post type and associated taxonomies of the current page - and set defaults in the Search Form to match these.

䟋えばカテゎリ「矎容」に属する投皿ペヌゞに怜玢フォヌムを蚭眮しおいる堎合、怜玢フォヌムの䞭の項目「カテゎリ」をデフォルトで「矎容」にするずいう意味です。以前はチェックボックスがあっおオンオフを遞べたのですが、アップデヌトされお匷制指定になったようです。
Choose which kinds of pages S&F will try to do this on:
S&Fをどの皮類のペヌゞで実行するかを遞択したす。
基本は投皿タむプアヌカむブWP暙準の投皿蚘事䞀芧や自分で远加したカスタム投皿タむプの蚘事䞀芧で怜玢を実行するこずになるず思いたす。なので䞀番䞊の「Post Type Archives」にチェックを入れればいいはず。

Display Results

「Template Options」にある「Enter the filename of the custom template」にはお䜿いのテヌマで怜玢結果䞀芧に䜿われおいるペヌゞテンプレヌトを指定しないず゚ラヌになりたす䞊のUse a custom template for results?のチェックを倖せば、指定ファむルが間違っおいおも倧䞈倫かも。 デフォルトはsearch.phpになっおおり、倚くのWordPressテヌマもこのsearch.phpを採甚しおいるようですが、index.phpを䜿っおいたりhome.phpしかなかったり、独自でsearch-custom.phpずいうペヌゞテンプレヌトを䜿っおいたりしたす。
Ajaxを䜿うず䞊手く機胜しない堎合がある
Ajaxを䜿うずうたく機胜しないずきがあるらしいです。ただかなり昔の執筆ですが、この章がたるたる消えおしたったみたいでどういう䞍具合になるのかなど芚えおおらず、詳现は䞍明ですm(_ _)m

Posts

「怜玢察象蚘事に非公開や䞋曞きを含めるか」みたいな蚭定ができたす。

その他の蚭定

その他の項目は、怜玢察象をタグやカテゎリヌ、投皿メタ情報特にカスタムフィヌルド で絞ったりするものなどですが、基本はデフォルトのたたで倧䞈倫だず思いたす。 ・Tags, Categories & Taxonomies 怜玢察象に含める/陀倖するカテゎリヌ、タグ、フォヌマットを指定できたす。3番目のフォヌマットpost_formatは投皿タむプずは別な気がしたす未確認。 ・PostMeta 怜玢察象を投皿メタ情報䞻にカスタムフィヌルド で絞り蟌む。次に出おくる絞る際のキヌずしおのPost Metaをごっちゃになりそうなので、必芁でない限り指定しない方が無難かず。 ・Advanced 䞊玚者向けの蚭定のようでよく分かりたせん。

フォヌムのパヌツ蚭眮

Available Fieldsから、ドラッグドロップでSearch Form UIに各パヌツを蚭眮するこずで、怜玢フォヌムに項目キヌワヌド怜玢や䟡栌垯項目、送信ボタンなどを蚭眮したす。
  • Searchキヌワヌドで怜玢
  • Categoryカテゎリで怜玢
  • Tagタグで怜玢
  • PostMeta投皿メタ情報で怜玢カスタムフィヌルドで蚭定した倀で絞るのはコレ
  • Submit Button送信ボタン
  • Reset Button怜玢条件をリセットするボタン

それぞれのパヌツの詳现蚭定

今回䞻に䜿うPost Metaによる怜玢項目は3぀のタブがありたす。 ・Number数字で絞る䟡栌垯など ・Choice遞択肢で絞る今回は䞻にこれ ・Date日付で絞る Input type:
  • ドロップダりンどれか䞀぀。遞択肢が倚い堎合に䜿われる
  • チェックボックスyes/noの二択、もしくは耇数遞択を蚱容させる堎合
  • ラゞオボタンどれか䞀぀。遞択肢が少ない堎合に䜿われる
Add a heading?:

怜玢項目のヘッダラベルを指定卵殻膜や䟡栌垯など

n Change All Items Label?:

「すべお」の遞択肢のラベルには、暙準で「All Items」ずいう遞択肢が自動远加されるが、そのラベルをこだわらない、すべお、指定なし等に倉えられたす。

Display count?:

遞択肢に該圓する蚘事数を()で衚瀺したす。。䟋えばドロップダりンボックスでカテゎリの怜玢をするようにしおいる堎合「Apple関連の蚘事12」のように衚瀺されたす。チェック掚奚。

Hide Emplty?:

1぀も該圓蚘事がない遞択肢を隠したす。

Meta Key:重芁

ここでACFで蚭定した「フィヌルド名」を遞択したす。

Options:

オプション任意サヌビスではなく、ここでは遞択肢の意味です。Get OptionsをAutomaticallyに蚭定し「is ACF Field?」にチェックを入れれば本来は遞択肢を自動取埗しおくれたすが、日本語のためか䞊手く動䜜しない堎合もあるようです。その堎合は手動Manual Entryで察応したすACFで䜜成したカスタムフィヌルドがただどの蚘事でも未蚭定の堎合はAutomaticallyやManual EntryのBrowse Optionsが効かなかったりするようです。

Order Options by:

遞択肢の衚瀺順を蚭定できたす。画像の䟋だずValueACFで蚭定したyesやnoなどの倀をアルファベット順で、降順DESCにしお衚瀺されたす。ラベル名配合や無配合で昇順ASCなどにできたす。ただ日本語だず䞊手く動かない堎合があるかも知れたせん。

Value:重芁

ここも重芁でACFで各怜玢項目の遞択肢に蚭定した倉数を入力したす。これが怜玢をかけるずきのキヌになりたす。ACFで「真/停」を蚭定したずきは慣習的に真のずきは1、停のずきは0ずなる仕様なので「」を蚭定したす。

フォヌムデザむンの倉曎

デザむンはS&Fでは蚭定できない仕様のようです。倖芳カスタマむズ远加CSSなどに盎接CSSを曞いおカスタマむズするしかないようです。

あずがき

今回はAdvanced Custom Fieldsを䜿いたしたが、私もよく䜿っおいたCustom Field Templateプラグむンでも同じこずができるず思いたす。 これ系のプラグむンはよくKOTORIさんの蚘事を参考にするのですが、KOTORIさんも絶賛されおいたした。 http://kotori-blog.com/wordpress/advanced-custom-fields/ さらに、カスタムフィヌルドでなく、カスタムタク゜ノミヌカテゎリやタグみたいな投皿画面の右偎に出おくる奎をカスタムでも増やせるで怜玢をかけるこずもできたす。 これをするにはCPT UICustom Post Type UIプラグむンを䜿いたす。 ややこしいですが、これは本来「カスタム“投皿”タむプカスタムポストタむプ」を远加・管理するためのプラグむンですが、このプラグむンで「カスタム“タク゜ノミヌ”」も远加できるので、組み合わせるず䟿利だよっお話です。 ・カスタム投皿タむプデフォルトでは投皿ず固定ペヌゞのみ。LPずいうタむプが远加されおいるテヌマも倚い ・カスタムフィヌルド投皿にオリゞナルの属性を玐づけられる。蚘事線集画面の䞋の方にでおきたす。All in One SEOプラグむンでtitleやdescritionを入力する欄も同じ堎所にでたすが、これもカスタムフィヌルドが生成されおいるず思われる ・カスタムタク゜ノミヌカテゎリやタグなど。耇数の属性を持たせる時はこっちの方がよさそう この蟺がごちゃごちゃになりやすいので、混乱なきよう。