Visual Best Bets with SharePoint Server using jQuery (not FAST)

Purely for demonstration purposes only I needed to quickly mock-up some visual best bets in SharePoint Server without using FAST. Thanks to the power of jQuery it took just 4 lines of script!


I’m assuming you have jQuery already deployed somewhere accessible to your site collection, if not, download it and upload jquery-X.X.X.min.js somewhere you can reference it, like the master page library for example.

First, create the HTML content you want to use as your new Visual Best Bet, here’s mine:


It’s not my best work but this is only a mock-up….Winking smile

Upload this html content to SharePoint somewhere.

Note: make sure you save and upload it as an ASPX file and not an HTML or HTM file otherwise you wont be able to access it directly due to the default Browser File Handling setting on the web application.

Next, create another HTML file that includes the following script:

<script type=’text/javascript’ src=’/_layouts/inc/jQuery/jquery-1.4.2.min.js’></script>
<script type=’text/javascript’>
    $(document).ready(function () {
        var u = $(‘.srch-BB-URL2’).html();
        $.get(u, function (data) { $(‘.srch-BestBets’).html(data); });

Note: The first line should be updated to point to your copy of the jQuery js file.

Upload this file to SharePoint somewhere.

Create standard Best Bet

Next we’re going to create a standard Best Bet. From our site collection (that hosts our Search Center) select Site Actions –> Site Settings –> Site Collection Administration – > Search Keywords. From the Manage Keywords screen create a new keyword:


Assign a new Best Bet to the keyword:


The URL you enter for the Best Bet should be the URL of  your HTML content you uploaded earlier as an ASPX file. Next, access your Search Center and test the Keyword and Best Bet is working:


Now edit your search results page and below the existing Search Best Bets web part, add a new content editor web part. Finally set the Content Link property of the content editor web part to be the URL of the script file you uploaded earlier and set the web part chrome type to ‘None’.

Save the page and execute your search again.

Now when the page loads, the jQuery script finds the URL from the standard Best Bet we defined, loads the HTML content from the URL via asynchronous Ajax and finally replaces the contents of the out of the box Best Bets web part with our HTML:


Please note, this is only a mock-up and not production quality code but it does illustrate the power of jQuery and Ajax quite nicely