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. Bu nedenle, bunu bir platform standardı yapmaktan memnuniyet 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ü sunabilirsiniz. Kullanıcılar, uzantılar arasında tutarlı konumlandırma ve düzenden yararlanır. Buna ek olarak, ana makine izni istemeden kullanıcı arayüzü gösterebilmek, kullanıcılar açısından gizlilik açısından önemli bir avantajdır. Bu sayede, yükleme sırasında uzantınız için gösterilen uyarıların sayısını da azaltabilir.
Side Panel API, güvenilmeyen bir sayfaya içerik yerleştirmeyle ilgili sıkıntıları ortadan kaldırır. Ayrıca, farklı siteler ile uyumluluğu koruma ve uzantınızın neden olduğu kazara aksaklıklarla ilgili hata raporlarıyla eleme çalışmalarıyla ilgili gereksinimleri de önemli ölçüde azaltır.
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, unutmamanız gereken bir nokta vardır: Kullanıcıların web'de görevleri tamamlamasına nasıl yardımcı oluyorsunuz? Üzerinde düşünmeniz gereken birkaç soru şöyle olabilir:
- 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 Kuralları bölümlerimizi, bu hususların bazılarını yansıtacak şekilde güncelledik. Bu değişiklikler, yan panelinizin tamamlayıcı işlevler sağlayarak kullanıcıların göz atma deneyimlerinde yardımcı bir tamamlayıcı işlevi görmesi gerektiğini vurgular. 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 sayfasında, komut dosyalarını ve telefon uzantısı API'lerini diğer herhangi bir uzantı sayfasında olduğu gibi yükleyebilirsiniz. Yan panelinizdeki simge, uzantınızın simgesinden alınır. Daha fazla gösterişlilik için bu simgeyi 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 kontrol edebilir ve kullanıcıyla alakalı olmayan başka yerlerde görünmesini engelleyebilirsiniz:
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