Pinned Sites

This section describes the APIs related to pinned sites, which allow you to pin websites to the Windows Start screen or the desktop taskbar.

Starting with Internet Explorer 11, sites can be pinned to the Windows Start screen and can respond to notifications, display badges, and customize logo images.

Live Tile support allows your pinned sites to communicate with users and to potentially draw them back to your website.

For more info, see Introduction to Pinned Sites or Pinned Site enhancements in IE11.

Setting up live tiles and notifications

Starting with IE11, there are three ways to define live tile customizations and notifications for pinned sites:

  • Use HTML to specify pinned site metadata:

      <meta name="application-name" content=" Contoso" />
      <meta name="msapplication-TileColor" content=" #009900" />
      <meta name="msapplication-square70x70logo" content="images/smalltile.png" />
      <meta name="msapplication-square150x150logo" content="images/mediumtile.png" />
      <meta name="msapplication-wide310x150logo" content="images/widetile.png" />
      <meta name="msapplication-square310x310logo" content="images/largetile.png" />
      <meta name="msapplication-notification" content="frequency=30; polling-uri=notifications/contoso1.xml;
        polling-uri2=notifications/contoso2.xml; polling-uri3=notifications/contoso3.xml" />
    
  • Use JavaScript to set up periodic notifications:

      document.addEventListener('mssitepinned', StartPeriodicUpdateBatch, false);
    
      function StartPeriodicUpdateBatch()
      {
          var arrURI = ["notifications/contoso1.xml", "notifications/contoso2.xml", "notifications/contoso3.xml"];
          window.external.msEnableTileNotificationQueue(true);
          window.external.msStartPeriodicTileUpdateBatch(arrURI);
    
    
  • Use XMLbrowser configuration files and then call them from the markup of your webpage:

    <?xml version="1.0" encoding="utf-8"?>
    <browserconfig>
      <msapplication>
        <tile>
          <square70x70logo src="images/smalltile.png"/>
          <square150x150logo src="images/mediumtile.png"/>
          <wide310x150logo src="images/widetile.png"/>
          <square310x310logo src="images/largetile.png"/>
          <TileColor>#009900</TileColor>
        </tile>
        <notification>
          <polling-uri  src="notifications/contoso1.xml"/>
          <polling-uri2 src="notifications/contoso2.xml"/>
          <polling-uri3 src="notifications/contoso3.xml"/>
          <frequency>30</frequency>
          <cycle>1</cycle>
        </notification>
      </msapplication>
    </browserconfig>
    

    Use a meta element to load the browser configuration file:

    <meta name="msapplication-config" content="IEconfig.xml" />
    

    To cancel a browser configuration file, set the content attribute of your meta element to "none".)

For more information, see:

Also in this section

Topic Description

Browser configuration schema reference

Browser configuration files (also known as browserconfig) can be used to define pinned site customizations, such as tile backgrounds, badge updates, and tile notifications.

Metadata reference

You can customize pinned sites using the meta element, including the name of your pinned site, the background for various tile sizes, notification updates,badges, and more.

Properties, methods, and events

Pinned sites support a variety of events, methods, and properties.

 

IE11 info and samples

IE11 pinned site enhancements

Downloadable sample

IE11 test drive demos

Windows 8 info

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

Pinned Sites in Windows 8

More info

Internet Explorer 9 Samples and Tutorials

Internet Explorer 9 Test Drive: Site Pinning Demos

Pinned Sites: Windows 7 Desktop Integration with Internet Explorer 9