The Will Will Web

記載著 Will 在網路世界的學習心得與技術分享

使用IE9釘選的網站捷徑 (Pinned Site Shortcut) 提升用戶體驗

📅 2011/04/08 19:44 📁 Tips, Web

IE9 內建的 釘選的網站捷徑 (Pinned Site Shortcut) 拉近了網站與 Windows 7 桌面互動的能力，經過妥善的規劃與設計也能進一步提升網站整體的用戶體驗，我之前的【IE9 新功能探索：網頁釘選(Pinning)與捷徑清單(Jump Lists)】文章介紹了 IE9 網頁釘選與捷徑清單的能力，不過當時只有講到如何定義基本的工作捷徑而已，今天我要來介紹如何使用自訂類別與捷徑，另外也有實例讓各位體驗一下這功能是否真的好用。

開始講解之前，我先透過一段影片介紹 IE9 的 釘選的網站捷徑 如何使用，以及透過自訂類別捷徑清單如何提升用戶體驗： ( 以下影片建議可使用全螢幕播放，以獲得最佳觀賞效果 )

 

要實做自訂的捷徑類別只要透過 JavaScript 就能達到目的，程式碼也非常簡單，請參考如下：

try {
    if (window.external.msIsSiteMode())
    {
        window.external.msSiteModeCreateJumplist('最近瀏覽商品');

        window.external.msSiteModeAddJumpListItem(
            document.title, 
            location.href, 
            'http://'+location.host+'/favicon.ico');

        window.external.msSiteModeShowJumplist();
    }
}
catch(e) { }

基本上程式分成四個部分：

  1. 第一個 if 條件式是為了判斷該頁面是否是透過 IE9 釘選的網站捷徑開啟的，加上 try/catch 是為了讓其他瀏覽器執行到這行時不會發生例外而終止其他 JavaScript 程式的執行。
  2. 第二個 window.external.msSiteModeCreateJumplist 用來建立新的群組類別，雖然每頁都會執行，但你不用擔心會重複新增，因為重複的群組類別會自動被略過。
  3. 第三個 window.external.msSiteModeAddJumpListItem 就是將本頁的網頁標題與網頁網址加入到自訂的群組類別中，第 1 個參數是捷徑名稱、第 2 個是捷徑網址、第 3 個是小圖示網址（備註：圖檔請使用 16x16 的 *.ico 的圖示格式）。
  4. 第四個 window.external.msSiteModeShowJumpList 是讓本次新增的捷徑更新到工作列上的 釘選的網站捷徑 (Pinned Site Shortcut) 裡面。

其他注意事項

  • 使用自訂的群組類別捷徑有個基本的限制，那就是最多不得超過 20 個捷徑，超過的話會自動將最舊的捷徑進行刪除。
  • 在捷徑清單中如果已經有出現過相同網址的捷徑，該網址的捷徑會自動被拉到第 1 順位。

相關連結

留言評論