Ajax Search Pro Documentation
Get Ajax Search Pro!Get SupportKnowledge BaseDevelopment
  • Ajax Search Pro Documentation
  • GDPR and Cookie policy
  • Video Guides
  • Plugin Updates
    • Automatic Updates
      • Activation on Development and Staging environments
      • Managing purchase codes
      • Purchase Code (license key)
    • Manual Updates
    • Safe Update Guide
    • Plugin update issues or errors
    • Disabling update check
  • Installation instructions
    • Uninstallation & Reset
  • Getting started
    • Importing from the Lite version
    • Editor Blocks
    • Search Shortcodes
    • Search Widget
    • Gutenberg and Other Page Editors
    • Replacing the default theme search bar
    • Placing the search shortcode in theme files
    • Search as menu item
    • Custom result box position
    • Custom filters box position
    • Shortcode generator
  • Search Sources
    • Search Engine
    • Post, Page, Product and other Post Type Search
    • Searching Titles, Content, Excerpt
    • Search in custom fields
      • Search By Product SKU
    • Search by categories, tags or other terms
    • Search in Attachments
      • Mime types table
    • Search in File contents (pdf, word, excel etc..)
    • Search in Users
      • User meta fields
    • Limits (number of results)
    • Categories and terms as results
    • Image options
    • Result ordering
    • Peepso Groups & Group activities search
    • Grouping title duplicates
  • Behavior
    • Return/Enter key and Magnifier icon click actions
    • Search logic (primary and secondary)
      • Exact Matches vs Fuzzy Matches
      • Search logics explained
    • Live search triggering events
    • Results page override
    • Results, Archive Page and Shop Live Search and Filter
  • Elementor Integration
    • Elementor Pro Posts Widget Live Filter
    • Elementor Loop Grid Integration
    • Elementor Pro Product Widget Live Filter
    • Custom results page with Elementor Pro
    • Elementor custom search page archive override and live filter
  • Other Integration
    • Jet Engine Listing Grid Integration
  • Multisite Settings
  • Frontend Search Settings & Search Filters
    • Settings layout, position and visibility
    • Generic Selectors
    • Content Type filters
    • Date filters
    • Category and Taxponomy term filters
    • Post type Filters
    • Custom field filters - selectors
    • Search button
    • Reset button
  • Layout Settings
    • Result Layout Types
    • Results information box
    • Results position & snap
    • Content, author, date and description in results
    • More results loader and infinite scroll feature
    • Results behavior
    • Results text keyword highlighter
    • Compact search box layout
    • Auto Populate - Automatic search results on initial page load
  • Autocomplete and Keyword suggestions
    • Autocomplete
    • Results and Keyword suggestions
    • "Try these" - suggested phrases
  • Theme Options - Visual changes to the search bar
    • Theme chooser
    • Preview
    • Search box and input field layout
    • Settings and Magnifier icon
    • Settings dropdown
    • Typography
  • Index Table
    • Generating the index table
    • Enabling index table engine
    • File Content Search Addon
    • Index table FAQ
    • Synonyms
  • Relevance Options
  • Advanced Options and Uses
    • Using the Results shortcode as a custom results page
    • Shortcodes in results content
    • HTML tags in results
    • Primary and Secondary title and description fields
    • Advanced title and Content fields
      • User Search - Advanced Title and Content fields
    • Excluding & Including results
      • Exclude by category or terms
      • Exclude or Include by authors (users)
      • Exclude or Include by date
      • Exclude by Item or ID
      • Include by ID
      • Include by categories or terms (restrict to category)
      • Exclude or Include by custom field values
    • Grouping results
    • Keyword Exception & Exclusions
  • Result priority settings
    • Individual Priorities
    • Priorities by Rules (priority groups)
  • Performance Tuning
    • Fine tuning the search configuration
    • Cache
    • Visual performance
    • Ajax performance tracker
  • Compatibility Settings
    • Javascript Compatibility
  • Google Analytics Integration (GA4)
    • Tracking with Google Site Tag (gtag.js)
    • Tracking with Google Tag Manager
    • Site Search Tracking
  • Troubleshooting
    • Styling issues
    • The response data is missing from the ajax request error message
  • Translating components
    • Translating with WPML
    • Translating with Polylang
  • Pre-Purchase FAQ
  • Plugin API
    • Actions list and usage
    • Filters list and usage
    • asp_query_args filter
    • Theme functions
    • Front-end filters API
    • Javascript API
  • Other Useful Things
    • Additional search keywords for post types
    • Negative keywords
    • Meta box on post editor screen
Powered by GitBook
On this page
  • Simple override of the results
  • Override with Live Loader
  • Elementor archive page
  • Search instance configuration
  1. Elementor Integration

Elementor custom search page archive override and live filter

PreviousCustom results page with Elementor ProNextOther Integration

Last updated 5 years ago

This tutorial shows how to override the default results page elements with Ajax Search Pro, when you have the search .

If you wish to display the search results outside the search results archive page, then please check the documentation.

Simple override of the results

For this, only the needs to be enabled. Also make sure, that either the magnifier or the search button (or both) events .

That's it, the plugin will now redirect to the results page, and override the items with it's own.

Override with Live Loader

If you are planning to add the search bar to the results page (or already have it there), you can use the live loader feature as well.

Elementor archive page

Open up the search results archive with the Elementor editor. In our case it was named "Search".

Click the archives widget, and navigate to the Advanced panel. Under the CSS Classes option enter the following:

asp_es_archive

..then save the page.

Great, it is almost done, only one search configuration remains.

Search instance configuration

Go back to the search plugin back-end, to the search instance options. Under the General Options -> Logic & Behavior panel, scroll down to the Results Page Live Loader section. Turn on the Live Loader option, and to the selector field, enter the following:

.asp_es_archive

Notice the dot (.) before the text, it is required!

That's it! The plugin will now act as a results page live loader as well.

results archive page template enabled with Elementor
Custom results page with Elementor Pro
results page override
redirect to the results page