{"id":44576,"date":"2024-05-27T15:03:09","date_gmt":"2024-05-27T15:03:09","guid":{"rendered":"https:\/\/crocoblock.com\/knowledge-base\/?post_type=article&p=44576"},"modified":"2024-05-27T15:08:47","modified_gmt":"2024-05-27T15:08:47","slug":"how-to-make-custom-url-for-search-results-page","status":"publish","type":"article","link":"https:\/\/crocoblock.com\/knowledge-base\/jetsearch\/how-to-make-custom-url-for-search-results-page\/","title":{"rendered":"How to Make the Custom URL for the Search Results Page"},"content":{"rendered":"\n

Ajax Search<\/strong><\/a> <\/strong>is a dynamic search field that uses AJAX (Asynchronous JavaScript and XML) to fetch search results in real-time as the user types in the search query without reloading the page.<\/p>\n\n\n\n

By default, the Ajax Search <\/strong>widget\/block\/element redirects us to the default WordPress search results page.<\/p>\n\n\n\n

To enhance user experience and SEO, you can create a custom page and attach its URL to the search results in the JetSearch <\/em>plugin\u2019s settings.<\/p>\n\n\n\n

This tutorial provides step-by-step instructions on the example of a post and WooCommerce<\/em> product search on a book e-commerce website.<\/p>\n\n\n

<\/svg><\/div>
Things to know<\/div>

The provided tutorial is based on the OnlyBooks<\/strong><\/a> dynamic template.<\/p><\/div><\/div>\n\n\n\n

Displaying Posts on the Search Results Page<\/h2>\n\n\n\n
\n

To display the WordPress default posts on the Search Results page, we will create a Listing template<\/strong><\/a>, which will be displayed with the Listing Grid <\/strong>widget<\/a>, block<\/a>, or element<\/a> provided by the JetEngine<\/em><\/a> plugin.<\/em> Such a listing can also be crafted for custom posts<\/strong><\/a>.<\/p>\n\n\n\n

Create a Listing<\/h3>\n\n\n\n

Go to the WordPress Dashboard > JetEngine > Listings <\/em><\/strong>and hit the \u201cAdd New<\/strong>\u201d button.<\/p>\n\n\n\n

Select the \u201cPosts\u201d Listing source <\/strong>and the needed post type for the From post type <\/strong>field (\u201cPosts,\u201d in our case). Then, enter the Listing item name <\/strong>and choose the Listing view<\/strong> (it can be Elementor, Gutenberg, or Bricks).<\/p>\n\n\n\n

Push the “Create Listing Item<\/strong>” button.<\/p>\n\n\n\n

\"listing<\/a><\/div>\n\n\n\n

On the editing page, you can customize the listing template using Dynamic Widgets, Blocks, and Elements<\/strong><\/a>.<\/p>\n\n\n\n

For instance, we used the Dynamic Image <\/strong>widget<\/a> with the \u201cPost Thumbnail\u201d Source<\/strong> to display the featured image.<\/p>\n\n\n\n

\"dynamic<\/a><\/div>\n\n\n\n

Then, we placed the Dynamic Terms <\/strong>widget<\/a> with the \u201cCategories\u201d source to show the post category.<\/p>\n\n\n\n

\"dynamic<\/a><\/div>\n\n\n\n

We drag-n-dropped the Dynamic Link <\/strong>widget<\/a> with the \u201cPermalink\u201d Source <\/strong>and \u201c%title%\u201d Label <\/strong>to display the post title with the permalink on the post.<\/p>\n\n\n\n

\"dynamic<\/a><\/div>\n\n\n\n

The last two are Dynamic Meta <\/strong>widgets<\/a>: the first displays the post author, and the second \u2014 the post date.<\/p>\n\n\n\n

\"dynamic<\/a><\/div>\n\n\n\n

After you finish customizing the listing template, hit the \u201cUpdate<\/strong>\u201d button.<\/p>\n\n\n\n

Create a Search Results page<\/h3>\n\n\n\n

Go to WordPress Dashboard > Pages > Add New Page<\/em><\/strong>, name the page, and choose the editor in which you want to craft it. For example, we hit the \u201cEdit with Elementor<\/strong>\u201d button.<\/p>\n\n\n\n

We added the Listing Grid <\/strong>widget<\/a> for which we set the recently created Listing<\/strong>. Also, we set the custom \u201cNo Posts Found\u201d Not found message<\/strong>.\u00a0<\/p>\n\n\n\n

\"listing<\/a><\/div>\n\n\n\n

Customize the page as needed and hit the \u201cPublish\/Update<\/strong>\u201d button.<\/p>\n\n\n\n

Attach the page to the search results settings<\/h3>\n\n\n\n

To copy the search results page URL, open the page on the front end or use another preferred way.<\/p>\n\n\n\n

\"search<\/a><\/div>\n\n\n\n

Navigate to the WordPress Dashboard > Crocoblock > JetPlugins Settings > JetSearch > Ajax Search Settings <\/em><\/strong>tab.<\/p>\n\n\n\n

In the Ajax Search Widgets Default Query Settings <\/strong>section, set the needed post type as the Source <\/strong>(\u201cPosts\u201d in our case) and adjust other global settings if needed.<\/p>\n\n\n\n

\"ajax<\/a><\/div>\n\n\n\n

Then, scroll down to the Custom Results Page <\/strong>section, enter the copied URL into the Custom Search Results URL <\/strong>field, and change the Search Query Param <\/strong>if you like.<\/p>\n\n\n\n

Afterward, push the \u201cSave Options<\/strong>\u201d button.<\/p>\n\n\n\n

\"custom<\/a><\/div>\n\n\n\n

Set the Ajax Search widget, block, or element<\/h3>\n\n\n\n

Place the Ajax Search <\/strong>widget, block, or element on a page or template. If you did it, proceed to the page or template when it\u2019s located to check its settings.<\/p>\n\n\n\n

For example, we adjusted the Ajax Search <\/strong>widget in the header in the Elementor editor. To learn how to create a custom header, proceed to the How to Create a Custom WordPress Header<\/strong><\/a> <\/strong>tutorial.\u00a0<\/p>\n\n\n\n

Also, you can check the How to Add an Ajax Search to the Website\u2019s Header with the JetSearch<\/strong><\/a> tutorial.<\/p>\n\n\n\n

Unfold the Search Query <\/strong>tab of the Content <\/strong>section and check if the global settings are applied to the widget\/block\/element settings.<\/p>\n\n\n\n

In our case, the Custom Search Results URL <\/strong>and Source <\/strong>were pulled up successfully from the JetSearch <\/em>plugin\u2019s settings.<\/p>\n\n\n

<\/svg><\/div>
Warning<\/div>

If the Ajax Search<\/strong> query settings differ from the Ajax Search Widgets Default Query Settings<\/strong> adjusted in the previous step, additional parameters will be added to the custom URL after searching on the front end. To improve SEO and user experience, ensure that the Search Query<\/strong> tab settings of the widget\/block\/element match the default settings and correct them if needed.<\/p><\/div><\/div>\n\n\n\n

\"ajax<\/a><\/div>\n\n\n\n

Now, you can adjust the Search Form<\/strong><\/a>, Results Area<\/strong><\/a>, and Custom Fields<\/strong><\/a> settings of the widget\/block\/element. Also, you can learn about the Search Suggestions<\/strong><\/a> feature.<\/p>\n\n\n\n

When you are done, save the changes.<\/p>\n\n\n\n

Check the results<\/h3>\n\n\n\n

Go to the front end and enter any request to check the results.\u00a0<\/p>\n\n\n\n

\"ajax<\/a><\/div>\n\n\n\n

Instead of the default WordPress search results page, you will be redirected to the custom page with the Listing Grid<\/strong>. <\/p>\n\n\n\n

In our case, the URL looks like this:<\/p>\n\n\n\n

http:\/\/localhost\/onlybooks\/search-results\/?jet_search=milk&jsearch<\/a><\/p>\n\n\n\n

where \u201cjet_search\u201d is the Search Query Param <\/strong>that can be changed WordPress Dashboard > Crocoblock > JetPlugins Settings > JetSearch > Ajax Search Settings > Custom Results Page <\/em><\/strong>section.<\/p>\n\n\n\n

\"custom<\/a><\/div>\n<\/div><\/div>\n\n\n\n

Displaying WooCommerce Products<\/h2>\n\n\n\n
\n

Create a Search Results page and set a widget with products<\/h3>\n\n\n\n

Go to WordPress Dashboard > Pages > Add New Page<\/em><\/strong> or open the created one. The products can be displayed with the Products Grid<\/strong><\/a> or Products List<\/strong><\/a> widgets from the JetWooBuilder<\/em><\/a> plugin or Listing Grid<\/strong><\/a> from the JetEngine<\/em><\/a> plugin. We decided to use the Products List<\/strong> widget that is available only in Elementor, so we hit the \u201cEdit with Elementor<\/strong>\u201d button.<\/p>\n\n\n\n

We placed the Products List <\/strong>widget with the default \u201cProducts\u201d post type source. Learn its settings from the Products List Widget Overview<\/strong><\/a>. You can also use the Products Grid Widget<\/strong><\/a>.<\/p>\n\n\n\n

For the search results page, you can customize the Not Found Message<\/strong>. For instance, we changed it to \u201cNo Books Found.\u201d<\/p>\n\n\n\n

\"products<\/a><\/div>\n\n\n\n

Customize the page as needed and hit the \u201cPublish\/Update<\/strong>\u201d button.<\/p>\n\n\n\n

Adjust the Ajax Search Settings<\/h3>\n\n\n\n

Copy the page URL (e.g., from the front end).<\/p>\n\n\n\n

Proceed to the WordPress Dashboard > Crocoblock > JetPlugins Settings > JetSearch > Ajax Search Settings <\/em><\/strong>tab.<\/p>\n\n\n\n

In the Ajax Search Widgets Default Query Settings <\/strong>section, set the needed post type as the Source <\/strong>(\u201cProducts\u201d in our case) and adjust other global settings if needed.<\/p>\n\n\n\n

\"\"<\/a><\/div>\n\n\n\n

Then, scroll down to the Custom Results Page <\/strong>section, enter the copied URL into the Custom Search Results URL <\/strong>field, and change the Search Query Param <\/strong>if you like.<\/p>\n\n\n\n

Afterward, push the \u201cSave Options<\/strong>\u201d button.<\/p>\n\n\n\n

\"\"<\/a><\/div>\n\n\n\n

Customize the Ajax Search widget\/block\/element<\/h3>\n\n\n\n

Place the Ajax Search <\/strong>widget, block, or element on a page or template, or proceed to the page where it\u2019s already located. For example, it can be a custom header<\/strong><\/a>.<\/p>\n\n\n\n

Unfold the Search Query <\/strong>tab of the Content <\/strong>section and check if the global settings are applied to the widget\/block\/element settings.<\/p>\n\n\n\n

In our case, the Custom Search Results URL <\/strong>and Source <\/strong>were pulled up successfully from the JetSearch <\/em>plugin\u2019s settings.<\/p>\n\n\n

<\/svg><\/div>
Warning<\/div>

If the Ajax Search<\/strong> query settings differ from the Ajax Search Widgets Default Query Settings<\/strong> configured in the previous step, additional parameters will be appended to the custom URL after a search is performed on the front end. To enhance SEO and user experience, ensure that the Search Query<\/strong> tab settings for the widget\/block\/element match the default settings and make corrections if necessary.<\/p><\/div><\/div>\n\n\n\n

\"ajax<\/a><\/div>\n\n\n\n

Adjust other Ajax Search <\/strong>settings and save the changes.<\/p>\n\n\n\n

Checking the results<\/h3>\n\n\n\n

Eventually, head to the front end and enter any request to check the results. Instead of the default WordPress search results page, you will be redirected to the custom page with the Products List <\/strong>or Products Grid<\/strong>. <\/p>\n\n\n\n

The URL looks like this:<\/p>\n\n\n\n

http:\/\/localhost\/onlybooks\/search-results\/?jet_search=great&jsearch<\/a><\/p>\n\n\n\n

where \u201cjet_search\u201d is the Search Query Param <\/strong>that can be changed WordPress Dashboard > Crocoblock > JetPlugins Settings > JetSearch > Ajax Search Settings > Custom Results Page <\/em><\/strong>section.<\/p>\n\n\n\n

\"custom<\/a><\/div>\n<\/div><\/div>\n\n\n\n

That\u2019s all. Now you know how to create custom URLs for search results pages on your WordPress website using the JetSearch<\/em> plugin.<\/p>\n","protected":false},"excerpt":{"rendered":"

Learn how to create custom URLs for search results pages on your WordPress website using the JetSearch plugin to enhance user experience and improve SEO. <\/p>\n","protected":false},"author":8,"featured_media":0,"template":"","format":"standard","builder-category":[],"article-category":[431],"yoast_head":"\nHow to Make Custom URL for Search Results Page \u2014 JetSearch | Crocoblock<\/title>\n<meta name=\"description\" content=\"Learn how to create custom URLs for search results pages on your WordPress website using the JetSearch plugin to enhance user experience and improve SEO.\" \/>\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\/jetsearch\/how-to-make-custom-url-for-search-results-page\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to Make Custom URL for Search Results Page \u2014 JetSearch | Crocoblock\" \/>\n<meta property=\"og:description\" content=\"Learn how to create custom URLs for search results pages on your WordPress website using the JetSearch plugin to enhance user experience and improve SEO.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/crocoblock.com\/knowledge-base\/jetsearch\/how-to-make-custom-url-for-search-results-page\/\" \/>\n<meta property=\"og:site_name\" content=\"Help Center\" \/>\n<meta property=\"article:modified_time\" content=\"2024-05-27T15:08:47+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/05\/listing-template-for-the-search-result-page.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=\"9 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/jetsearch\/how-to-make-custom-url-for-search-results-page\/\",\"url\":\"https:\/\/crocoblock.com\/knowledge-base\/jetsearch\/how-to-make-custom-url-for-search-results-page\/\",\"name\":\"How to Make Custom URL for Search Results Page \u2014 JetSearch | Crocoblock\",\"isPartOf\":{\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#website\"},\"datePublished\":\"2024-05-27T15:03:09+00:00\",\"dateModified\":\"2024-05-27T15:08:47+00:00\",\"description\":\"Learn how to create custom URLs for search results pages on your WordPress website using the JetSearch plugin to enhance user experience and improve SEO.\",\"breadcrumb\":{\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/jetsearch\/how-to-make-custom-url-for-search-results-page\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/crocoblock.com\/knowledge-base\/jetsearch\/how-to-make-custom-url-for-search-results-page\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/jetsearch\/how-to-make-custom-url-for-search-results-page\/#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\":\"How to Make the Custom URL for the Search Results Page\"}]},{\"@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":"How to Make Custom URL for Search Results Page \u2014 JetSearch | Crocoblock","description":"Learn how to create custom URLs for search results pages on your WordPress website using the JetSearch plugin to enhance user experience and improve SEO.","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\/jetsearch\/how-to-make-custom-url-for-search-results-page\/","og_locale":"en_US","og_type":"article","og_title":"How to Make Custom URL for Search Results Page \u2014 JetSearch | Crocoblock","og_description":"Learn how to create custom URLs for search results pages on your WordPress website using the JetSearch plugin to enhance user experience and improve SEO.","og_url":"https:\/\/crocoblock.com\/knowledge-base\/jetsearch\/how-to-make-custom-url-for-search-results-page\/","og_site_name":"Help Center","article_modified_time":"2024-05-27T15:08:47+00:00","og_image":[{"url":"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2024\/05\/listing-template-for-the-search-result-page.webp"}],"twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"9 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/crocoblock.com\/knowledge-base\/jetsearch\/how-to-make-custom-url-for-search-results-page\/","url":"https:\/\/crocoblock.com\/knowledge-base\/jetsearch\/how-to-make-custom-url-for-search-results-page\/","name":"How to Make Custom URL for Search Results Page \u2014 JetSearch | Crocoblock","isPartOf":{"@id":"https:\/\/crocoblock.com\/knowledge-base\/#website"},"datePublished":"2024-05-27T15:03:09+00:00","dateModified":"2024-05-27T15:08:47+00:00","description":"Learn how to create custom URLs for search results pages on your WordPress website using the JetSearch plugin to enhance user experience and improve SEO.","breadcrumb":{"@id":"https:\/\/crocoblock.com\/knowledge-base\/jetsearch\/how-to-make-custom-url-for-search-results-page\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/crocoblock.com\/knowledge-base\/jetsearch\/how-to-make-custom-url-for-search-results-page\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/crocoblock.com\/knowledge-base\/jetsearch\/how-to-make-custom-url-for-search-results-page\/#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":"How to Make the Custom URL for the Search Results Page"}]},{"@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\/44576"}],"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\/8"}],"wp:attachment":[{"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/media?parent=44576"}],"wp:term":[{"taxonomy":"builder-category","embeddable":true,"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/builder-category?post=44576"},{"taxonomy":"article-category","embeddable":true,"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/article-category?post=44576"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}