Merubah Tampilan Blank Page Mozilla Firefox

Tutorial kali ini dikhususkan bagi anda yang menggunakan browser firefox. Dan mungkin ingin mengganti tampilan new blank page/new tab standar milik firefox yang hanya berupa white page.










Sebetulnya sangatlah mudah untuk mengganti tampilannya, yang diperlukan hanyalah sebuah code CSS dan tentu saja anda harus mengerti dulu apa itu CSS.Mengenai apa itu CSS, silahkan anda googling sendiri ya.


Untuk mengganti halaman new blank page firefox menjadi seperti yang anda inginkan, anda harus membuat sebuah file CSS dan code background pada file tersebut.

Agar lebih mudahnya, anda buka saja folder tempat CSS default firefox berada yaitu di folder C:\Documents and Settings\USERNAME-ANDA\Application Data\Mozilla\Firefox\Profiles\zaebc107.default\chrome dan buka file bernama userContent-example.css. Text yang saya beri warna biru akan berbeda di tiap komputer.



Bila folder tersebut tidak terlihat silahkan anda setting dulu folder option windows explorer anda agar memperlihatkan folder yang disembunyikan, caranya dari menu Tools windows explorer pilih Folder Option lalu pilih pada Tab View dan cari opsi Show Hidden Files and Folders. Lihat Gambar di bawah ini, Klik untuk memperbesar.



Setelah file tadi terlihat, anda buka saja file tadi dengan notepad. Lalu anda hapus textnya dan ganti dengan kode ini
@namespace url(http://www.w3.org/1999/xhtml);
@-moz-document url("about:blank") {
* {
background: url(file:///C:/IMAGE/image-anda.png); /* Folder Path image yang akan dijadikan background */
background-color: #3B5998; /* warna background*/
background-position:bottom right; /* Penempatan Image pada browser, pada contoh ini di posisi kanan bawah */
background-attachment:fixed;
background-repeat:no-repeat; /* Agar Image tidak di ulang, silahkan di isi repeat-x atau reapet-y kalo mau diulang*/
}
}

Pada kode background: yang berwarna biru silahkan anda ganti dengan lokasi folder image yang ingin anda pakai dan kalau bisa imagenya yang transparan biasanya berformat *.GIF atau *.PNG.

Lalu bila anda ingin mengganti warna latar belakangnya anda ganti juga text yang berwarna biru pada code background-color:, format warna yang digunakan adalah format warna html. Untuk kode warna lihat di sini.

Lalu bila anda ingin memposisikan image background tersebut di tempat lain, misal di pojok bawah kiri anda tinggal ganti text yang berwarna biru pada kode background-position: dengan bottom left.

Setelah selesai simpan kode tersebut. Dan close saja notepadnya. Kembali ke folder CSS tadi dan rename file userContent-example.css menjadi userContent.css.

Setelah semua selesai, anda restart dulu firefoxnya agar perubahan tersebut diimplementasikan oleh firefox.
Nah mudah bukan caranya???

NB: Untuk text berwarna hijau boleh tidak digunakan/ditulis (itu hanya penjelasan saja)
Sumber : NeoTutorial.com

Jakarta, 26 Oktober 2010