Banyak gadget bisa kita dapat dengan gratis dan mudah, bagaiman jika kita membuat gadget kita sendiri ?. Gadget sering kita manfaat untuk mempercantik tampilan Desktop, tentunya juga memiliki tugas – tugas yang dijalankan.File - file yang Dibutuhkan
Untuk membuat sebuah Gadget kita membutuhkan :
a. Sebuah file gadget.xml, sebagai motornya atau mesinnya
b. Sebuah file *.html untuk menampilkan isi atau konten gadget. Kedalam file*.html ini biasanya disisipkan Javascript dan Style CSS
c. File – file pendukung, Gambar, Animasi, Icon dll
Langka – langkah pembuatannya :
1. Buka windows explorer, pergi ke c:\Program Files\Windows Sidebar\Gadgets,
2. Buat sebuah folder, beri nama Nama_Gadget.Gadget contoh ; Hans.Gadget
Semua file – file gadget kita simpan didalam folder ini.
3. Buat file gadget.xml dengan Notepad, atau editor khusus seperti Edit Plus. Isi filenya
<?xml version="1.0" encoding="utf-8" ?>
<gadget>
<name>Hans Ingat</name>
<version>1.0.0.0</version>
<author name="Hans Ledjap">
<info url="hansledjap.com" />
<logo src="/gambar/iconblog.png" />
</author>
<copyright>©2012.</copyright>
<description>Contoh Gadget sederhana.</description>
<icons>
<icon height="48" width="48" src="/gambar/iconblog.ico" />
</icons>
<hosts>
<host name="sidebar">
<base type="HTML" apiVersion="1.0.0" src="hansingat.html" />
<permissions>Full</permissions>
<platform minPlatformVersion="1.0" />
</host>
</hosts>
</gadget>
Simpan filenya pilih encoding UTF – 8 Hasil dari script gadget.xml akan terlihat sebagai berikut :
<host name="sidebar"> ; adalah nama layanan atau mesin widget di windows
<base type="HTML" apiVersion="1.0.0" src="hansingat.html" /> ; Widget akan mengakses file *.html, file ini berisi konten
widget kita. Nama filenya terserah anda.
File – file gambar untuk widget sebaiknya dalam format *.png biar hasilnya lebih menarik.
4. Membuat File HTML
Tahap berikut kita membuat sebuah file html, nama filenya bisa terserah anda, disesuaikan dengan script gadget.xml.
Dalam contoh ini hansingat.html isi filenya
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Unicode" />
<title>Hans Ingat</title>
<style type="text/css"> /* script css */
body /* Atur tampilan / body gadget */
{
margin: 0;
width: 142px;
height: 175px;
font-family: comic sans ms;
font-size: 17px;
}
#gadgetContent /* Atur isi gadget */
{
color:red;
margin-top: 50px;
width: 75px;
vertical-align: middle;
text-align: left;
overflow: hidden;
}
</style>
<script type="text/jscript" language="jscript"> /* javascript */
// Funsi Gadget.
function init()
{
/* background gadget */
var oBackground = document.getElementById("imgBackground");
oBackground.src = "url(gambar/hans.png)";
}
</script>
</head>
<body onload="init()">
<g:background id="imgBackground">
<span id="gadgetContent">
Hans ingat aktifitas hari ini
</span>
</g:background>
</body>
</html>
File *.html sudah ada penjelesan dibagian /* . . .*/ dan <!- … ->
Buka gallery gadget kemudian letakan di Desktop.
DOWNLOAD TULISAN INI
0 comments:
Post a Comment