How to Use IE Web Slices in Your Web Pages

IE 8 has a cool new feature that some websites can and should use, it is called a web slice. In essence this is a small section of your page that you update either manually or dynamically with a script shows content that a reader can subscribe to. With this snippet subscribers can see any new entries you add in their browser when you add them.

Here is an example on one of my own pages: On the right of the content you will see a gray box that says MWS New Templates. If you mouse over this box and have IE 8, a green icon will show to the top left of the content. Additionally take a quick look in the browser bar and you will see a new green web slice icon has also been illuminated. If you mouse over the slice box in the content you can choose to subscribe to this snippet. IE will place a link to this snippet over the tabs section.

Once you have subscribed, anytime I change this section, add a new link, a new photo, etc. your browser link will show the new updated content. You can view the content on demand. If you even want to remove this code snippet. Just right click the item above the tabs and select delete.

I have to say I spent a few hours learning how to set up  and style the snippet to make it look good. Here is a great tutorial on how to make the code that I used at CODE Magazine. The code is pretty straight forward. What took time was to figure out how to style the snippet that showed in IE. I found the first div tag controls the font color, size, and back ground. If you do not style this first div tag IE will pick up your own website body tag background and coloring which in some cases can be a problem. Testing and tweaking to style it properly may take a bit of time using trial and error, but once you get it, you will be able to quickly add the same syntax to other pages or web slices.

How would a website use web slices? Well the possibilities are endless. Some sites may choose to show current coupon codes, showcase  new features, highlight new products, introduce specials or other timely information. You don’t need to programmatically insert information. I am not a programmer and once your shell is styled and set up to your liking you can embed this on any page and just change the content using regular HTML.

So take a look at my web slice page, subscribe, and see what you think.