Adding tasks to a Jump List

The Channel9 Podcast Player sample application declares a list of default tasks that appear in the Jump List. These static, site-specific items appear in a Jump List category called Tasks. A Jump List can contain commonly used destinations and tasks. Some items apply to the whole site, and some apply only to specific users. This task explains how to add site-specific tasks to the default Jump List of a Pinned site.

A Jump List that contains static tasks

Jump List items act as entry points into the website even when the browser is not running. If you want to add items based on recent activity or user preferences, see Adding items to a Jump List Dynamically.

What is a Task?

While a destination is a thing, a task is an action, and in this case it is a site-specific action. Put another way, a destination is a noun and a task is a verb. In the context of a Pinned site, a task can be any common navigation or site functionality.

Some tasks are static, meaning that they are set when the site is pinned. Others, like notifications and user-specific tasks, are dynamic and change over time.

  • Static tasks are defined using meta tags. These properties apply to any one using the site when it is pinned and appear in the category named Tasks. This category can contain up to five items. The items in this list tend to remain the same regardless of the state or status of the application. This topic explains how to add static tasks.
  • Dynamic tasks are defined using JavaScript APIs. These tasks typically surface information that is specific to an individual user and appear in a Jump List category that you create. This custom category can contain up to 20 items, although only the last 10 items appear in the Jump List by default. For more information, see How to Create Dynamic Jump Lists.

A Pinned site can only have one static list and one dynamic list at a time. For example, the following Jump List from Amazon.com contains both kinds of tasks.

Jump Lists can contain both static and dynamic items

Using msapplication-task

The name attribute of the meta element is "msapplication-task" and the content attribute is made up of the following required parts, separated by semicolons:

PartDescription
nameA string. The task name that appears in the Jump List.
action-uriA fully qualified or relative URI. The address that is launched when the item is clicked.
icon-uriA fully qualified or relative URI. The icon resource that appears next to the task in the Jump List.
window-type

One of the following values:

  • tab (default) — a new tab in the current window
  • self — the current tab
  • window — a new Pinned site window

 

For example, to add a single task called "Check Order Status" specify a meta element in the head of your webpage, as follows:


<meta content="name=Check Order Status;
      action-uri=./orderStatus.aspx?src=IE9;
      icon-uri=./favicon.ico" name="msapplication-task" />


In general, relative paths are easier to maintain than fully qualified URIs. You can add any URL parameters that you require, even those that help you track IE9 usage (see the URL parameter named src in the preceding example). The action-uri part does not allow you to use a semicolon.

The tasks in the Jump List appear in the same order as they are defined in the HTML source.

Putting It All Together

Here's the source for the task list in the Channel9 Podcast Player sample application. Each task specifies a URL parameter that filters the podcast playlist by topic. This task completes the site metadata that you started in the Declaring Pinned Site Metadata task.


<meta name="msapplication-task"
      content="name=Msdn Flash Podcasts;
      action-uri=./?topic=msdnFlash;
      icon-uri=Images/channel9_logo.ico" />
<meta name="msapplication-task" 
      content="name=IE Podcasts;
      action-uri=./?topic=connectedShow;
      icon-uri=Images/channel9_logo.ico" />
<meta name="msapplication-task" 
      content="name=Other Podcasts;
      action-uri=./?topic=other;
      icon-uri=Images/channel9_logo.ico" />
<meta name="msapplication-task" 
      content="name=All Podcasts;
      action-uri=./;
      icon-uri=Images/channel9_logo.ico" />


Next Steps

You have defined the basic elements of a Pinned site, but your users still need a way to differentiate your site from the other applications on the taskbar. The Customizing the Site Icon task explains how to create a high-resolution icon for your site. In addition, the Prompting Users to Pin your Site task shows you how to promote your Pinned site features.

More Examples

The msapplication-task metadata, together with the elements described in Declaring Pinned Site Metadata, creates the default Jump List of your Pinned site.

The examples in this section show how some popular websites have used a static Jump List to enhance their user experience in Windows Internet Explorer 9.

Bing.com

The Bing.com Jump List includes Weather, Finance, and News among others


<meta content="Bing" name="application-name" />
<meta content="Bing" name="msapplication-tooltip" />
<meta content="width=1024;height=768" name="msapplication-window" />
<meta content="/" name="msapplication-starturl" />
<meta content="name=Weather;
action-uri=/weather/?FORM=IE0006;
icon-uri=/fd/s/a/sm_weather.ico" name="msapplication-task" />
<!-- ... -->


Facebook.com

The Facebook.com Jump List includes News, Messages, Events, and Friends


<meta name="application-name" content="Facebook"/>
<meta name="msapplication-tooltip" content="Start the Facebook App"/>
<meta name="msapplication-starturl" content="/"/>
<meta name="msapplication-window" content="width=800;height=600"/>
<meta name="msapplication-task"
    content="name=News;
    action-uri=/home.php?sk=nf;
    icon-uri=/images/icons/app/news.ico"/>
<!-- ... -->


Related topics

Tasks
Adding items to a Jump List Dynamically
Declaring Pinned Site Metadata
Conceptual
Pinned Sites in Windows 8
Badge Notifications, directly on your Windows 8 Pinned Site
Fresh Tweets 2.0 - demo for Windows 8
High Quality Visuals for Pinned Sites in Windows 8
How to Create a Basic Pinned Site
Introduction to Pinned Sites

 

 

Show:
© 2014 Microsoft