How to – AaronMix

翻译自原文：Tutorial: How to Write an IE8 Web Slice for WordPress Blogs

Web Slices或许是IE8最酷的功能之一了。一些朋友可能会发觉实际上这和Firefox的Live Bookmarks比较相似，不过，IE8 Web Slices可以做的更多而不仅仅只是订阅RSS源。

容我解释一下。打个比方，你对eBay上的某个物品感兴趣并且想尽快得到这个物品的更新通知，比如谁谁谁出了个新价或者卖家修改了产品的描述又或者是运费。要做点这点，可以在你的浏览器里不断刷新这件物品的页面，而更简单的方法则是增加eBay slice功能。

然后现在无论这次拍卖发生了任何的变化，它会即时地反应在你IE8浏览器的收藏夹工具条上。点击这个书签（或者web slice）来获取哪些地方发生了变化。

其实IE8的web slice就是一个内嵌在你浏览器内的迷你页面，也不管你现在是在上哪个网站。而且不像Firefox的Live Bookmarks那样只是一个下拉式菜单显示网站的头条消息。在IE8的中的wen slices你拥有的是对样式的完全控制权使它能多种多样丰富起来。

如何建立IE 8 Web Slice

网站主有这个责任为他/她的网站开发web slices功能。你首先需要决定哪些内容会被呈现在web slice上，更新的频率是多少以及这个web slice的样式如何。

这里（MSDN 库）提供了一些文档来教你如何上手开发web slices，包括了一个样式指南来确保你的web slice在浏览器内看起来不错并且有较强的可读性。

你可能会发觉这个文档本质上太技术化了点，但是千万不要灰心，下面是一些非常简单的例子告诉你如何去为任何使用WordPress的博客（自己独立架设的）定制一个web slice。

1: <html><head>
2: <title>Page Title</title>
3: </head><body>
4: <div class="hslice" id="techologynews">
5:  <h2 class="entry-title">IE 8 web slice</h2>
6:   <div class="entry-content">
7:    <p><a href='#'>Link 1</a></p>
8:    <p><a href='#'>Link 2</a></p>
9:    <p><a href='#'>Link 3</a></p>
10: </div></div>
11: </body></html>

一个IE8 Web slice只是一个简单的HTML页面，结构如上。你只需指定web slice的标题（这是显示在浏览器收藏夹工具条上的），然后在“ entery-content ” 类（第7-9行）中替换成你自己的内容即可。

你也可以自己定义CSS样式，比如这个实例 – 在IE8内打开这个链接来看浏览器是如何自动侦测到页面上的这个web slice（绿色的slice图标会闪）。

如果你还没装IE8或者在你电脑上获取web slice有任何困难，这里有一个高清视频demo（译者注：原文没有这个视频的任何链接，可能作者失误了）。

Web Slices in Internet Explorer 8 – Demo

如果你有一个WordPress（自己独立架设的）博客，下面教你如何创建一个IE8用户可以加到他们菜单栏上的web slice。

在你的WordPress安装目录下创建一个新的文件（比如 webslice.php），然后复制粘贴如何代码到这个php文件下。

<html><head>
 <title>Page Title</title>
</head><body>
<div class="hslice" id="1">
 <h2 class="entry-title">Your Site Name</h2>
 <div class="entry-content"><ol>
<?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";
  }
?>
</ol></div></div>
</body></html>

代码非常简单。实质是创建一个到你WordPress数据库的连接并且创建了一个将会显示到wen slice上的最近发布博客文章的列表，如果有人在IE8内订阅你的站点的话。

如何在IE8里安装 Web Slices

至此你的web slice功能已经就绪，现在可以把这个slice发布到你的网站上让使用IE8的访问者可以把这个slice加入到他们的收藏夹工具条上。

接下去，我们会创建一个简单的HTML按钮使得点击它会自动把这个web slice加入到IE8中。

<input type="button" value="Add [site name] Web Slice"
     onclick='window.external.AddToFavoritesBar("http://web-slice-url",
	"Your Website Name", "slice");' />

如上的Web Slices教程是特别为WordPress博客写的。如果你是在其他平台上建立自己的博客的，参考这篇文章：turn the RSS feed into a Web Slice。