HTML - Web Slices Internet Explorer


Met de komst van versie 8 van browser Internet Explorer van Microsoft is er een nieuwe functionaliteit beschikbaar gekomen genaamd Web Slices. Hiermee is het mogelijk als gebruiker om van een website die deze mogelijkheid bevat een onderdeel in de gaten te houden, bijvoorbeeld het nieuws. Web Slices zijn alleen beschikbaar in Internet Explorer.

Een Web Slice op een pagina wordt automatisch gezien door Internet Explorer en zodra de gebruiker op de Web Slice gaat staan verschijnt er een icoon waarmee de bezoeker de Web Slice kan toevoegen aan de favorietenbalk. Een afbeelding daarvan hieronder.

Web Slices voor Internet Explorer 8

De totale basis code van een Web Slice bestaat uit een aantal standaard onderdelen waarbij het met name gaat om de classnamen en de verschillende id's. De omringende div heeft een eigen classnaam genaamd hslice waarmee Internet Explorer de Web Slice kan herkennen alszijnde Web Slice. Het standaardformaat van een Web Slice is 320px x 240px, het is dan ook aan te raden om je Web Slice op basis van deze afmetingen te maken.

<div class="hslice" id="SliceID">
<div class="entry-title">Slice Title</span>
<a rel="entry-content" href="LivePreviewPage.htm" style="display:none;"></a>
<a rel="bookmark" href="LivePreviewPage.htm" style="display:none;"></a>
<div class="entry-content">This content will appear on the page from where the user add’s the slice, but not in the preview window</div>
<span class="ttl" style="display:none;">15</span>
</div>


Met de bovenstaande code maak je een Web Slice beschikbaar midden in een pagina, hiervan zorgt de eerste regel ervoor dat de Web Slice ook als zodanig wordt herkend door de browser. Hierin moet als classnaam dus altijd "hslice" worden genoemd en moet de Web Slice ook worden voorzien van een ID, deze ID kan echter naar eigen wens ingevuld worden met een naam. Als een van beide mist dan werkt de Web Slice niet.

De tweede regel met "entry-title" zorgt voor de titel die de gebruiker terugziet in de favorietenbalk op de knop. Hierin moet eveneens de classnaam "entry-title" aanwezig zijn om het te laten werken. De bookmark vermelding kan een willekeurige link bevatten die wordt getoond op het moment dat een gebruiker op de navigatielink klikt in de Web Slice.

In de code zie je een ttl vermelding (class="ttl") staan. Hierin wordt de updatefrequentie van de Web Slice aangegeven in het aantal minuten, het minimum is hier 15 minuten. Als laatste de derde div met de content. Deze moet eveneens worden voorzien van een classnaam, in dit geval "entry-content" om de inhoud van de Web Slice weer te geven.

<div class="entry-content" style="background-color:#FF0000;"></div>


Zoals gezegd wordt een Web Slice automatisch gespot op een pagina. Het is daarnaast ook mogelijk om een link toe te voegen op de pagina of op een andere pagina waar geen Web Slice staat. Met deze link kan een bezoeker dan de Web Slice ook automatisch toevoegen. De code om deze link te plaatsen op een pagina zie je hieronder staan.

<a href="javascript:window.external.addToFavoritesBar('http://www.adres.nl/Web Slice/','Titel Web Slice', 'slice');">Voeg de Web Slice toe aan de favorietenbalk</a>


Web Slices voor Internet Explorer 8

Er zijn daarnaast nog meer mogelijkheden beschikbaar omtrent Web Slices zoals de combinatie met RSS maar ook een tijdsindicatie. Hiermee kun je instellen dat de content van de Web Slice verloopt op een bepaalde datum zoals bijvoorbeeld bij een veiling.

De code om een vervaldatum aan te geven is als volgt.

<abbr class="endtime" title="2008-07-13T17:00:00"></abbr>