Search: allow customization of results in the overlay

[gibrown]

Ideally we would let admin's customize the search results completely. Ideally with a Gutenberg template of some sort. Some features we have heard about:

• always show an excerpt rather than the matching from the post content
• show images
• move the images around
• display dates
• comment counts

[tmmbecker]

2986672-zen

[gibrown]

@rickalee moving from the PR: https://github.com/Automattic/jetpack/pull/16179#issuecomment-649861111

theme developers to register their own JSX templates for Results?

This would be an interesting option to add support for. I have a few initial thoughts.

I guess this would require being able to register a JSX result component that is maybe a subclass of an abstract component? I am not enough of a JS expert to fully understand the ins and outs here, but @jsnmoon and @bluefuton probably have some opinions. It definitely will also mean that we need better documentation and fewer changes to our APIs.

We have also discussed using some sort of templating system that lets end users customize results. Maybe a custom post type where the Gutenberg template then lets the user define different formats based on what is available for each post. One significant complication to all of this is that there end up being a lot of different corner cases: highlighted terms matching or not, comments matching, no excerpt to display, whether tags exist, etc. We end up having to handle a lot of cases which is probably better handled in code (and presumably what VIP-level sites would prefer anyways): https://github.com/Automattic/jetpack/blob/master/modules/search/instant-search/components/search-result-minimal.jsx#L88

and include meta (price) and terms in result

For pricing information in particular, currently because of the way Woo (assuming you mean Woo) builds the final display price we don't have it in a good form for displaying yet. We do have a lot of post meta in the index, but we need to do more work making sure it is consistent and available for displaying. Planning to work on that over the next few months though.

[rickalee]

@gibrown Thank you for the quick feedback and action. This would be for a VIP Go site and may eventually rollout to other 5 sites on network. We have designed for a 4-column grid of cards e.g. https://rickal.ee/7KumA76y We have price and savings amount stored as custom post meta unrelated to WooCommerce. We will have also a custom taxonomy which we would want to label search result cards with as well. This seems beyond the limit of current result formats. Happy to work with Automattic/VIP team to find an approach.

[gibrown]

@rickalee sorry for the delay, we've talked about this a bit and we don't think we can yet support generic templates. The issue is mostly that everything feels new enough that we are uncertain how it is going to evolve. After we have implemented a few more types of results or are more certain that we won't be changing the API we hope to feel more comfortable with it.

One idea that may work for your use case though is that we started implementing a grid layout in late-2019 that is specifically meant for WooCommerce. We had to put it on pause, but you can roughly see where it is going https://jetpack.com/?result_format=product&s=related%20psts

Currently we are wrapping up two projects that I think will be completed in July and then I am hoping we will get back to working on this layout and better WooCommerce support (which requires post meta support).

I'm wondering if this layout could work for you. Or if there are minor adjustments we could make so that it would work for you? Maybe you would only need to add some css to customize it a bit? Maybe you can put the price info into a generic post meta key (price ?) and we can put that into the WC price field we are planning? The only way I can imagine supporting a custom taxonomy would be to define one specific to JP Search that we display when it exists.

What is your timeframe looking like?

[rickalee]

@gibrown We were aiming for launch of this feature in late September. We could get 90% there with some custom CSS and some hooks for generic output of a label (taxonomy term) and price (post meta).

We may end up using current filtered search if Instant Search templating isn't as feasible. Client is also now considering going all in on AMP so that likely rules out this implementation.

[gibrown]

@rickalee ok I'll keep this in mind over the next few weeks. I created https://github.com/Automattic/jetpack/issues/16367 to track where we are at on that grid layout.

Client is also now considering going all in on AMP so that likely rules out this implementation.

This is pretty interesting. I've had some early discussions with another agency about adding AMP support, but I don't know a ton about the feasibility. I tried to capture some thoughts here: https://github.com/Automattic/jetpack/issues/16366 This almost certainly isn't on our short term roadmap, but maybe it is something that an agency could just build and get to work?

[akmyta]

It would be great to also include the author/byline for each post shown in the search results.

[github-actions[bot]]

Support References

This comment is automatically generated. Please do not edit it.

• [ ] 2986672-zen
• [ ] 5963630-zen

[danmaze]

Ability to show excerpts requested in 5963630-zen

[geektzu]

Hi team, I am working for the Woo Customer Success team. We have an Enterprise customer who hopes to hide the prices from the Jetpack search results behind the login wall. I wonder if this open PR can help. If so, I would appreciate any ETA for this to be implemented.