LESSON 2: Adding visible content to your Web Slice
This tutorial explains how to add Web Slice content that appears in the preview window on the Favorites bar.
Web Slices that contain only a title can be useful in some contexts; however, it is generally better to give the user more information. To add content to your Web Slice, you must add the following:
- class="entry-content" - This class marks the content that appears in the preview window. At least one container within the hslice should have this class.
You can place your regular HTML content under the element marked as entry-content; however, script and ActiveX controls will not run in the Web Slice preview. Internet Explorer "sanitizes" this content in the RSS platform for safety purposes.
- In webslice.html, locate the table element within the schedule Web Slice.
- Add the entry-content class to the table element.
<div id="schedule" class="hslice"> <h2 class="entry-title">My Conference Agenda</h2> <table class="entry-content" border="1" cellspacing="1" cellpadding="2">
Give each of the Web Slices some content.
A few things to remember:
- You do not need to re-subscribe to the Web Slice when you make changes; just save the Web page and refresh the Web Slice from the option menu.
- Styles are imported from the page head and the inline styles declared within the entry-content of the Web Slice itself.
- The location of the entry-content element will affect what content appears in the preview window.
- Just like entry-title, you can specify more than one entry-content element to create your preview.
- Mark a tag within the hslice container with the class "entry-content" to define preview content for your Web Slice
Check your work
- When you click on each Web Slice in the Favorites bar, is there content in the preview window?
- When you update the content within the entry-content class and then refresh your Web Slice, does the Web Slice update with the new content?
At this point, you should have a Web site with three Web Slices, each of which has content when you click to open the preview window. If you are having trouble, take a peek at the example implementation in Source Listing #2.
Go forward to LESSON 3: Setting an expiration time
Go back to LESSON 1: Adding Web Slices to a Web page