• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

Blogodolar

  • Home
  • Tentang Saya
  • Kontak
  • Ebook Premium

Firebug, Add-on Mozilla yang Wajib Anda Instal

oleh Herman Yudiono

Anda mungkin mengetahui bahwa saya adalah fans berat Mozilla. Ya, ini karena Mozilla memiliki banyak add-on yang berguna. Satu di antaranya adalah Firebug, yang membantu saya mendalami CSS dan HTML.

Jika Anda pengguna Mozilla yang senang atau baru belajar CSS untuk mendesain tampilan blog, Firebug wajib Anda instal. Di bawah ini adalah cara instal dan menggunakan Firebug.

Cara Instal Firebug

1. Kunjungi situs Firebug.

2. Jika Anda menggunakan Mozilla Firefox 4, lihat Release Notes yang terletak di bagian bawah halaman situs Firebug. Klik tombol Add to Firefox.

3. Klik link instal yang muncul.

4. Setelah diinstal, restart browser Mozilla Anda untuk mengaktifkan Firebug.

Cara Menggunakan Firebug

Ada banyak kegunaan Firebug, satu di antaranya adalah mengetahui ukuran dan jenis huruf yang digunakan blog orang lain.

1. Kunjungi blog yang ingin Anda ketahui ukuran dan jenis hurufnya, misalnya DailyBlogTips.com (DBT).

2. Setelah blog tersebut terbuka sempurna, Tekan tombol F12 pada papan ketik komputer Anda atau ikon Firebug yang ada di pojok kanan bawah browser Mozilla Anda.

3. Akan muncul tampilan Firebug. Klik tanda ikon untuk menginspeksi (berupa tanda panah).

4. Arahkan ikon tersebut ke bagian yang ingin Anda inspeksi, misalnya bagian konten sehingga muncul tanda seleksi berupa kotak biru.

5. Klik kanan kursor tersebut.

6. Ukuran dan jenis hurup akan muncul di bagian CSS (kolom kanan tampilan Firebug). Pada contoh ini, DBT menggunakan huruf Verdana berukuran 13 px.

7. Selain bagian konten, Anda juga menginspeksi CSS bagian lain seperti sidebar, header, dan sebagainya.

Selamat mencoba!

Kategori: Blog Tools

Reader Interactions

