How to add Internet Explorer Web Slices to your site

by Shijaz Abdulla on 20.12.2010 at 04:08

Web Slice is a web feed technology available in Internet Explorer 8 and Internet Explorer 9. IE allows users to preview the subscribed Web Slices in a fly-out preview window.

You basically add a web slice to your Favorites bar, and you are notified when there is an update to your web slice and you are able to view the content directly on the toolbar without having to leave the page you are on.

Web slices are a fantastic way to increase the return rate of the visitors to your web site. Due to its simplicity, it can also potentially reach out to a larger number of eyeballs than a conventional RSS feed.

Here are some examples of web slices:

image image

I’m no developer pro, but I’ve added a web slice of my own on this blog. This web slice basically shows the last 5 posts from my RSS feed. It’s pretty simple. Here’s how it’s done:

1. Write your web slice file

On my self-hosted wordpress blog, I created a file named webslice.php, which contains the following text:

<html><head>
<title>MicrosoftNOW</title>
</head><body>
<div class="hslice" id="1">
<h2 class="entry-title">MicrosoftNOW</h2>
<div class="entry-content"><ol>
<img src="
http://www.microsoftnow.com/MSNOW-white.png" height=50% width=50%>
<font face="tahoma" size=2>
<br><b>Latest posts on MicrosoftNOW</b>
<?php
  require_once(‘wp-load.php’);
  $results = $wpdb->get_results("SELECT post_title, guid FROM $wpdb->posts where post_status = ‘publish’ ORDER BY ID DESC LIMIT 5");
  foreach($results as $row) {
   echo "<li><a href=’".$row->guid . "’>"
     . $row->post_title ."</a></li> n";
  }
?></font>
</ol></div></div>
</body></html>

This is the content that is displayed when someone opens my web slice. The important bits are in red and need to be present for the web slice to work. Notice the id=”1” in the hslice <div> tag.

Save this file on a location in your web server.

2. Place a button on your website to add a web slice automatically to the favorites bar.

For this, you will use the AddToFavoritesBar method. Here’s how the code will look like to add the button below:

<button onclick="window.external.AddToFavoritesBar(‘http://www.microsoftnow.com/webslice.php#1‘, ‘MicrosoftNOW.com’, ‘slice‘);"> Add to Internet Explorer </button> 

Note the text in red. The #1 is the ID that you set in your web slice code. The word ‘slice’ is an optional parameter that you need to pass to the AddToFavoritesBar method so that the browser understands that this is a web slice, and not just an ordinary favorite URL.

I’ve added the button on the sidebar of my blog. Make sure you add my web slice to get updates from my blog delivered on your browser! Smile

Further reading: IE8 Web Slices on MSDN

Don’t have Internet Explorer 8 or 9? Get it now!