Setahun yang lalu, pada Mei 2022, kami menambahkan panel samping ke Chrome. Platform ini adalah platform pendamping baru yang memungkinkan pengguna menggunakan alat bersama konten yang mereka jelajahi. Hari ini, dengan senang hati kami umumkan bahwa ekstensi Anda dapat mulai menampilkan konten di panel samping, mulai Chrome 114.
Lebih baik bagi pengguna, lebih mudah bagi developer
Kami telah melihat banyak developer menerapkan pengalaman seperti sidebar ke dalam ekstensi mereka, yang mengapa kami bersemangat untuk membuatnya menjadi standar platform. Dengan Side Panel API baru, Anda sekarang dapat menawarkan UI persisten yang terbuka di samping halaman yang dikunjungi pengguna. Pengguna akan memperoleh manfaat dari penempatan dan tata letak yang konsisten di antara ekstensi. Selain itu, kemampuan untuk menampilkan UI tanpa meminta izin {i>host<i} merupakan kemenangan privasi yang signifikan bagi pengguna, dengan manfaat berupa mengurangi jumlah peringatan yang ditampilkan untuk ekstensi Anda pada waktu penginstalan.
Side Panel API menghilangkan kesulitan yang dihadapi saat memasukkan konten ke dalam halaman yang tidak dapat dipercaya. Ini juga secara signifikan mengurangi persyaratan untuk mempertahankan kompatibilitas di berbagai situs dan menyaring laporan bug tentang gangguan tak disengaja yang disebabkan oleh .
Pendamping bagi pengguna di seluruh web
Saat membuat pengalaman panel samping baru sebagai bagian dari ekstensi, Anda harus menyimpan satu hal bagaimana Anda membantu pengguna menyelesaikan tugas di seluruh web? Berikut adalah beberapa pertanyaan yang dapat harus mempertimbangkan:
- Bagaimana cara panel samping saya membantu pengguna?
- Kebijakan satu tujuan juga berlaku untuk panel samping Anda. Pastikan panel samping Anda menyediakan fungsi yang berkaitan langsung dengan ekstensi lainnya dan hal yang ingin dicapai pengguna.
- Apakah panel samping saya hanya muncul jika relevan?
- Side Panel API memungkinkan Anda memilih situs yang akan dilihat pengguna di panel samping. Dengan demikian, Anda dapat menghindari menampilkannya jika tidak relevan bagi pengguna atau tidak terkait dengan konten yang dijelajahi pengguna.
- Apakah desainnya konsisten dengan ekstensi lainnya?
- Panel samping Anda harus memiliki desain yang menarik secara visual yang sesuai dengan logo, warna, ikon, serta font ekstensi dan listingan Play Store Anda. Hal ini akan memberi pengguna pengalaman yang konsisten dan dapat dikenali di mana pun mereka menggunakan ekstensi Anda.
- Bagaimana cara pengguna menemukan panel samping saya?
- Beri tahu pengguna baru cara menggunakan panel samping dengan memberikan dokumentasi atau pelatihan yang memadai dalam ekstensi. Hal ini akan membantu Anda mempertahankan pengguna dan menghindari ulasan buruk di listingan Play Store Anda. Ingat, Anda dapat mulai mengajari pengguna sebelum mereka menginstal ekstensi dengan menyertakan video YouTube yang menunjukkan cara kerja ekstensi di listingan Play Store Anda.
Kami juga telah memperbarui Kebijakan Program kami, dengan pembaruan pada bagian Praktik Terbaik dan Pedoman Kualitas untuk mencerminkan beberapa pertimbangan ini. Perubahan ini menyoroti bahwa panel samping Anda harus bertindak sebagai pendamping yang membantu bagi pengalaman menjelajah dengan menyediakan fungsi pelengkap. Ikon ini juga memperjelas bahwa panel samping Anda tidak boleh memiliki gangguan yang tidak perlu.
Ringkasan API
Agar ekstensi Anda muncul di panel samping, minta izin "sidePanel" di manifes, dan tambahkan kunci "side_panel" dengan "default_path" yang mengarah ke halaman dalam ekstensi Anda:
manifest.json:
{
...
"side_panel": {
"default_path": "sidepanel.html"
},
"permissions": [
"sidePanel"
]
...
}
Di halaman panel samping, Anda dapat memuat skrip dan memanggil API ekstensi seperti yang biasa Anda lakukan halaman ekstensi. Ikon untuk panel samping akan diambil dari ekstensi Anda ikon - jangan lupa untuk menyetelnya untuk sedikit polesan.
Kemampuan ekstra
Anda dapat menautkan panel samping ke ikon tindakan, sehingga dapat dibuka dengan mudah kapan saja:
service-worker.js:
await chrome.sidePanel.setPanelBehavior({ openPanelOnActionClick: true });
Jika Anda hanya ingin panel samping muncul di halaman tertentu, Anda dapat mengontrolnya, dan mencegah agar tidak muncul di tempat lain yang tidak relevan dengan pengguna:
service-worker.js:
chrome.tabs.onUpdated.addListener((tabId, info, tab) => {
if (!tab.url) return;
const url = new URL(tab.url);
if (url.origin === 'https://example.com') {
chrome.sidePanel.setOptions({ tabId, path: 'sidepanel.html', enabled: true });
} else {
chrome.sidePanel.setOptions({ tabId, enabled: false });
}
});
Pelajari lebih lanjut
Kami telah memublikasikan dokumentasi Side Panel API yang dapat Anda mulai baca hari ini. Kami juga telah menambahkan sampel ke repositori chrome-extensions-samples, yang merupakan tempat yang tepat untuk melihat bagaimana API dapat digunakan dalam praktiknya.
Seperti yang telah disebutkan, halaman kebijakan dan praktik terbaik kami juga telah direvisi untuk memberikan penjelasan selengkapnya tentang cara membuat panel samping yang memberikan pengalaman terbaik bagi pengguna.
Anda dapat terus mengikuti berita ekstensi Chrome dengan mengunjungi Halaman apa yang baru kami, dan jika Anda memiliki pertanyaan atau memerlukan bantuan terkait Side Panel API, Anda dapat mengunjungi Google Grup ekstensi Chromium.
Foto oleh Vardan Papikyan di Unsplash