Coveo Load More button implementation

Hi Folks,

Today I will try to cover how can we build load more button  functionality in Coveo for Sitecore.

As Coveo provide OOTB auto load result on scroll functionality but in some scenario we need ‘load more’ button.

For that we need to call below function:

Coveo.$('.CoveoResultList').coveo('displayMoreResults', size);

So Assume we have load-more button so on click of that button we have to call below function:

Coveo.$('.loadmore').click(function(e, args) {

               Coveo.$('.CoveoResultList').coveo('displayMoreResults', size);

           });

Above function call displayMoreResult method of Coveo with size parameter here size the number of result which you want to display when someone click on ‘load more’ button.

Here above I am using ‘Coveo.$’ as that is recommended to be execute flawless our Coveo javascript code without any conflicts due to jquery library while we are calling or write any Coveo related javascript.

That above code work perfectly for load more functionality.

But we have to look into the result if there is no more sufficient result then we have to hide ‘load more’ button else we need to show the ‘load more’ button.

For that we check the result number that we can check by below variable:

args.results.totalCount :It gives the total count of result.

args.query.firstResult : The 0-based index position of the first result to return.

args.query.numberOfResults: The number of results to retrieve starting from firstResult.

If resultPerPage variable hold greater value from args.results.totalCount then no need to show button.

In another case you can do use similar below code for this situation before process the result by 'preprocessResults' method:

Coveo.$('#IdOfCoveoSearchInterface').on('preprocessResults', function(e, args){

               if (args.results.totalCount > (args.query.firstResult + args.query.numberOfResults)) {

                   Coveo.$(".loadmore").show();

               } else {

                   Coveo.$(".loadmore").hide();

               }

           });

I hope you enjoy this Sitecore blog. Stay tuned for more Sitecore related articles.

Till that happy Sitecoring :)


Please leave your comments or share this article if it’s useful for you.

Computed fields in Coveo for Sitecore

Hi All,

Here below some references and sample code for understanding the computed fields in Coveo for Sitecore.

For get the computed field image

Location

https://developers.coveo.com/display/public/SitecoreV4/Adding+Images+to+Your+Search+Page

https://answers.coveo.com/questions/6870/customizing-results-template-mvc.html

https://developers.coveo.com/display/public/SitecoreV4/Adding+Images+to+Your+Search+Page

Syntax for mvc:

//For get the image computed index value

{{ if (raw.@(Model.ToCoveoFieldName("imageurl", false))) { }}
                                                    {{=image(raw.@(Model.ToCoveoFieldName("imageurl", false)), {alt : "Anything",style:"width: 100px;"})   }}
                                               {{ } }}

//For get the field value

{{=raw.@(Model.ToCoveoFieldName("Sitecore Field", false))}

I hope you enjoy this Sitecore blog. Stay tuned for more Sitecore related articles.

Till that happy Sitecoring :)

Please leave your comments or share this article if it’s useful for you.

Coveo Setup for remote CES

Hi All,

In my previous post I just show you how setup coveo for Sitecore.
In this post I just explain more configuration during setup coveo search.
Here below are the steps:

Step 1: Install Coveo Enterprise Search 7.0 x64 (8850) for Sitecore for Sitecore.

1.       Run ‘Coveo Enterprise Search 7.0 x64 (8850) for Sitecore’.

2.       System will check for pre requisites of installation that is the default behavior and after installing them it may ask for restarting the machine.

3.       Click next and accept terms.

4.       Choose Typical installation.

5.       Click ‘Configure’ for “Account used to access the files to index” and provide username and password of account (must be administrator privileges) under which the service supposed to run.

6.       Click ‘Configure’ for “Admin Service Security”. It is optional but it is recommended to make Admin Service secured. On the next screen click configure on second option.

7.       Click ‘Configure’ for “Configure credentials for the Admin Service”. Provide fully qualified username and password for windows login. Example: edynamic\abc and password.

8.       Click ‘Configure’ for “Configure a certificate for the admin service”. The CES Server name will be the default server name and to avoid any confusion keep the password as per the previous step (Windows password). Click on ‘Browse’ and on the pop up screen click ‘Ok’ as there is no need to keep the certificate path different than the installation folder. After that click ‘OK’. Whatever the CES server name we choose make a note of it as we need it later.

9.       If we want we can configure the username and password for RabbitMQ as well. By default the username and password will be ‘guest’.

10.   After clicking ‘Next’ click ‘Install’.

11.   When the installation is finished go to services console and check if the services related to coveo and Rabbit MQ are running.

12.   Allow Firewall Access if prompted

Note:

1. It also ask for install Coveo diagnostic tool. Install that and open below URL:

      http://localhost:8081/Configuration/InitialSetup/InitialSetup.aspx

Here 8081 is default port you also can change that.

2. Please also create a folder C:\CES7 , this is default folder you also can change that but keep in mind if you change here then you also select that folder in during sitecore coveo package installation.

Step 2: Install Coveo Search API

Note: Select the check box “This installation is part of a Sitecore installation” and after click next select “Generate Random Token” and copy the generated value as we will be using it later. Click ‘Next’ and then ‘Install’.

If you found any difficulties in above step then please have a look on below URL:

https://onlinehelp.coveo.com/en/ces/7.0/administrator/installing_the_coveo_search_api.htm          

Step 3: Make sure Coveo services are running

• View Local Services by search “View Local Services”
• Start all Coveo services

Step 4: Restart IIS

• This may not be necessary. But it makes sure the localhost:8080 and localhost/AdminService are working correctly.

Step 5: Verify Admin Service

• Go to http://localhost/adminservice
• You should get a notice about a creating a service

Step 6: Verify RabbitMQ

• Go to http://localhost:15672 and login
• The default username:password is guest:guest

Step 7: Verify Coveo Search API

• Go to http://localhost:8080
• You should get a message the search page is not configured yet

Step 8: Verify Coveo Admin Tool

• Go to http://localhost:8081
• You should see the coveo admin tool

Step 9: Install Coveo for Sitecore (sitecore package)

1.       Go to installation wizard and run the provided sitecore package.

2.       Click ‘Continue’.

3.       Click ‘Sign-Up or log in to coveo cloud’. This option will open new browser tab on which we can see the multiple authentication methods which will allow the user of our organization to access to coveo.

4.       Enter the organization name and select “On Premise Free edition”. Click Next. Or select “On Premise Free edition” from dropdown.

5.       Select where do you want to install the instance. We chose it to be on the remote server, after this step the package will create a CES7 folder in the C drive.

6.       Place the secret key that we have copied in the second installation and click next.

7.       If we have configured different username and password for RabbitMQ configure it or again click next.

8.       Create configuration as per the below screen.

9.    Enter sitecore User name and password.

10.   Select the type of indexing will be used.

11.   Click Next twice and close. It will cause sitecore restart.

12.   Remove .exapmle extension from Coveo config files.

We are also able to reconfigure all the things by going to coveo section in control panel of Sitecore. It look like below:

Step 10: Check Coveo Diagnostics

• Open Sitecore Control Panel -> Coveo Diagnostic Page
• All components should have a green light and message “up and running”

Note: please follow below URL for ‘Setting Up Coveo for Sitecore in a Remote Server Configuration - On-Premises’

https://developers.coveo.com/display/public/SitecoreV4/Setting+Up+Coveo+for+Sitecore+in+a+Remote+Server+Configuration+-+On-Premises