Ekstensi Manifest V2 dihapus dari Chrome Web Store pada 31 Agustus 2026. Migrasikan ekstensi Anda ke Manifest V3 agar tersedia lagi bagi pengguna.

Google menggunakan teknologi AI untuk menerjemahkan konten ke dalam bahasa pilihan Anda. Terjemahan AI mungkin mengandung kesalahan.

chrome.browserAction

refresh date: 2026-09-25 robots: noindex

Deskripsi

Gunakan tindakan browser untuk menempatkan ikon di toolbar utama Google Chrome, di sebelah kanan kolom URL. Selain ikon, tindakan browser dapat memiliki tooltip, badge, dan pop-up.

Ketersediaan

&leq; MV2

Pada gambar berikut, kotak berwarna-warni di sebelah kanan kolom URL adalah ikon untuk tindakan browser. Pop-up berada di bawah ikon.

Jika Anda ingin membuat ikon yang tidak selalu aktif, gunakan tindakan halaman, bukan tindakan browser.

Manifes

Daftarkan tindakan browser Anda di manifes ekstensi seperti ini:

{
  "name": "My extension",
  ...
  "browser_action": {
    "default_icon": {                // optional
      "16": "images/icon16.png",     // optional
      "24": "images/icon24.png",     // optional
      "32": "images/icon32.png"      // optional
    },
    "default_title": "Google Mail",  // optional, shown in tooltip
    "default_popup": "popup.html"    // optional
  },
  ...
}

Anda dapat memberikan ikon dengan ukuran apa pun untuk digunakan di Chrome, dan Chrome akan memilih ikon yang paling mendekati dan menskalakannya ke ukuran yang sesuai untuk mengisi ruang 16 dip. Namun, jika ukuran yang tepat tidak diberikan, penskalaan ini dapat menyebabkan ikon kehilangan detail atau terlihat buram.

Karena perangkat dengan faktor skala yang kurang umum seperti 1,5x atau 1,2x menjadi lebih umum, sebaiknya sediakan beberapa ukuran untuk ikon Anda. Hal ini juga memastikan bahwa jika ukuran tampilan ikon diubah, Anda tidak perlu melakukan pekerjaan tambahan untuk menyediakan ikon yang berbeda.

Sintaksis lama untuk mendaftarkan ikon default masih didukung:

{
  "name": "My extension",
  ...
  "browser_action": {
    ...
    "default_icon": "images/icon32.png"  // optional
    // equivalent to "default_icon": { "32": "images/icon32.png" }
  },
  ...
}

Bagian UI

Tindakan browser dapat memiliki ikon, tooltip, badge, dan pop-up.

Ikon

Ikon tindakan browser di Chrome memiliki lebar dan tinggi 16 dip (piksel yang tidak bergantung pada perangkat). Ikon yang lebih besar akan diubah ukurannya agar pas, tetapi untuk hasil terbaik, gunakan ikon persegi 16 dip.

Anda dapat menetapkan ikon dengan dua cara: menggunakan gambar statis atau menggunakan elemen kanvas HTML5. Menggunakan gambar statis lebih mudah untuk aplikasi sederhana, tetapi Anda dapat membuat UI yang lebih dinamis—seperti animasi yang halus—menggunakan elemen kanvas.

Gambar statis dapat berupa format apa pun yang dapat ditampilkan WebKit, termasuk BMP, GIF, ICO, JPEG, atau PNG. Untuk ekstensi yang tidak dipaketkan, gambar harus dalam format PNG.

Untuk menetapkan ikon, gunakan kolom default_icon dari browser_action di manifes, atau panggil metode browserAction.setIcon.

Untuk menampilkan ikon dengan benar saat kepadatan piksel layar (rasio size_in_pixel / size_in_dip) berbeda dari 1, ikon dapat ditentukan sebagai kumpulan gambar dengan ukuran berbeda. Gambar sebenarnya yang akan ditampilkan akan dipilih dari set agar paling sesuai dengan ukuran piksel 16 dip. Set ikon dapat berisi spesifikasi ikon ukuran apa pun, dan Chrome akan memilih yang paling sesuai.

Untuk menetapkan tooltip, gunakan kolom default_title dari browser_action dalam manifes, atau panggil metode browserAction.setTitle. Anda dapat menentukan string khusus lokalitas untuk kolom default_title; lihat Internasionalisasi untuk mengetahui detailnya.

