WEbmatrix–helpers–Bing

WebMatrix Beta 2 was released on Oct 06 2010. Many changes to how WebMatrix used to work in some areas from Beta 1 to Beta 2.

Some changes went into to WebMatrix Helpers also. There are  4 new helpers that have been added to Helper family. They are :

- Antiforgery

- Bing

- Json

- Themes

In this post i am going to talk about “Bing” Helper. Because i was interested to known what this helper can do.

Bing as we all know is “Bing Is Not Google”. This is a search engine from Microsoft. Although it is getting itself positioned as not just an search engine but a decision making tool. So WbeMatrix Bing helper is to allow you to embed the Bing search box within your website.

Let me dive into the API. Bing helper can be found in the following assembly:

Microsoft.Web.Helpers, Version=1.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35

Lets see the Bing helper methods available.

1. SearchBox

This method helps us to embed a simple search box on to the web page. The syntax is as follows:

IHtmlString SearchBox([Optional, DefaultParameterValue(null)] string siteUrl, 
[Optional, DefaultParameterValue(0x142)] int boxWidth);

It takes in the following parameters:

- siteUrl – optional parameter. If provided will search the query only in that site.
                Default value is null

- boxWidth – optional parameter. Specifies the width of the search box on the 
                     page. It also has a default value so even if we don’t specify, the 
                     width comes with pre defined value of 322.

Following is the code in a razor webpage to get the Bing search box:

   1:  <div>

   2:     <p>Simple Search Box</p>

   3:     @Bing.SearchBox("http://weblogs.asp.net/kashyapa") 

   4:  </div>

As you can see i have passed the site url as “http://weblogs.asp.net/kashyapa”. So that means if i search for anything, it will search in that site only. I have not specified any width so its going to take the default value of 322.

Here is the out out of the above code:

The search box is neatly laid out even with the Bing search glass icon and look at the radio buttons below the search box. They even provide the option to search within the site specified or the whole web. Cool i say. So when i give a search query and hit the search, following is the search results displayed:

You can see that the searches are all done within the site specified while creating the search box.

2. AdvancedSearchBox

This method helps us to embed a advanced search box on to the web page. The syntax is as follows:

   1:  IHtmlString AdvancedSearchBox(

   2:  [Optional, DefaultParameterValue(null)] string siteUrl, 

   3:  [Optional, DefaultParameterValue(null)] string siteName, 

   4:  [Optional, DefaultParameterValue(0x142)] int boxWidth, 

   5:  [Optional, DefaultParameterValue(600)] int resultWidth, 

   6:  [Optional, DefaultParameterValue(400)] int resultHeight, 

   7:  [Optional, DefaultParameterValue("Blue")] string themeColor, 

   8:  [Optional, DefaultParameterValue("en-US")] string locale

   9:  )

So the advanced features of this method is that, i can specify more things than the SearchBox method. As you can see we have the following parameter options:

- siteUrl – optional, if provided the search will be done on this site

- siteName – optional, if provided will be used as caption for the search

- boxWidth – optional, if provided will be used to size the search box. default 
                      value is 322

- resultWidth – optional, if provided will be used to set the size of the result

- resultHeight – optional, if provided will be used to set the height of the result

-themeColor – optional, if provided will be used as a theme color for bing

-locale – optional, if provided the search will be localised to this locale

Here is the syntax for the same:

   1:  <div>

   2:              <p>Advanced Search Box</p>

   3:              @Bing.AdvancedSearchBox(
                    siteUrl:"http://weblogs.asp.net/kashyapa",

   4:               siteName:"Kashyapas .NET Rumbles",

   5:               boxWidth:400,resultWidth:400,resultHeight:400)

   6:  </div>

This method allows you to control the appearance of the search results too. With SearchBox the search results will be opened in a new window,

This is a very good helper if you plan to provide a search capability built into your site. If you are on WebMatrix and Razor band wagon. Give it a try.

Till next time, Happy Coding and Code with Passion