Creating tiles and badges (HTML)

Note  Not using JavaScript? See Creating tiles and badges (XAML).

 

This section shows you how to define tile or badge content and send that content as a notification. The content uses local notifications, which are the simplest notifications to implement. Once you understand the basics of tiles and badges, you can apply that knowledge to sending notifications through the other delivery methods: scheduled, periodic, and push. For more information, see Delivering notifications.

The following roadmap suggests a path you should follow as you learn how to define and send tile and badge notifications:

1. Individual topics in this section give some basic conceptual information, but most assume that you already have some background knowledge. If you are new to this feature, you should first familiarize yourself with tile and badge notification terms and concepts so that you understand what can be done with them and how the parts all fit together. This conceptual material is found under Tiles, Badges, and Notifications.
2. Next, you should go over the Guidelines and checklist for tiles and badges to familiarize yourself with best practices that you will employ in your code and in your use of these elements.
3. Now it's time to get into the code. The first step is to define your tile in your app's manifest. Some of the choices you make there determine what can and cannot be done with your tile later. See Quickstart: Creating a default tile using the Microsoft Visual Studio manifest editor.
4. Install your app and check that your default tile is shown on the Start screen. Then you can begin to update your tile's content through notifications. Quickstart: Sending a tile update is your first step in understanding how to do so. This Quickstart walks you through the full process, from defining a tile's XML content to sending that content as a local notification.
5. If your app will use a badge on its tile, Quickstart: Sending a badge update will walk you through defining the badge XML content and sending it to your app's tile through a local notification.

In this section

Topic	Description
Quickstart: Creating a default tile	This topic walks you through the steps needed to create a default tile—the tile displayed in the Start screen until the tile begins to receive notifications—by using the Visual Studio manifest editor.
Quickstart: Sending a tile update	This Quickstart walks you through the steps to define new tile content, send it to your tile, and remove that content once it's no longer needed.
Quickstart: Sending a badge update	This topic shows you how to create or update a badge on a tile. You will send a badge notification that includes either a glyph or numeric value. You will also see how to remove your badge from the tile.
Quickstart: Showing tile and badge updates on the lock screen	This topic explains how to enable your app to show badge and tile notifications on the lock screen.
How to use the notification queue	This topic shows how to enable the notification queue on your tile, in this case using local notifications. It also shows how to tag your notification before sending it, to avoid duplicate or out-of-date content in the queue. With the notification queue enabled, Windows will cycle through up to five notifications.
How to customize Start screen tiles for desktop apps	As of Windows 8.1, Win32 app developers can customize the look of a desktop app's tile on the Start screen.