Badge

Tindakan browser dapat menampilkan badge secara opsional—sedikit teks yang diletakkan di atas ikon. Badge memudahkan pembaruan tindakan browser untuk menampilkan sedikit informasi tentang status ekstensi.

Karena badge memiliki ruang terbatas, badge harus memiliki 4 karakter atau kurang.

Tetapkan teks dan warna badge menggunakan browserAction.setBadgeText dan browserAction.setBadgeBackgroundColor.

Jika tindakan browser memiliki pop-up, pop-up akan muncul saat pengguna mengklik ikon ekstensi. Pop-up dapat berisi konten HTML apa pun yang Anda inginkan, dan ukurannya otomatis disesuaikan dengan kontennya. Pop-up tidak boleh lebih kecil dari 25x25 dan tidak boleh lebih besar dari 800x600.

Untuk menambahkan pop-up ke tindakan browser, buat file HTML dengan konten pop-up. Tentukan file HTML di kolom default_popup dari browser_action dalam manifes, atau panggil metode browserAction.setPopup.

Tips

Untuk dampak visual terbaik, ikuti panduan berikut:

Gunakan tindakan browser untuk fitur yang sesuai di sebagian besar halaman.
Jangan gunakan tindakan browser untuk fitur yang hanya sesuai untuk beberapa halaman. Sebagai gantinya, gunakan tindakan halaman.
Lakukan: gunakan ikon besar dan berwarna-warni yang memanfaatkan ruang 16x16 dip secara maksimal. Ikon tindakan browser seharusnya terlihat sedikit lebih besar dan lebih tebal daripada ikon tindakan halaman.
Jangan mencoba meniru ikon menu monokrom Google Chrome. Hal ini tidak cocok dengan tema, dan ekstensi seharusnya terlihat sedikit berbeda.
Gunakan transparansi alfa untuk menambahkan tepi yang halus ke ikon Anda. Karena banyak orang menggunakan tema, ikon Anda harus terlihat bagus di berbagai warna latar belakang.
Jangan terus-menerus menganimasikan ikon Anda. Merepotkan.

Contoh

Anda dapat menemukan contoh sederhana penggunaan tindakan browser di direktori examples/api/browserAction. Untuk contoh lain dan bantuan dalam melihat kode sumber, lihat Contoh.

Jenis

TabDetails

Chrome 88+

Properti

tabId

number opsional

ID tab yang akan dikueri statusnya. Jika tidak ada tab yang ditentukan, status non-tab-specific akan ditampilkan.

Metode

disable()

Promise

chrome.browserAction.disable(
  tabId?: number,
  callback?: function,
): Promise<void>

Menonaktifkan tindakan browser untuk tab.

Parameter

tabId

number opsional

ID tab yang tindakan browser-nya akan diubah.
callback

fungsi opsional

Chrome 67+

Parameter callback terlihat seperti:
```
() => void
```

Hasil

Promise<void>

Chrome 88+

Promise hanya didukung untuk Manifes V3 dan yang lebih baru, platform lain harus menggunakan callback.

enable()

Promise

chrome.browserAction.enable(
  tabId?: number,
  callback?: function,
): Promise<void>

Mengaktifkan tindakan browser untuk tab. Nilai defaultnya adalah diaktifkan.

Parameter

tabId

number opsional

ID tab yang tindakan browser-nya akan diubah.
callback

fungsi opsional

Chrome 67+

Parameter callback terlihat seperti:
```
() => void
```

Hasil

Promise<void>

Chrome 88+

Promise hanya didukung untuk Manifes V3 dan yang lebih baru, platform lain harus menggunakan callback.

getBadgeBackgroundColor()

Promise

chrome.browserAction.getBadgeBackgroundColor(
  details: TabDetails,
  callback?: function,
): Promise<extensionTypes.ColorArray>

Mendapatkan warna latar belakang tindakan browser.

Parameter

detail

TabDetails
callback

fungsi opsional

Parameter callback terlihat seperti:
```
(result: ColorArray) => void
```
- hasil
  
  ColorArray

Hasil

Promise<extensionTypes.ColorArray>

Chrome 88+

Promise hanya didukung untuk Manifes V3 dan yang lebih baru, platform lain harus menggunakan callback.

