Bir yıl önce Mayıs 2022'de Chrome'a yan paneli ekledik. Bu, kullanıcıların göz attıkları içerikle birlikte araçları kullanmalarına olanak tanıyan yeni bir tamamlayıcı yüzeydir. Bugün, uzantınızın Chrome 114 sürümünden itibaren yan panelde içerik göstermeye başlayabileceğini duyurmaktan heyecan duyuyoruz.
Kullanıcılar için daha iyi, geliştiriciler için daha kolay
Birçok geliştiricinin uzantılarına kenar çubuğu benzeri deneyimler uyguladığını görmüştük. bunu bir platform standardı yapmaktan heyecan duyuyoruz. Yeni Side Panel API ile artık kullanıcının ziyaret ettiği sayfanın yanında açılan kalıcı bir kullanıcı arayüzü sunabilir. Kullanıcılar Böylece, uzantılar arasında tutarlı konumlandırma ve yerleşimden yararlanabilirsiniz. Bunun yanı sıra müşterilerin Ana makine izni istemeden kullanıcı arayüzü, kullanıcılar açısından önemli bir gizlilik kazanımıdır. avantajı, yükleme sırasında uzantınız için gösterilen uyarıların sayısını azaltmanın avantajlarından biridir.
Side Panel API, cihazınıza içerik yerleştirmeyle ilgili sıkıntıları ortadan kaldırır. güvenilmeyen bir sayfadır. Ayrıca uyumluluğu sürdürme ihtiyacını da önemli ölçüde azaltır ve cihazınızın neden olduğu kazara aksaklıklarla ilgili hata raporlarında uzantısına sahip olur.
Web genelindeki kullanıcılar için bir tamamlayıcı
Uzantınızın bir parçası olarak yeni bir yan panel deneyimi oluştururken, kullanıcıların web’deki görevleri tamamlamalarına nasıl yardımcı oluyorsunuz? Arkadaş Bitkiler projesinin şunları göz önünde bulundurmalısınız:
- Yan panelim kullanıcıya nasıl yardımcı olur?
- Tek amaç politikası, yan paneliniz için de geçerlidir. Yan panelinizin, uzantınızın geri kalanıyla ve kullanıcının yapmaya çalıştıklarıyla doğrudan alakalı işlevler sağladığından emin olun.
- Yan panelim yalnızca alakalı olduğunda mı görünüyor?
- Side Panel API, kullanıcılarınızın yan paneli hangi sitelerde göreceğini seçmenize olanak tanır. Böylece, alakalı olmadığında veya kullanıcının göz attığı içerikle ilgili olmadığında gösterilmesini önleyebilirsiniz.
- Tasarım, uzantımın geri kalanıyla tutarlı mı?
- Yan paneliniz, uzantınızın ve mağaza girişinizin logosu, renkleri, simgeleri ve yazı tipleriyle uyumlu, görsel olarak ilgi çekici bir tasarıma sahip olmalıdır. Bu, kullanıcılara uzantınızı nerede kullanırlarsa kullansınlar tutarlı, anlaşılır bir deneyim sağlar.
- Kullanıcılar yan panelimi nasıl keşfediyor?
- Uzantı içinden yeterli düzeyde doküman veya eğitim sağlayarak yeni kullanıcılara yan panelinizi nasıl kullanacaklarını bildirin. Bu, kullanıcıları elde tutmanıza ve mağaza girişinizdeki kötü yorumlardan kaçınmanıza yardımcı olur. Mağaza girişinizde, uzantınızın nasıl çalıştığını gösteren bir YouTube videosu ekleyerek kullanıcılara uzantıyı yüklemeden önce öğretmeye başlayabileceğinizi unutmayın!
Ayrıca, Program Politikalarımızı güncelleyerek En İyi Uygulamalar ve Kalite Yönergeleri bölümlerimizi, bu hususlardan bazılarını yansıtacak şekilde güncelledik. Bu değişiklikler, yan panelinizin kullanıcılara yardımcı olması için faydalı ek işlevler sunarak internette gezinme deneyimini artırır. Ayrıca, yan panelinizin gereksiz dikkat dağıtıcı unsurlar barındırmaması gerektiğini de açıkça belirtir.
API'ye genel bakış
Uzantınızın yan panelde görünmesi için manifest'inizde "sidePanel"
iznini isteyin ve uzantınızdaki bir sayfaya işaret eden "default_path"
ile "side_panel"
anahtarını ekleyin:
manifest.json:
{
...
"side_panel": {
"default_path": "sidepanel.html"
},
"permissions": [
"sidePanel"
]
...
}
Yan panel sayfalarında, komut dosyalarını ve telefon uzantısı API'lerini diğer uzantı sayfası. Yan panelinizin simgesi, uzantınızın simgesinden simge - Biraz daha güzelleştirmek için bunu ayarlamayı unutmayın.
Ek özellikler
Yan paneli işlem simgenize bağlayarak istediğiniz zaman kolayca açabilirsiniz:
service-worker.js:
await chrome.sidePanel.setPanelBehavior({ openPanelOnActionClick: true });
Yan panelinizin yalnızca belirli sayfalarda görünmesini istiyorsanız, bunu denetleyebilir ve içerikle alakalı olmayan bir yerde görünmesini engeller:
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 });
}
});
Daha fazla bilgi
Side Panel API dokümanlarını yayınladık. Bu belgeleri hemen okumaya başlayabilirsiniz. Ayrıca, API'nın pratikte nasıl kullanılabileceğini görmek için harika bir yer olan chrome-extensions-samples deposuna örnekler de ekledik.
Daha önce de belirtildiği gibi, politika sayfalarımız ve en iyi uygulamalarımız da kullanıcılarınıza en iyi deneyimi sağlayan bir yan panel oluşturma hakkında daha fazla bilgi paylaşacak şekilde yeniden düzenlendi.
Chrome uzantıları hakkındaki haberleri öğrenmek için Yenilikler sayfamızı ziyaret edebilirsiniz. Sorunuz varsa veya Side Panel API ile ilgili yardıma ihtiyacınız varsa Chromium uzantıları Google Grubu'nu ziyaret edebilirsiniz.
Fotoğraf: Vardan Papikyan, Unsplash'te