Gravatar for yyogesh1990@gmail.com

Question by yyogesh1990@gmail.com, Jan 17, 2019 1:09 PM

Adding tab to show specific type of results

I am using Coveo for Sitecore 4.1 and I have a requirement where I need to show tabs on search result page for All Content and Events ... In Events tab I need to show items for Event template.

I am not using Enterprise edition so don't have access for Rule Set Editor. Is there any way in Coveo For Hive to filter the results on the bases of tab selected?

1 Reply
Gravatar for flguillemette@coveo.com

Answer by François Lachance-Guillemette, Jan 17, 2019 1:43 PM

As you might know, you can follow this documentation here to add Filtering and Ranking Rules Using JavaScript.

It requires you to create a view that contains the `CoveoForSitecoreFilterExpression` and some JavaScript to configure it.

Here is the code that you would include, based on the documentation page example:

@using Coveo.UI.Components
@using Coveo.UI.Components.Extensions
@Html.Partial(Partials.EDIT_TITLE, Html.Coveo().GetViewName())
<div id="JSFilterExpression" class="CoveoForSitecoreFilterExpression"></div>
<script>
    document.addEventListener('DOMContentLoaded', function() {
        var expressionBuilder = new Coveo.ExpressionBuilder();
        // Build an expression using the expressionBuilder.
        const jsFilterExpresion = document.getElementById('JSFilterExpression');
        jsFilterExpresion.dataset.scAdvancedFilter = expressionBuilder.build();
    });
</script>

Now, the trick that is not mentioned in this page is that the CoveoForSitecoreFilterExpression component supports the scopeToTab attribute.

This means you can either set it in the markup:

<div class="CoveoForSitecoreFilterExpression" data-sc-scope-to-tab='MyTabId'></div>

or by using similar JavaScript code:

const jsFilterExpresion = document.getElementById('JSFilterExpression');
jsFilterExpression.dataset.scopeToTab = "MyTabId";

Both will give the same result, it depends on whether you need a static or dynamic value.

You could also directly leverage the expression attribute of the CoveoTab component, but this would require duplicating the CoveoTab rendering for each tab.

Hope this helps!

Ask a question