getBadgeText()

Promise

chrome.browserAction.getBadgeText(
  details: TabDetails,
  callback?: function,
): Promise<string>

Mendapatkan teks badge tindakan browser. Jika tidak ada tab yang ditentukan, teks badge non-khusus tab akan ditampilkan.

Parameter

detail

TabDetails
callback

fungsi opsional

Parameter callback terlihat seperti:
```
(result: string) => void
```
- hasil
  
  string

Hasil

Promise<string>

Chrome 88+

Promise hanya didukung untuk Manifes V3 dan yang lebih baru, platform lain harus menggunakan callback.

getPopup()

Promise

chrome.browserAction.getPopup(
  details: TabDetails,
  callback?: function,
): Promise<string>

Mendapatkan dokumen HTML yang ditetapkan sebagai pop-up untuk tindakan browser ini.

Parameter

detail

TabDetails
callback

fungsi opsional

Parameter callback terlihat seperti:
```
(result: string) => void
```
- hasil
  
  string

Hasil

Promise<string>

Chrome 88+

Promise hanya didukung untuk Manifes V3 dan yang lebih baru, platform lain harus menggunakan callback.

getTitle()

Promise

chrome.browserAction.getTitle(
  details: TabDetails,
  callback?: function,
): Promise<string>

Mendapatkan judul tindakan browser.

Parameter

detail

TabDetails
callback

fungsi opsional

Parameter callback terlihat seperti:
```
(result: string) => void
```
- hasil
  
  string

Hasil

Promise<string>

Chrome 88+

Promise hanya didukung untuk Manifes V3 dan yang lebih baru, platform lain harus menggunakan callback.

setBadgeBackgroundColor()

Promise

chrome.browserAction.setBadgeBackgroundColor(
  details: object,
  callback?: function,
): Promise<void>

Menetapkan warna latar belakang untuk badge.

Parameter

detail

objek
- warna
  
  string | ColorArray
  
  Array yang berisi empat bilangan bulat dalam rentang 0-255 yang membentuk warna RGBA badge. Dapat juga berupa string dengan nilai warna heksadesimal CSS; misalnya, #FF0000 atau #F00 (merah). Merender warna dengan opasitas penuh.
- tabId
  
  number opsional
  
  Membatasi perubahan saat tab tertentu dipilih. Otomatis direset saat tab ditutup.
callback

fungsi opsional

Chrome 67+

Parameter callback terlihat seperti:
```
() => void
```

Hasil

Promise<void>

Chrome 88+

Promise hanya didukung untuk Manifes V3 dan yang lebih baru, platform lain harus menggunakan callback.

setBadgeText()

Promise

chrome.browserAction.setBadgeText(
  details: object,
  callback?: function,
): Promise<void>

Menetapkan teks badge untuk tindakan browser. Badge ditampilkan di atas ikon.

Parameter

detail

objek
- tabId
  
  number opsional
  
  Membatasi perubahan saat tab tertentu dipilih. Otomatis direset saat tab ditutup.
- teks
  
  string opsional
  
  Anda dapat meneruskan karakter dalam jumlah berapa pun, tetapi hanya sekitar empat karakter yang dapat muat dalam ruang tersebut. Jika string kosong ('') diteruskan, teks badge akan dihapus. Jika tabId ditentukan dan text bernilai null, teks untuk tab yang ditentukan akan dihapus dan ditetapkan secara default ke teks badge global.
callback

fungsi opsional

Chrome 67+

Parameter callback terlihat seperti:
```
() => void
```

Hasil

Promise<void>

Chrome 88+

Promise hanya didukung untuk Manifes V3 dan yang lebih baru, platform lain harus menggunakan callback.

setIcon()

Promise

chrome.browserAction.setIcon(
  details: object,
  callback?: function,
): Promise<void>

Menetapkan ikon untuk tindakan browser. Ikon dapat ditentukan sebagai jalur ke file gambar, sebagai data piksel dari elemen kanvas, atau sebagai kamus dari salah satunya. Properti path atau imageData harus ditentukan.

Parameter

detail

