{"id":8824,"date":"2019-06-07T09:52:25","date_gmt":"2019-06-07T09:52:25","guid":{"rendered":"https:\/\/crocoblock.com\/knowledge-base\/?post_type=article&#038;p=8824"},"modified":"2024-03-06T11:12:52","modified_gmt":"2024-03-06T11:12:52","slug":"jetsmartfilters-how-to-create-a-search-filter","status":"publish","type":"article","link":"https:\/\/crocoblock.com\/knowledge-base\/jetsmartfilters\/jetsmartfilters-how-to-create-a-search-filter\/","title":{"rendered":"Search Filter Overview"},"content":{"rendered":"\n<p>The <strong>Search<\/strong> filter is one of the features available with the <a href=\"https:\/\/crocoblock.com\/plugins\/jetsmartfilters\/\" target=\"_blank\" rel=\"noreferrer noopener\"><em>JetSmartFilters<\/em><\/a> plugin. This filter can be used to allow visitors to search for the matching results manually by inputting the needed words into the <strong>Search <\/strong>field.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"search-filter-dashboard-settings\"><strong>Search Filter Dashboard Settings<\/strong><\/h2>\n\n\n\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\"><div class=\"wp-block-group__inner-container\">\n<p>The settings for the <strong>Search Filter <\/strong>can be found in <strong><em>WordPress Dashboard > Smart Filters > Add New<\/em><\/strong>.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"filter-settings\">Filter Settings<\/h3>\n\n\n\n<div class=\"wp-block-image aligncenter size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/edit-filter-page-1.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"640\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/edit-filter-page-1-1024x640.webp\" alt=\"edit filter page\" class=\"wp-image-43710\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/edit-filter-page-1-1024x640.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/edit-filter-page-1-300x188.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/edit-filter-page-1-768x480.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/edit-filter-page-1-1536x960.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/edit-filter-page-1-600x375.webp 600w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/edit-filter-page-1.webp 1824w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/div>\n\n\n\n<ul>\n<li><strong>Filter Name <\/strong>\u2014 a field where the filter name should be put;<\/li>\n\n\n\n<li><strong>Filter Type <\/strong>\u2014 a section with all available filters presented. Among the options, the \u201cSearch\u201d one should be picked to create a <strong>Search Filter<\/strong>;<\/li>\n\n\n\n<li><strong>Search by <\/strong>\u2014 a selector with options to detect the way the filter will work.<\/li>\n<\/ul>\n\n\n\n<p>In the <strong>Search by<\/strong> the bar, there are two variants to choose from.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"default-wordpress-search\">Default WordPress search<\/h4>\n\n\n\n<p>The \u201cDefault WordPress search\u201d will apply a default search to this filter.<\/p>\n\n\n\n<div class=\"wp-block-image aligncenter size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/default-wordpress-search-settings.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"640\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/default-wordpress-search-settings-1024x640.webp\" alt=\"default wordpress search settings\" class=\"wp-image-43711\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/default-wordpress-search-settings-1024x640.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/default-wordpress-search-settings-300x188.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/default-wordpress-search-settings-768x480.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/default-wordpress-search-settings-1536x960.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/default-wordpress-search-settings-600x375.webp 600w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/default-wordpress-search-settings.webp 1824w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/div>\n\n\n\n<ul>\n<li><strong>Placeholder <\/strong>\u2014 a text displayed on a search bar. It can be later changed in the block\/widget\/element settings in the selected editor, respectively.<\/li>\n<\/ul>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"by-custom-field-from-query-variable\">By custom field (from query variable)<\/h4>\n\n\n\n<p>The <strong>By Custom Field (from Query Variable)<\/strong> option will allow the users to do searches in fields mentioned in the <strong>Query Variable<\/strong> text area.<\/p>\n\n\n\n<div class=\"wp-block-image aligncenter size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/by-custom-field-from-query-variable-settings.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"640\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/by-custom-field-from-query-variable-settings-1024x640.webp\" alt=\"by custom field from query variable settings\" class=\"wp-image-43712\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/by-custom-field-from-query-variable-settings-1024x640.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/by-custom-field-from-query-variable-settings-300x188.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/by-custom-field-from-query-variable-settings-768x480.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/by-custom-field-from-query-variable-settings-1536x960.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/by-custom-field-from-query-variable-settings-600x375.webp 600w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/by-custom-field-from-query-variable-settings.webp 1824w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/div>\n\n\n\n<ul>\n<li><strong>Placeholder <\/strong>\u2014 a text shown on the search bar;<\/li>\n\n\n\n<li><strong>Query Variable <\/strong>\u2014 a field to set the name of the field the filter is to search in; it is required for the correct work of the filter. It can be completed manually or by pushing the \u201c<strong>Dynamic Tags<\/strong>\u201d button next to the field. The <strong>Name\/ID <\/strong>value should be put here to filter by exact meta field.<\/li>\n<\/ul>\n\n\n\n<p>The options presented here can be pulled from different plugins if they are installed and activated. Some may require additional clarifications to complete in the extra settings fields.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"use-default-filter-value\">Use Default Filter Value<\/h3>\n\n\n\n<p>A toggle that, if enabled, allows setting the <strong>Default Field Value<\/strong> that will be set by default in the filter and applied to the provider via an Ajax request on the front end.<\/p>\n\n\n\n<div class=\"wp-block-image aligncenter size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/use-default-filter-value-toggle-2.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"640\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/use-default-filter-value-toggle-2-1024x640.webp\" alt=\"use default filter value toggle\" class=\"wp-image-43713\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/use-default-filter-value-toggle-2-1024x640.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/use-default-filter-value-toggle-2-300x188.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/use-default-filter-value-toggle-2-768x480.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/use-default-filter-value-toggle-2-1536x960.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/use-default-filter-value-toggle-2-600x375.webp 600w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/use-default-filter-value-toggle-2.webp 1824w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/div>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"filter-labels\">Filter Labels<\/h3>\n\n\n\n<div class=\"wp-block-image aligncenter size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/filter-labels-1.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"640\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/filter-labels-1-1024x640.webp\" alt=\"filter labels\" class=\"wp-image-43714\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/filter-labels-1-1024x640.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/filter-labels-1-300x188.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/filter-labels-1-768x480.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/filter-labels-1-1536x960.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/filter-labels-1-600x375.webp 600w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/filter-labels-1.webp 1824w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/div>\n\n\n\n<ul>\n<li><strong>Filter Label <\/strong>\u2014 a label to identify the filter and display it on the front end if needed;<\/li>\n\n\n\n<li><strong>Active Filter Label <\/strong>\u2014 a label shown on the page if the corresponding filter is active.<\/li>\n<\/ul>\n<\/div><\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"filter-in-editors\"><strong>Filter in Editors<\/strong><\/h2>\n\n\n\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\"><div class=\"wp-block-group__inner-container\">\n<p>As the filter is saved, it can be displayed on the front end with the help of different editors: Elementor, WordPress editor, or Bricks.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"search-filter-in-elementor\">Search filter in Elementor<\/h3>\n\n\n\n<p>Elementor editor includes the <strong>Search Filter <\/strong>widget that has the following settings:\u00a0<\/p>\n\n\n\n<div class=\"wp-block-image aligncenter size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/content-settings-in-elementor-1.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"640\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/content-settings-in-elementor-1-1024x640.webp\" alt=\"content settings in elementor\" class=\"wp-image-43715\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/content-settings-in-elementor-1-1024x640.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/content-settings-in-elementor-1-300x188.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/content-settings-in-elementor-1-768x480.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/content-settings-in-elementor-1-1536x960.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/content-settings-in-elementor-1-600x375.webp 600w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/content-settings-in-elementor-1.webp 1824w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/div>\n\n\n\n<ul>\n<li><strong>Select Filter <\/strong>\u2014 a field for filter selection. To find a filter, one or more letters from the filter\u2019s name should be entered;<\/li>\n\n\n\n<li><strong>This filter for <\/strong>\u2014 a provider list; options here represent widgets that can be added to the page and connected to the filter;<\/li>\n\n\n\n<li><strong>Apply type <\/strong>\u2014 a selector of filtering way. \u201cAJAX\u201d will show results without reloading the page, \u201cAJAX on typing\u201d works when the minimum amount of letters (number can be set in the <strong>Min number of letters <\/strong>field) is typed in the search bar, \u201cPage reload\u201d reloads the page on search respectively, and \u201cMixed\u201d doesn&#8217;t reload the page, but changes the URL so it can be copied to send the search results page if needed;<\/li>\n\n\n\n<li><strong>Search button text <\/strong>\u2014 a text displayed on the search button;<\/li>\n\n\n\n<li><strong>Search button icon <\/strong>\u2014 an icon that will be added to the search button text;<\/li>\n\n\n\n<li><strong>Show filter label <\/strong>\u2014 a toggle that shows the filter label above the filter once activated;<\/li>\n\n\n\n<li><strong>Query ID <\/strong>\u2014 a field that can be completed with the <strong>CSS ID <\/strong>of another widget that is needed to be set as a provider. For instance, if there are two <a href=\"https:\/\/crocoblock.com\/knowledge-base\/features\/listing-grid-widget-overview\/\" target=\"_blank\" rel=\"noreferrer noopener\"><strong>Listing Grids<\/strong><\/a><strong> <\/strong>on the page, but only one should be filtered, the <strong>Query ID <\/strong>of the filter and <strong>CSS ID <\/strong>of the needed <strong>Listing Grid <\/strong>should match;<\/li>\n\n\n\n<li><strong>Additional Providers Enabled <\/strong>\u2014 a toggle that can be activated if the filter is supposed to work with several providers. These can be added by pressing the \u201c<strong>Add Item<\/strong>\u201d button.<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"search-filter-in-wordpress-editor\">Search filter in WordPress editor<\/h3>\n\n\n\n<p>The <strong>Search <\/strong>block is available in the WordPress editor and includes the same fields for customization as in <a href=\"#search-filter-in-elementor\">Elementor<\/a>.<\/p>\n\n\n\n<div class=\"wp-block-image aligncenter size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/search-filter-in-gutenberg.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"640\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/search-filter-in-gutenberg-1024x640.webp\" alt=\"search filter in gutenberg\" class=\"wp-image-43717\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/search-filter-in-gutenberg-1024x640.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/search-filter-in-gutenberg-300x188.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/search-filter-in-gutenberg-768x480.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/search-filter-in-gutenberg-1536x960.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/search-filter-in-gutenberg-600x375.webp 600w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/search-filter-in-gutenberg.webp 1824w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/div>\n\n\n\n<p>However, there is also an <strong>Advanced <\/strong>section. Here, the <strong>Additional CSS Class(es) <\/strong>field can be completed with the desired CSS class. If several classes are to be used, one should separate them with spaces.<\/p>\n\n\n\n<div class=\"wp-block-image aligncenter size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/advanced-tab-in-gutenberg-1.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"640\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/advanced-tab-in-gutenberg-1-1024x640.webp\" alt=\"advanced tab in gutenberg\" class=\"wp-image-43718\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/advanced-tab-in-gutenberg-1-1024x640.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/advanced-tab-in-gutenberg-1-300x188.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/advanced-tab-in-gutenberg-1-768x480.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/advanced-tab-in-gutenberg-1-1536x960.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/advanced-tab-in-gutenberg-1-600x375.webp 600w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/advanced-tab-in-gutenberg-1.webp 1824w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/div>\n\n\n<div class=\"note-banner d-flex border-bold border-jetthemecore rounded overflow-hidden p-20\"><div class=\"mr-12\"><svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M9 21C9 21.5 9.4 22 10 22H14C14.6 22 15 21.5 15 21V20H9V21ZM12 2C8.1 2 5 5.1 5 9C5 11.4 6.2 13.5 8 14.7V17C8 17.5 8.4 18 9 18H15C15.6 18 16 17.5 16 17V14.7C17.8 13.4 19 11.3 19 9C19 5.1 15.9 2 12 2Z\" fill=\"#F2D23C\"\/><\/svg><\/div><div class=\"d-flex flex-column\"><div class=\"text-900 mb-12\">Things to know<\/div><p class=\"m-0\">If the <a href=\"https:\/\/crocoblock.com\/plugins\/jetpopup\/\" target=\"_blank\" rel=\"noopener\"><strong>JetPopup<\/strong><\/a> plugin installed and activated, the following fields will become available.<\/p><\/div><\/div>\n\n\n\n<p>One more field available in this tab is the <strong>Attached Popup<\/strong> drop-down. The pop-up can be selected here, and then the <strong>Trigger Type<\/strong> options list appears. Among the options are \u201cClick,\u201d \u201cCustom Selector Click,\u201d \u201cHover,\u201d and \u201cScroll to Block.\u201d<\/p>\n\n\n\n<p>The following <strong>JetEngine Listing popup <\/strong>option should be activated in case the selected pop-up is supposed to be put in the <strong>Listing Grid <\/strong>item.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"search-filter-in-bricks\">Search filter in Bricks<\/h3>\n\n\n\n<p>The <strong>Content <\/strong>tab of Bricks editor repeats the same settings as in <a href=\"#search-filter-in-elementor\">Elementor Page Builder<\/a>.<\/p>\n\n\n\n<div class=\"wp-block-image aligncenter size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/search-filter-in-bricks.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"640\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/search-filter-in-bricks-1024x640.webp\" alt=\"search filter in bricks\" class=\"wp-image-43719\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/search-filter-in-bricks-1024x640.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/search-filter-in-bricks-300x188.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/search-filter-in-bricks-768x480.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/search-filter-in-bricks-1536x960.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/search-filter-in-bricks-600x375.webp 600w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/search-filter-in-bricks.webp 1824w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"result\">Result<\/h2>\n\n\n\n<p>Now, on the front end, the search bar with the provider is displayed.<\/p>\n\n\n\n<div class=\"wp-block-image aligncenter size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/search-filter-on-the-front-end.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"640\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/search-filter-on-the-front-end-1024x640.webp\" alt=\"search filter on the front end\" class=\"wp-image-43720\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/search-filter-on-the-front-end-1024x640.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/search-filter-on-the-front-end-300x188.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/search-filter-on-the-front-end-768x480.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/search-filter-on-the-front-end-1536x960.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/search-filter-on-the-front-end-600x375.webp 600w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/search-filter-on-the-front-end.webp 1824w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/div>\n\n\n\n<p>If a user completes the search bar and clicks the button, the search will be conducted, and the found results will be displayed.<\/p>\n\n\n\n<div class=\"wp-block-image aligncenter size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/search-filter-in-action.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"640\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/search-filter-in-action-1024x640.webp\" alt=\"search filter in action\" class=\"wp-image-43721\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/search-filter-in-action-1024x640.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/search-filter-in-action-300x188.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/search-filter-in-action-768x480.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/search-filter-in-action-1536x960.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/search-filter-in-action-600x375.webp 600w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/search-filter-in-action.webp 1824w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/div>\n<\/div><\/div>\n\n\n\n<p>That\u2019s all about the <strong>Search Filter <\/strong>settings, which are available as a part of the <em>JetSmartFilters <\/em>functionality.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>This tutorial uncovers how to create a Search filter with the help of the JetSmartFilters plugin in the Elementor, Gutenberg, and Bricks editors.<\/p>\n","protected":false},"author":11,"featured_media":0,"template":"","format":"standard","builder-category":[],"article-category":[303],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v20.9 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Search Filter Overview \u2014 JetSmartFilters | Crocoblock<\/title>\n<meta name=\"description\" content=\"Explore one of the JetSmartFilters options, the Search filter. It allows seeking matching results by inputting certain words in the search bar.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/crocoblock.com\/knowledge-base\/jetsmartfilters\/jetsmartfilters-how-to-create-a-search-filter\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Search Filter Overview \u2014 JetSmartFilters | Crocoblock\" \/>\n<meta property=\"og:description\" content=\"Explore one of the JetSmartFilters options, the Search filter. It allows seeking matching results by inputting certain words in the search bar.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/crocoblock.com\/knowledge-base\/jetsmartfilters\/jetsmartfilters-how-to-create-a-search-filter\/\" \/>\n<meta property=\"og:site_name\" content=\"Help Center\" \/>\n<meta property=\"article:modified_time\" content=\"2024-03-06T11:12:52+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/edit-filter-page-1-1024x640.webp\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"6 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/jetsmartfilters\/jetsmartfilters-how-to-create-a-search-filter\/\",\"url\":\"https:\/\/crocoblock.com\/knowledge-base\/jetsmartfilters\/jetsmartfilters-how-to-create-a-search-filter\/\",\"name\":\"Search Filter Overview \u2014 JetSmartFilters | Crocoblock\",\"isPartOf\":{\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#website\"},\"datePublished\":\"2019-06-07T09:52:25+00:00\",\"dateModified\":\"2024-03-06T11:12:52+00:00\",\"description\":\"Explore one of the JetSmartFilters options, the Search filter. It allows seeking matching results by inputting certain words in the search bar.\",\"breadcrumb\":{\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/jetsmartfilters\/jetsmartfilters-how-to-create-a-search-filter\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/crocoblock.com\/knowledge-base\/jetsmartfilters\/jetsmartfilters-how-to-create-a-search-filter\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/jetsmartfilters\/jetsmartfilters-how-to-create-a-search-filter\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/crocoblock.com\/knowledge-base\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Articles\",\"item\":\"https:\/\/crocoblock.com\/knowledge-base\/articles\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Search Filter Overview\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#website\",\"url\":\"https:\/\/crocoblock.com\/knowledge-base\/\",\"name\":\"Help Center\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/crocoblock.com\/knowledge-base\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#organization\",\"name\":\"Help Center\",\"url\":\"https:\/\/crocoblock.com\/knowledge-base\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/04\/invert-crocoblock-logo.svg\",\"contentUrl\":\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/04\/invert-crocoblock-logo.svg\",\"caption\":\"Help Center\"},\"image\":{\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#\/schema\/logo\/image\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Search Filter Overview \u2014 JetSmartFilters | Crocoblock","description":"Explore one of the JetSmartFilters options, the Search filter. It allows seeking matching results by inputting certain words in the search bar.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/crocoblock.com\/knowledge-base\/jetsmartfilters\/jetsmartfilters-how-to-create-a-search-filter\/","og_locale":"en_US","og_type":"article","og_title":"Search Filter Overview \u2014 JetSmartFilters | Crocoblock","og_description":"Explore one of the JetSmartFilters options, the Search filter. It allows seeking matching results by inputting certain words in the search bar.","og_url":"https:\/\/crocoblock.com\/knowledge-base\/jetsmartfilters\/jetsmartfilters-how-to-create-a-search-filter\/","og_site_name":"Help Center","article_modified_time":"2024-03-06T11:12:52+00:00","og_image":[{"url":"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/03\/edit-filter-page-1-1024x640.webp"}],"twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"6 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/crocoblock.com\/knowledge-base\/jetsmartfilters\/jetsmartfilters-how-to-create-a-search-filter\/","url":"https:\/\/crocoblock.com\/knowledge-base\/jetsmartfilters\/jetsmartfilters-how-to-create-a-search-filter\/","name":"Search Filter Overview \u2014 JetSmartFilters | Crocoblock","isPartOf":{"@id":"https:\/\/crocoblock.com\/knowledge-base\/#website"},"datePublished":"2019-06-07T09:52:25+00:00","dateModified":"2024-03-06T11:12:52+00:00","description":"Explore one of the JetSmartFilters options, the Search filter. It allows seeking matching results by inputting certain words in the search bar.","breadcrumb":{"@id":"https:\/\/crocoblock.com\/knowledge-base\/jetsmartfilters\/jetsmartfilters-how-to-create-a-search-filter\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/crocoblock.com\/knowledge-base\/jetsmartfilters\/jetsmartfilters-how-to-create-a-search-filter\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/crocoblock.com\/knowledge-base\/jetsmartfilters\/jetsmartfilters-how-to-create-a-search-filter\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/crocoblock.com\/knowledge-base\/"},{"@type":"ListItem","position":2,"name":"Articles","item":"https:\/\/crocoblock.com\/knowledge-base\/articles\/"},{"@type":"ListItem","position":3,"name":"Search Filter Overview"}]},{"@type":"WebSite","@id":"https:\/\/crocoblock.com\/knowledge-base\/#website","url":"https:\/\/crocoblock.com\/knowledge-base\/","name":"Help Center","description":"","publisher":{"@id":"https:\/\/crocoblock.com\/knowledge-base\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/crocoblock.com\/knowledge-base\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/crocoblock.com\/knowledge-base\/#organization","name":"Help Center","url":"https:\/\/crocoblock.com\/knowledge-base\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/crocoblock.com\/knowledge-base\/#\/schema\/logo\/image\/","url":"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/04\/invert-crocoblock-logo.svg","contentUrl":"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/04\/invert-crocoblock-logo.svg","caption":"Help Center"},"image":{"@id":"https:\/\/crocoblock.com\/knowledge-base\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/article\/8824"}],"collection":[{"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/article"}],"about":[{"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/types\/article"}],"author":[{"embeddable":true,"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/users\/11"}],"wp:attachment":[{"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/media?parent=8824"}],"wp:term":[{"taxonomy":"builder-category","embeddable":true,"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/builder-category?post=8824"},{"taxonomy":"article-category","embeddable":true,"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/article-category?post=8824"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}