詩と創作・思索のひろば

ドキドキギュンギュンダイアリーです!!!

Fork me on GitHub

ウェブサイトの Windows 8.1 用ライブタイルを提供する

ライブタイルってのは Windows 8 のスタート画面に表示されてるタイルで、その内容がときどき更新されるものです。アプリをスタート画面にピン留めしておくと、アプリを起動することなしにニュースとか株価とかが表示できるって便利なやつです。Android で言うならウィジェットみたいな感じかな。

Windows ストアアプリでないとこれを提供することはできないと思っていたんだけど、実は Internet Explorer 11 の機能で、ウェブサイトをピン留めし、ライブタイルを表示できることを知ったのでやってみた。

IE11 での Web サイト用ライブ タイルの作成 (Windows) に詳しいドキュメントがある。やることは簡単で、

  1. ライブタイルに表示するための情報を提供する XML (と、それにアクセスするための URL)を用意する
  2. ウェブサイトからその XML をポイントするなど、(ライブ)タイルに関する情報を提供する

ウェブサイトがフィードを提供する場合と似たような感じなので、難しさはない。1. で指定できるタイルの種類は https://msdn.microsoft.com/ja-jp/library/ie/dn456348(v=vs.85).aspx にいろいろ書いてある。2. で URL やポーリング間隔を指定できる。これに関しては

  • meta タグをいくつか書く
  • JavaScript を書く
  • 設定リソースをポイントする

の 3 つの方法がある(https://msdn.microsoft.com/ja-jp/library/ie/bg183312(v=vs.85).aspx)。

実例

次の連休 という、次の連休まであと何日か知ることの出来るウェブアプリで試してみた。次の連休まであと何日か、ウェブサイトにアクセスせずに確認できれば便利なはずである。簡単そうな meta タグによる実装。

meta タグを書き、

<meta name="application-name" content="次の連休">
<meta name="msapplication-notification" content="frequency=60; polling-uri=http://japanese-long-weekends.herokuapp.com/ietile.xml">

XML を提供する: http://japanese-long-weekends.herokuapp.com/ietile.xml

あとは IE でウェブサイトにアクセスし、デスクトップにピン留めすると、

f:id:motemen:20150121135525p:plain

無事スタート画面に次の連休までの日数が表示される……

f:id:motemen:20150121134301p:plain

次の連休は 101 日後です(´;ω;`)ブワッ

はてなで一緒に働きませんか?