AJAX Search Basics - How to create Google-like results?

251 Posts

cms Reply #1, 17 years, 4 months ago

Hi There,

We’ve setup a non-ajax search form which is working fine but we found the wiki article a bit hard to follow so have a few questions:

Results
Currently the results show the page title as a link and what looks to be the long title and the description? Is there a way to display a title and content from the page - maybe content surrounding the search term?

Styling The Results
In the wiki article there were a couple of template parameters:

&tplResults &tplResult

Are there any examples of these templates to use as a starting point?

Input form inside a header chunk:
When we had the search input form hard coded to the template, everything was fine. But when we separated the header (including the form) into a chunk, the search results appear under the input form in the header (like the Ajax version) as well as on the results page. Not sure what is going on.

Other:
What is the best way to remove the text "Please enter a search term to begin your search"? Because we couldn’t find an option for this we opted to set the display of:

#ajaxSearch_form

to none - but is this the best way?

251 Posts

cms Reply #2, 17 years, 4 months ago

OK, have spent another couple of hours going through the wiki but am very confused - sorry if this is easy. There seem to be a lot of parameters shown on the wiki but very little info on putting it all together - beyond some basic calls.

In the results, is it possible to have a page title, the content where the search term was found (with the search term highlighted) and a page URL link at the end?

I’m guessing the following would be required to make this happen?
- The search call
- Template chunks?
- Place holders?

I’ve started with this call (non-ajax version)

[!AjaxSearch? &ajaxSearch=`0` &AS_landing=`29` &AS_showResults=`0` &tplResult=`SearchResults`!]

With this SearchResults template:

<h3>[+as.resultLink+]</h3>
<p><a</p>
<p>[+as.resultLink+]</p>

And this template to format the results:

<h3><a href="[+as.pagetitle+]">[+as.pagetitle+]</a></h3>
<p>[+as.contentShow+]</p>
<p class"resultlink">[+as.resultLink+]</p>

This has no effect on the results - hopefully I’m missing something simple!

Any help would be much appreciated.

Cheers

☆ A M B ☆
24,524 Posts

sottwell Reply #3, 17 years, 4 months ago

What is your snippet call on page 29? That’s the one that needs to specify which chunk to use to format the output.

Studying MODX in the desert - http://sottwell.com
Tips and Tricks from the MODX Forums and Slack Channels - http://modxcookbook.com
Join the Slack Community - http://modx.org

251 Posts

cms Reply #4, 17 years, 4 months ago

I think you have to add the template call to the results page Search call - is this correct?

So now the call on the results page is:

[!AjaxSearch? &ajaxSearch=`0` &AS_showForm=`1` &tplResult=`SearchResults`!]

And the SearchResults template is currently:

<h3><a href="[+as.pagetitle+]">[+as.pagetitle+]</a></h3>
<p>[+as.extract+]</p>
<p class"resultlink"><a href="">View page</a></p>

How do you generate a link for the "view page" link at the end of the template and how do you show the content with the search term highlighted?

Also, on the results page you can’t type a new search term into the search box in the page - only the one in the header?

Any help would be bloody awesome - going live in about 12hrs.

Cheers

251 Posts

cms Reply #5, 17 years, 4 months ago

Sorry - didn’t see your reply before I posted...

251 Posts

cms Reply #6, 17 years, 4 months ago

Have ditched the template call and gone for:

[!AjaxSearch? &ajaxSearch=`0` &AS_showForm=`1` &extract=`5:content,description,introtext,tv_value`!]

This is looking a lot closer

251 Posts

cms Reply #7, 17 years, 4 months ago

Actually not sure with that last one.

This is the results page call (no template):

[!AjaxSearch? &ajaxSearch=`0` &AS_showForm=`0`!]

And have made the following CSS declaration - the result description seemed to just repeat the page title but without a link which looked weird.

.ajaxSearch_resultDescription { display:none; }

Here is the development site: http://www.finefoodnz.co.nz
If you type "visit" into the search box in the header you’ll be taken to the results page (haven’t finished styling the results yet).

How can you get AjaxSearch to display more text in the results like Google? It just looks a bit bare and some pages (like the home page) have no text at all, just titles.

Any suggestions?

Cheers

970 Posts

tkfm Reply #8, 17 years, 4 months ago

You have to add &tplResult parameter to the Ditto call on your landing page ( not the one to create search form. ).

251 Posts

cms Reply #9, 17 years, 4 months ago

Thanks for that, have actually ditched the template as I couldn’t find a placeholder that would display the search term highlighted in context - do you know if there is one?

970 Posts

tkfm Reply #10, 17 years, 4 months ago

Quote from: cms at May 12, 2009, 03:49 AM

Thanks for that, have actually ditched the template as I couldn’t find a placeholder that would display the search term highlighted in context - do you know if there is one?

I’m not so familiar with the details of AjaxSearch snippet, I don’t think there’s any placeholders for highlighted words.
But SearchHighlight plugin would do that.