Setahun yang lalu, pada Mei 2022, kami menambahkan panel samping ke Chrome. Ini adalah tampilan pendamping baru yang memungkinkan pengguna menggunakan alat bersama konten yang mereka jelajahi. Hari ini, dengan senang hati kami mengumumkan bahwa ekstensi Anda dapat mulai menampilkan konten di panel samping, mulai di Chrome 114.
Lebih baik bagi pengguna, lebih mudah bagi developer
Kami telah melihat banyak developer menerapkan pengalaman seperti sidebar ke dalam ekstensi mereka, sehingga kami sangat senang menjadikannya standar platform. Dengan Side Panel API baru, Anda kini dapat menawarkan UI persisten yang terbuka bersama halaman yang dikunjungi pengguna. Pengguna akan mendapatkan manfaat dari posisi dan tata letak yang konsisten antar-ekstensi. Selain itu, kemampuan untuk menampilkan UI tanpa meminta izin host adalah kemenangan privasi yang signifikan bagi pengguna, dengan manfaat tambahan berupa pengurangan jumlah peringatan yang ditampilkan untuk ekstensi Anda saat penginstalan.
Side Panel API menghilangkan kesulitan yang terkait dengan menyisipkan konten ke dalam halaman yang tidak tepercaya. Hal ini juga secara signifikan mengurangi persyaratan untuk mempertahankan kompatibilitas di berbagai situs dan menyaring laporan bug tentang gangguan yang tidak disengaja yang disebabkan oleh ekstensi Anda.
Pendamping bagi pengguna di seluruh web
Saat membangun pengalaman panel samping baru sebagai bagian dari ekstensi, Anda harus mengingat satu hal: bagaimana Anda membantu pengguna menyelesaikan tugas di seluruh web? Berikut beberapa pertanyaan yang perlu Anda pertimbangkan:
- Bagaimana panel samping saya membantu pengguna?
- Kebijakan tujuan tunggal juga berlaku untuk panel samping Anda. Pastikan panel samping Anda menyediakan fungsi yang terkait langsung dengan bagian ekstensi lainnya dan apa yang ingin dicapai pengguna.
- Apakah panel samping saya hanya muncul saat relevan?
- Dengan Side Panel API, Anda dapat memilih situs tempat pengguna akan melihat panel samping. Dengan begitu, Anda dapat menghindari penayangan iklan saat tidak relevan bagi pengguna atau tidak terkait dengan konten yang sedang dijelajahi pengguna.
- Apakah desainnya konsisten dengan ekstensi saya yang lain?
- Panel samping Anda harus memiliki desain yang menarik secara visual dan cocok dengan logo, warna, ikon, dan font ekstensi serta listingan Play Store Anda. Hal ini memberikan pengalaman yang konsisten dan mudah dikenali kepada pengguna di mana pun mereka menggunakan ekstensi Anda.
- Bagaimana cara pengguna menemukan panel samping saya?
- Beri tahu pengguna baru cara menggunakan panel samping Anda dengan memberikan dokumentasi atau pelatihan yang memadai dalam ekstensi. Hal ini akan membantu Anda mempertahankan pengguna dan menghindari ulasan buruk di listingan Play Store. Ingat, Anda dapat mulai mengajari pengguna sebelum mereka menginstal ekstensi dengan menyertakan video YouTube yang menunjukkan cara kerja ekstensi di listingan Play Store.
Kami juga telah memperbarui Kebijakan Program kami, dengan pembaruan pada bagian Praktik Terbaik dan Pedoman Kualitas untuk mencerminkan beberapa pertimbangan ini. Perubahan ini menunjukkan bahwa panel samping Anda harus berfungsi sebagai pendamping yang bermanfaat bagi pengalaman penjelajahan pengguna dengan menyediakan fungsi pelengkap. Mereka 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 Anda lakukan di halaman ekstensi lainnya. Ikon untuk panel samping Anda akan diambil dari ikon ekstensi - jangan lupa untuk menyetelnya agar terlihat lebih menarik.
Kemampuan tambahan
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 hanya ingin panel samping ditampilkan di halaman tertentu, Anda dapat mengontrolnya dan mencegahnya muncul di tempat lain yang tidak relevan bagi 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 cara penggunaan API dalam praktik.
Seperti yang disebutkan, halaman kebijakan dan praktik terbaik kami juga telah direvisi untuk membagikan lebih banyak informasi tentang cara membuat panel samping yang memberikan pengalaman terbaik bagi pengguna Anda.
Anda dapat terus mengikuti berita ekstensi Chrome dengan membuka halaman Yang baru kami, dan jika ada pertanyaan atau memerlukan bantuan terkait Side Panel API, Anda dapat membuka Grup Google Ekstensi Chromium.