objek
- imageData
  
  ImageData | objek opsional
  
  Objek ImageData atau kamus {size -> ImageData} yang mewakili ikon yang akan ditetapkan. Jika ikon ditentukan sebagai kamus, gambar yang digunakan akan dipilih bergantung pada kepadatan piksel layar. Jika jumlah piksel gambar yang sesuai dengan satu unit ruang layar sama dengan scale, gambar dengan ukuran scale * n akan dipilih, dengan n adalah ukuran ikon di UI. Minimal satu gambar harus ditentukan. Perhatikan bahwa 'details.imageData = foo' setara dengan 'details.imageData = {'16': foo}'
- jalur
  
  string | object opsional
  
  Jalur gambar relatif atau kamus {size -> relative image path} yang mengarah ke ikon yang akan ditetapkan. Jika ikon ditentukan sebagai kamus, gambar yang digunakan akan dipilih bergantung pada kepadatan piksel layar. Jika jumlah piksel gambar yang sesuai dengan satu unit ruang layar sama dengan scale, gambar dengan ukuran scale * n akan dipilih, dengan n adalah ukuran ikon di UI. Minimal satu gambar harus ditentukan. Perhatikan bahwa 'details.path = foo' setara dengan 'details.path = {'16': foo}'
- tabId
  
  number opsional
  
  Membatasi perubahan saat tab tertentu dipilih. Otomatis direset saat tab ditutup.
callback

fungsi opsional

Parameter callback terlihat seperti:
```
() => void
```

Hasil

Promise<void>

Chrome 116+

Promise hanya didukung untuk Manifes V3 dan yang lebih baru, platform lain harus menggunakan callback.

setPopup()

Promise

chrome.browserAction.setPopup(
  details: object,
  callback?: function,
): Promise<void>

Menetapkan dokumen HTML untuk dibuka sebagai jendela pop-up saat pengguna mengklik ikon tindakan browser.

Parameter

detail

objek
- pop-up
  
  string
  
  Jalur relatif ke file HTML yang akan ditampilkan di jendela pop-up. Jika disetel ke string kosong (''), tidak ada jendela pop-up yang ditampilkan.
- tabId
  
  number opsional
  
  Membatasi perubahan saat tab tertentu dipilih. Otomatis direset saat tab ditutup.
callback

fungsi opsional

Chrome 67+

Parameter callback terlihat seperti:
```
() => void
```

Hasil

Promise<void>

Chrome 88+

Promise hanya didukung untuk Manifes V3 dan yang lebih baru, platform lain harus menggunakan callback.

setTitle()

Promise

chrome.browserAction.setTitle(
  details: object,
  callback?: function,
): Promise<void>

Menetapkan judul tindakan browser. Judul ini muncul di tooltip.

Parameter

detail

objek
- tabId
  
  number opsional
  
  Membatasi perubahan saat tab tertentu dipilih. Otomatis direset saat tab ditutup.
- judul
  
  string
  
  String yang harus ditampilkan tindakan browser saat kursor diarahkan ke atasnya.
callback

fungsi opsional

Chrome 67+

Parameter callback terlihat seperti:
```
() => void
```

Hasil

Promise<void>

Chrome 88+

Promise hanya didukung untuk Manifes V3 dan yang lebih baru, platform lain harus menggunakan callback.

Acara

onClicked

chrome.browserAction.onClicked.addListener(
  callback: function,
)

Diaktifkan saat ikon tindakan browser diklik. Tidak diaktifkan jika tindakan browser memiliki pop-up.

Parameter

callback

fungsi

Parameter callback terlihat seperti:
```
(tab: tabs.Tab) => void
```
- tab
  
  tabs.Tab

chrome.browserAction Tetap teratur dengan koleksi Simpan dan kategorikan konten berdasarkan preferensi Anda.

Deskripsi

Ketersediaan

Manifes

Bagian UI

Ikon

Tooltip

Badge

Pop-up

Tips

Contoh

Jenis

TabDetails

Properti

Metode

disable()

Parameter

Hasil

enable()

Parameter

Hasil

getBadgeBackgroundColor()

Parameter

Hasil

getBadgeText()

Parameter

Hasil

getPopup()

Parameter

Hasil

getTitle()

Parameter

Hasil

setBadgeBackgroundColor()

Parameter

Hasil

setBadgeText()

Parameter

Hasil

setIcon()

Parameter

Hasil

setPopup()

Parameter

Hasil

setTitle()

Parameter

Hasil

Acara

onClicked

Parameter

chrome.browserAction