Sejak pakai Firefox pertama kali dan pakai banyak Extension Firefox, saya sebenarnya kepikiran dan penasaran, bagaimana Extension Firefox di buat, tapi baru kemarin saya mencoba mencari info bagaimana membuat Extension tersebut, seperti biasa pertama saya googling, browsing- browsing dan memilah milah informasi. Merasa sudah cukup informasi saya dapat, proses trial-error pun langsung berjalan dengan sendirinya, danhasilnya cukup memuaskan, akhirnya saya punya gambaran yang lumayan jelas bagaimana Extension Firefox dibuat. (walaupun Extension Firefox yang saya buat gak guna :p )
Extension yang saya buat bisa di download di
sini. Apa dan bagaimanakah Extension Firefox dibuat ?
Extension Firefox yang berakhiran .XPI itu sebenarnya adalah file .ZIP yang diganti namanya(rename). Coba lihat Extension Firefox yang saya buat, yang bernama puputs.xpi, coba rename menjadi puputs.zip dan extract file tersebut ke sembarang folder, nantinya kita bisa melihat struktur file dari Extension Firefox tersebut, seperti ilustrasi di bawah.
--puputs/
--puputs/content/puputs.js
--puputs/content/puputs.xul
--puputs/chrome.manifest
--puputs/install.rdf
Install.rdf adalah xml yang berisi tentang informasi mengenai siapa yang membuat, deskripsi, versi dan juga nama dari Extension Firefox tersebut, kita tidak perlu membuat file install.rdf baru untuk setiap Extension Firefox yang kita buat, kita tinggal mengganti isi dari file install.rdf yang sesuai untuk Extension Firefox buatan kita.
Sebelum saya menjelaskan file chrome.manifest saya akan menjelaskan dahulu apa itu file.xul, file.xul adalah sebuah Xml User interface Langguage, yaitu suatu file yang menggambarkan tampilan dari Firefox itu sendiri, coba masukan chrome://browser/content/browser.xul ke dalam address bar Firefox, nantinya kita akan melihat bagaimana tampilan dari Firefox itu sendiri. File browser.xul tersebut dapat di akses di folder instalasi Firefox kita, kalo saya ada di Program Files>Mozilla Firefox>chrome>browser.jar, backup dan rename file browser.jar menjadi browser.zip, didalam browser.zip kita akan melihat content>browser>browser.xul.
Chrome.manifest, yang saya tahu file ini untuk menunjukan bagian dari mana, dari tampilan Firefox yang ingin kita ganti, dan menunjukan file yang kita buat untuk mengganti tampilan Firefox.
Contoh:
Dalam file kita lihat
chrome://browser/content/browser.xul chrome://puputs/content/puputs.xul
berarti kita akan menambahkan file browser.xul dengan file puputs.xul. Untuk mengetahui apa yang ingin kita rubah, kita bisa melihat info ID dari tambilan Firefox di browser.xul.
puputs.xul, adalah file xml yang menggambarkan tampilan dari Extension Firefox yang kita ingin buat.
Contoh:
Saya ingin ada menu baru seperti File>Puputs.com maka saya cari dimana letak ID File menu di browser.xul. Setelah dicari, ID File menu di browser.xul adalah menu_FilePopup maka saya tinggal meniru struktur xml di browser.xml dan menambahkan menu item di dalam menu_FilePopup, seperti yang terlihat di file puputs.xul.
Dalam puputs.xul kita juga menambahkan src="chrome://puputs/content/puputs.js" di tag overlay artinya untuk mendaftarkan file java script yang berisi kode fungsionalitas dari Extension kita, untuk memanggil fungsi yang ada di puput.js di menu item kita tambahkan onCommand="namaFungsi()".
Puputs.js, adalah file Java Script yang berisi fungsionalitas dari Extension kita, di file Java Script saya hanya memberikan fungsi membuka website www.puputs.com di windows yang sedang aktif, apabila tombol menu dii tekan.
Setelah semua file kita buat saatnya kita membentuk file .XPI guna di konsumsi oleh Firefox, caranya kita harus membuat file .ZIP yang terdiri dari install.rdf, chrome.manifest dan foder content, setelah file .ZIP terbentuk rename lah file tersebut menjadi file .XPI. Buka Firefox anda dan coba buka file .XPI buatan anda menggunakan Firefox dan lihat hasilnya.
INFO : File Download Sudah ilang, jadi sudah tidak bisa mengambil contoh file xpi nya, Maaf