Built on WIX Headless

チュートリアル / チュートリアル

Wix CMS表示にSearch and Filtersを追加する方法

· Wix CMS search filters 概要

Wix CMS表示にSearch and Filtersを追加する方法

訪問者の検索とフィルタは、大きなCMSリストを使いやすく保ちます。名前を打つ、カテゴリを選ぶ、価格や日付で絞る。このページは地図です—何ができるか、どのウィジェットが対応するか、次に開く焦点チュートリアル。

Editor、Studio、Harmonyで動作。CMS for Harmonyは3つすべてで動き、名前はHarmony専用ではありません。

目標から:Wix CMSガイド。

仕事に合うガイドを選ぶ

質問ここへ
コレクションアイテムのキーワード検索(サイト検索ではない)検索バーを追加
カード上のカテゴリ/タグ閲覧Repeaterのカテゴリフィルタ
検索+複数フィルタ+範囲検索とフィルタを組み合わせる
密な検索可能在庫検索可能なテーブル
ディレクトリ一式検索可能なディレクトリ
正確なパネル表記Search & filtersドキュメント

ネイティブ vs アプリ

Editorネイティブ訪問者フィルタCMS for Harmony
Studio / Editor多くのカテゴリフィルタはdataset+入力;ライブキーワード検索はしばしばVelo組み込み検索UI付きの同じTable/Repeaterツールキット
Harmony今日は1つのネイティブリスト上の訪問者フィルタは限定的対応ウィジェットのSearch & filters

Harmonyのギャップ:CMS制限。アプリ=ウィジェットのみ(ネイティブText/Image/Buttonバインドなし)。

Search & filters対応ウィジェット

WidgetSearch / filters
TableYes
RepeaterYes
CalendarYes — 検索はTitleとDetails
Media GalleryYes
SlideshowYes — マップされていればTitle/Text/Button label
Dynamic PageNo visitor search/filters
FormN/A

セットアップ概要(アプリ)

  1. 対応表示をコレクションに接続(許可される場合はPro Sheetsも)。
  2. Search & filtersを開く。
  3. Show search barおよび/またはShow filtersを有効化。
  4. 正しいマッチ条件(equals、contains、rangesなど)でフィルタを追加。
  5. 訪問者UIはShow filter、常時適用の隠れルールはChoose value。
  6. Filters displayをTopまたはSideに。
  7. 公開し、訪問者としてテスト。

重要なモード

Mode使うとき
Show filter訪問者がカテゴリ、都市、色、価格帯を選ぶ
Choose valueUIなしで常に固定マッチを適用
Ranges日付と数値
Color swatchesカタログのColorフィールド
Reference filtersラベル用Display field付き関連コレクション

よくあるセットアップ

Use case典型ウィジェット+フィルタ
Team directorydepartment/roleのRepeaterまたはTable
Real estatecityとprice rangeのRepeater
Product catalogRepeater/Table+Color swatches+category
EventsCalendar+date filters
Portfoliotype別のMedia GalleryまたはSlideshow

業界例:検索可能なディレクトリ、不動産、チームディレクトリ。

プランメモ

対応表示のSearch & filtersはコアのアプ表面(paymentsやSheetsのようなProゲートではない)。Pro Sheets接続でも、ウィジェットが対応する限りsearch/filtersを使えます。

FAQ

コードなしでフィルタを足せる?

はい—多くのカテゴリフィルタはStudio/Editorのネイティブdataset入力、または対応ウィジェット上のCMS for Harmony Search & filters。

ネイティブHarmonyは訪問者フィルタに対応する?

今日は1リスト上の完全な訪問者入力としては未対応です。

アプリはEditorとStudioでも動く?

はい。

関連

更新日:

Harmony で試してみますか? 無料のスターターサイトを作成 CMS for Harmony