Note: Windows 8/10 doesnt have Gadgets anymore, install either Windows Desktop Gadgets or 8GadgetPack to enable this feature again.
In this example I create a gadget for my music livetracker.
Create a folder “livetracker.gadget” in “%USERPROFILE%\AppData\Local\Microsoft\Windows Sidebar\Gadgets\”
Create subfolders “css” and “images”
Create “gadget.xml” in the rootfolder
<?xml version="1.0" encoding="utf-8"?> <gadget> <name>Livetracker</name> <namespace>microsoft.windows</namespace> <version>1.0.0.0</version> <author name="Lunetikk"> <info url="https://lunetikk.de" text="www.lunetikk.de"/> <logo src="images/logo.png"/> </author> <copyright>© 2020</copyright> <description>Shows the current song</description> <icons> <icon height="48" width="48" src="images/icon.png"/> </icons> <hosts> <host name="sidebar"> <autoscaleDPI>true</autoscaleDPI> <base type="HTML" apiVersion="1.0.0" src="song.html"/> <permissions>Full</permissions> <platform minPlatformVersion="1.0"/> <defaultImage src="drag.png"/> </host> </hosts> </gadget>
Create “livetracker.html” in the rootfolder
<html> <head> <title>Livetracker</title> <meta http-equiv="MSThemeCompatible" content="yes"> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <link href="css/styles.css" rel="stylesheet"> <script type="text/javascript"> setInterval(refreshIframe, 15000); function refreshIframe() { var frame = document.getElementById("frame1"); frame.src = frame.src; } </script> </head> <body dir="ltr" scroll="no" unselectable="on" onload="init()"> <iframe id="frame1" src="https://lunetikk.de/audio.php" width="650" height="115"></iframe> </body> </html>
Create “styles.css” in css folder
body { width: 660px; height: 115px; margin:0; border:2px outset gray; cursor:default; }
Add your images to your images folder and start the gadget