Comments

  1. iskandaria says

    Mei 24, 2011 at 12:03 am

    Di Google Chrome juga ada kok Firebugnya Kang. Tapi belakangan ini saya remove/uninstall karena saya lebih menyukai fitur web developer bawaan browser Chrome (yang sudah built-in). Cara kerja dan fiturnya tak jauh beda dengan Firebug. Cuma menurut saya lebih lengkap dan lebih mudah digunakan aja daripada Firebug.

    Untuk sekadar mengetahui kode HTML dan CSS area tertentu dari halaman web yang sedang dibuka, cukup dengan klik kanan pada area yang ingin dicek, lalu klik ‘Inspect Element’.

    • Kang Yudiono says

      Mei 31, 2011 at 8:06 pm

      Siip Mas.
      Saya jadi tahu bahwa Google Chrome juga ada Firebug-nya.
      Maklum Mas, saya belum instal dan pakai GC 😉

  2. Wawan Setiawan says

    Mei 24, 2011 at 2:11 am

    Di Instal Biar Lebih Wuzzz…….

  3. teknologi SMS pada bidang usaha Anda says

    Mei 24, 2011 at 3:32 am

    yaa entar saya ke TKP….

  4. teknologi SMS pada bidang usaha Anda says

    Mei 24, 2011 at 3:36 am

    oia, ada lebih ber-manfaat lagi ga ? gan….
    bwt blog ala add-on firefox…
    terimakasih

  5. Triagung says

    Mei 24, 2011 at 9:28 am

    Seperti ini jawabannya, kadang saya ingin mengetahui jenis font yang dipake blog yang tulisannnya nyaman dibaca, sekarang dapet ilmunya, nuhun kang 🙂

    • Triagung says

      Mei 24, 2011 at 9:34 am

      Oya kalau kebanyakan add ons membuat berat loading ga?

      • Kang Yudiono says

        Mei 31, 2011 at 8:08 pm

        Sepertinya iya Mas Tri.
        Kalau add-on yang saya instal kurang dari 10.
        Loading browser masih cepat Mas 😉

  6. Kang Kabayan says

    Mei 24, 2011 at 12:23 pm

    Kang Kabayan mach setia sama Flock nich.. soalnya suka dengan add-on Blog Editornya, Simple dan Cepat..

  7. Yohanes says

    Mei 25, 2011 at 1:30 am

    dengan add-on firebug ini serasa punya panel control sendiri, tanpa harus sign in dulu.
    nuhun ya Kang buat tipsnya

  8. download software aplikasi gratis says

    Mei 25, 2011 at 11:25 am

    mantap kang… layak dicoba… 🙂

  9. SANG PECINTA BLOGGER says

    Mei 25, 2011 at 8:56 pm

    Wah bisa di coba nih kang..Thanks.

  10. Egy says

    Mei 26, 2011 at 12:15 pm

    Nanti saya coba yah mas.. insyallah bisa berguna.. 🙂 Terima kasih Infonya, Nice Job For you 🙂

    • Kang Yudiono says

      Mei 31, 2011 at 7:54 pm

      Silakan Mas Egy 😉

  11. Kang Yudiono says

    Mei 31, 2011 at 7:52 pm

    Gak bisa Mas karena file php-nya tidak terlihat.
    Yang bisa “diintip” hanya CSS-nya 😉

    • Kevin says

      Oktober 26, 2011 at 11:25 am

      semua script client bisa diliat lewat firebug. javascript,css dan html bisa diliat.
      tapi kalau script server kayak php,jsp,ruby on rails ya gak bisa keliatan.

  12. adnanomatic says

    Juni 1, 2011 at 8:27 pm

    langsung di coba kang..

  13. Jizz Dancer says

    November 15, 2011 at 11:12 pm

    Penting banget!

  14. pengobatan alami says

    November 18, 2011 at 8:49 pm

    mks gan informasinya..

  15. xbox says

    November 22, 2011 at 3:12 pm

    bisa buat ngintip blog orang dong.

  16. xlucky says

    Januari 3, 2012 at 2:22 am

    kk kan kita udh edit tu sesuai keninginan kita
    trs cara apply kan nya gmn

    kyk conto kita udh edit Facebook org sesuai keingan kita trs buat aktifkan nya gmn abis saat kita relog yg kita edit kembali normal lagi

    tq

  17. Internet marketing tools says

    Maret 4, 2012 at 4:07 pm

    Awsome website! I am loving it!! Will be back later to read some more. I am taking your feeds also

  18. jus manggis says

    Juni 14, 2012 at 8:50 pm

    oh ada toh add ons nya,,, hmmm,,, boleh dicoba tuh,,,

  19. new notebook says

    Juli 21, 2012 at 4:41 pm

    aku malah pengin remove tapi nggak tahu caranya, ada yang tahu nggak

  20. belajar says

    Juli 24, 2012 at 11:34 pm

    kalo copy cssnya sih lumayan faham om…kalo html lainnya tuh susah…

  21. suarabola.com says

    Agustus 7, 2012 at 4:37 am

    infonya berguna 🙂

  22. temupasangan.com says

    Agustus 7, 2012 at 4:39 am

    thank’z informasinya….

  23. zhenhella says

    November 14, 2012 at 5:13 am

    wah bagus gan,dah ane coba and terbukti work bangeeet…….

  24. Kresna says

    November 23, 2012 at 3:48 am

    Alhamduilah saya dapat ilmu lagi…
    Terima Kasih banyak Pak..

  25. iam says

    Desember 23, 2012 at 12:34 pm

    caranya memunculkan icon firebug di pjok kanan atas mozila firefox bagaimana mas…
    dan kalu mau masuk wordpress admin tanpa online bagaimana??

Primary Sidebar

Artikel Terbaru

Fungsi Utama Hosting dan VPS yang Perlu Diketahui

Saya Pindah ke Bloggingmo

Cara Menghapus Blog di cPanel Hosting

Studi Kasus Blog Afiliasi #6: Setahun Folder Tekno (Trafik dan Penghasilan)

Studi Kasus Blog Afiliasi #5: Nomor 1 di Google dan Link Building yang Saya Lakukan

Studi Kasus Blog Afiliasi #4: Masuk Halaman 1 Google dan Perkembangan Trafik

Cara Mudah Setting Plugin Yoast SEO

© 2024 · Blogodolar Media · Home · Kontak · Arsip · Tips Pemula