Implementing Features

Within the SERP, there are a set of features that, when implemented, increase the likelyhood of ad partner approvals, user retention, and increased monetization.

For result-level features, see also: Seller Ratings and Sponsored Sitelinks.

Category Bar

The Category Bar is normally displayed at the bottom of the header on the SERP page. This bar allows the user to select the ‘type’ of results they would like to search form. Normally the categories are Web, Images, Video and News.

When a user clicks on a category, such as Video, the ‘category’ parameter in the Query URL should be set to that category (i.e. ‘category=images’) so that when the user clicks Search, the return set contains items of the proper type. It is worth noting that the Web category can retrun various types of return values, whereas video, images and news typically strive to return items of only that type.

The categories and placement of the category bar is up to the site, however it is strongly suggested that it be placed at the bottom of the header section as shown above.

Related Searches

Related searches provide users with suggested search queries based on their current query, and is best used for sites with predominantly english language queries.

Implementation

This feature is typically enabled by default. The site can choose to display these results or not, although it is strongly recommended that these links be displayed. Currently the related searches feature returns a list of text strings (in the title element). To use this feature the site would URL encode each title and then insert them into the ‘query’ parameter value of query URLs and list these under the ‘Are you looking for?’ section of the Main Page or one of the side rails.

The query URLs for the related searches would be duplicates of the original URL that generated this SERP, with the title value placed in ‘query’ parameter value (i.e. query = <URI encoded title value>).

<group category="related" group-by="relevance" type="special">
  <details />
  <group group-by="relevance">
  <details>
    <results-count>8</results-count>
    <results-start>1</results-start>
    <results-end>8</results-end>
  </details>
  <result>
    <title>Aluma Wallet</title>
  </result>
  <result>
    <title>Men S Wallets</title>
  </result>
  <result>
    <title>Domestic Implements</title>
  </result>
  <result>
    <title>Google Wallet</title>
  </result>
  <result>
    <title>Money</title>
  </result>
  <result>
    <title>Musical Groups From Minnesota</title>
  </result>
  <result>
    <title>American Experimental Musical Groups</title>
  </result>
  <result>
    <title>Bulletproof Wallets</title>
  </result>
</group>

Pagination

The Pagination bar is used to allow the user to quickly and easily move from one page of results to the next. This tool is a client side tool meaning the look, feel and functionality is determined and maintained by the partner.

Compatibility

Pagination is controlled and implemented on the client side and can be done in any language or script that will allow for queries to be passed to the API and is able to retrieve results.

Implementation

Each ‘page’ is in essence its own query, basically a duplicate of the original with the ‘qi‘ parameter incremented to specify the absolute value of the first returned item to display. When a user clicks a number on the pagination bar, the ‘qi‘ parameters value is set to the appropriate value and the query is resubmitted. For example, if a site is displaying 10 results per page, for the second page the ‘qi‘ value would be set to 11 to receive results 11 through 20 and so on.

Note: Pagination should be based on the non-paid results on the page, ignoring the extra-cat results.

The number of pages can be based on the ‘results-count‘ value, divided by the number of results displayed per page. For best results, only pass the ‘qi‘ values in increments equal to the number of results to display.

For paid only implementations, the search result count number will always be 0.

Note: InfoSpace cannot guarantee that the ‘results-count‘ value will remain the same from page to page.

Spell Suggest

Spelling suggestions are a Google-only feature available for WEB category searches. To enable spell suggest the option must be set in the site configuration, which it is by default. To use this feature add the ‘spellsuggest=on‘ parameter value pair to the query. If there is an unknown word in the query the spelling suggestion will be returned in the XML result data. Following is an example of how the information is returned:

<details>
  <input-query>Harry Pottter</input-query>
  <anti-phrase>Harry Pottter</anti-phrase>
  <adult>false</adult>
  <navigational>false</navigational>
  <marketingnavigational>false</marketingnavigational>
  <spelling-suggestion>Harry Potter</spelling-suggestion>
</details>

Utilizing this data is similar to Related Searches, in that the site would simply add the value of spelling-suggestion into the query parameter of the same search that produced the current SERP page. Normally these results are displayed at the top of the SERP main results column.

Predictive Text

Predictive Text provides real time suggestions to users for search terms, based on the first letters they type into the search field.

Predictive Text is a separate paid service. Please contact your Business Development Manager or Partnership Manager for details.

Implementation

Add the script tags (below) to the bottom of the page, just above the closing body tag </BODY>.
Add ID attributes in the ‘var_ispace_txtElements=‘ section of the script, for any text boxes that are to utilize predictive text.
Use style sheet elements to customize the suggestion panel.
CSS style sheet elements can be used to customize the Predictive Text menu

Sample Script Tag

<script language="javascript"type="text/javascript">
 var ispace_txtElements = ['firstTextId', 'secondTextId', 'thirdTextId'];
 var ispace_brand = '<cobrand>';
</script>
<script src="http://imagecdn.infospace.com/search/lib/ptwidget-1.0.js"></script>

Sample CSS

<style>
 .suggest_link {
   background-color: #ffffff;
   padding: 2px 6px 2px 6px;
   height:14px;
   line-height: 14px;
   overflow:hidden;
 }
 .suggest_link_over {
   background-color: #d3d3d3;
   padding: 2px 6px 2px 6px;
   height:14px;line-height: 14px;
   overflow:hidden;
   cursor:pointer;
   color: #000000;
 }
 .suggestPanel {
   position: absolute; 
   display:none;
   background-color: #ffffff;
   text-align: left;
   border: 1px solid #000000;
   font-family: Arial, Verdana, Helvetica;font-size: 12px;
   z-index: 10;
 }
</style>

Impression Url

If you are using a content provider that requires an impression url, you will need to create the impression pixel on your site. Below is some sample code to do this.The result specific to the content provider will include the impression-url field.

Code samples for impression url:

C#

@if (!string.IsNullOrWhiteSpace(@Model.ImpressionUrl))
{
     <img class="impressionImg" src="@Model.ImpressionUrl" border="0" width="1" height="1" />
}

Javascript

if (result.impressionUrl) {
    var img = document.createElement('img');
    img.src = result.impressionUrl;
}

 

Next: Troubleshooting
Back to: Formatting Individual Results