एक साल पहले, मई 2022 में, हमने Chrome के साइड पैनल को जोड़ा था. यह एक नया साथी प्लैटफ़ॉर्म है, जिससे उपयोगकर्ता ब्राउज़ किए जा रहे कॉन्टेंट के साथ-साथ टूल इस्तेमाल कर सकते हैं. आज हमें यह बताते हुए खुशी हो रही है कि आपका एक्सटेंशन, Chrome 114 और इसके बाद के वर्शन में साइड पैनल में कॉन्टेंट दिखाना शुरू कर सकता है.
उपयोगकर्ताओं के लिए बेहतर, डेवलपर के लिए आसान
हमने पहले ही देखा है कि कई डेवलपर अपने एक्सटेंशन में साइडबार जैसे अनुभव लागू करते हैं. इसलिए, हम इसे प्लैटफ़ॉर्म स्टैंडर्ड बनाने को लेकर बहुत उत्साहित हैं. नए साइड पैनल एपीआई की मदद से, अब एक स्थायी यूज़र इंटरफ़ेस (यूआई) उपलब्ध कराया जा सकता है. यह यूज़र इंटरफ़ेस (यूआई) उस पेज के साथ खुलता है जिस पर उपयोगकर्ता जा रहा है. एक्सटेंशन के बीच एक जैसी पोज़िशन और लेआउट रखने से उपयोगकर्ताओं को फ़ायदा होगा. इसके अलावा, होस्ट की अनुमतियों का अनुरोध किए बिना यूज़र इंटरफ़ेस (यूआई) दिखाने की सुविधा, उपयोगकर्ताओं के लिए निजता के लिए एक बड़ी उपलब्धि है. इसका एक फ़ायदा यह है कि इंस्टॉल के समय, एक्सटेंशन के लिए दिखने वाली चेतावनियों की संख्या कम हो जाती है.
Side Panel API, किसी गैर-भरोसेमंद पेज में कॉन्टेंट इंजेक्ट करने से जुड़ी दिक्कतों को दूर करता है. इससे, अलग-अलग साइटों के साथ काम करने की ज़रूरत को भी काफ़ी कम कर दिया जाता है. साथ ही, एक्सटेंशन की वजह से हुई गड़बड़ी की रिपोर्ट को भी देखा जा सकता है.
वेब पर मौजूद उपयोगकर्ताओं का साथी
एक्सटेंशन के हिस्से के तौर पर, नया साइड पैनल अनुभव बनाते समय, आपको एक बात का ध्यान रखना होगा: वेब पर टास्क पूरे करने में उपयोगकर्ताओं की मदद कैसे की जा रही है? यहाँ कुछ सवाल दिए गए हैं, जिन पर आपको ध्यान देना चाहिए:
- मेरा साइड पैनल, उस व्यक्ति की मदद कैसे करता है?
- खास मकसद से जुड़ी नीति आपके साइड पैनल पर भी लागू होती है. पक्का करें कि साइड पैनल में ऐसी सुविधाएं मौजूद हों जो सीधे तौर पर आपके बाकी एक्सटेंशन से जुड़ी हों. साथ ही, यह भी पक्का करें कि उपयोगकर्ता क्या हासिल करना चाहता है.
- क्या मेरा साइड पैनल सिर्फ़ काम का होने पर ही दिखता है?
- साइड पैनल एपीआई की मदद से, आपको यह चुनने की सुविधा मिलती है कि आपके उपयोगकर्ताओं को किन साइटों पर साइड पैनल दिखेगा. ऐसा करने से, उस समय लोगों को यह कॉन्टेंट नहीं दिखेगा जो उनके काम का नहीं है या उनके ब्राउज़ किए गए कॉन्टेंट से जुड़ा हुआ नहीं है.
- क्या डिज़ाइन मेरे बाकी एक्सटेंशन से मेल खाता है?
- आपके साइड पैनल का डिज़ाइन ऐसा होना चाहिए जो दिखने में आकर्षक हो और जो आपके एक्सटेंशन और स्टोर पेज के लोगो, रंग, आइकॉन, और फ़ॉन्ट से मेल खाता हो. इससे उपयोगकर्ताओं को एक जैसा और आसानी से पहचाना जा सकने वाला अनुभव मिलता है. भले ही, वे कहीं भी आपके एक्सटेंशन का इस्तेमाल कर रहे हों.
- उपयोगकर्ता मेरा साइड पैनल कैसे खोज सकते हैं?
- नए उपयोगकर्ताओं को साइड पैनल इस्तेमाल करने का तरीका बताएं. इसके लिए, उन्हें ज़रूरत के मुताबिक दस्तावेज़ या एक्सटेंशन से जुड़ी ट्रेनिंग दें. इससे आपको उपयोगकर्ताओं को अपने साथ बनाए रखने और स्टोर पेज में खराब समीक्षाओं से बचने में मदद मिलेगी. याद रखें कि उपयोगकर्ताओं के एक्सटेंशन इंस्टॉल करने से पहले ही, उपयोगकर्ताओं को इस बारे में जानकारी देना शुरू किया जा सकता है. इसके लिए, उस YouTube वीडियो को शामिल करें जिसमें दिखाया गया हो कि आपका एक्सटेंशन आपके स्टोर पेज में कैसे काम करता है!
हमने कार्यक्रम की नीतियां भी अपडेट की हैं. इनमें, हमारे सबसे सही तरीकों और क्वालिटी के लिए दिशा-निर्देश सेक्शन को अपडेट किया गया है, ताकि इनमें से कुछ विचारों को शामिल किया जा सके. इन बदलावों से यह पता चलता है कि आपके साइड पैनल को अन्य सुविधाओं के ज़रिए ब्राउज़ करने के अनुभव के लिए, एक मददगार साथी के तौर पर काम करना चाहिए. इनकी मदद से, यह भी साफ़ तौर पर पता चलता है कि साइड पैनल में बेवजह ध्यान नहीं भटकना चाहिए.
इस एपीआई के बारे में खास जानकारी
एक्सटेंशन को साइड पैनल में दिखाने के लिए, अपने मेनिफ़ेस्ट में "sidePanel" की अनुमति का अनुरोध करें. साथ ही, "side_panel" बटन को "default_path" से जोड़ें, जो कि आपके एक्सटेंशन में मौजूद किसी पेज पर ले जाता हो:
manifest.json:
{
...
"side_panel": {
"default_path": "sidepanel.html"
},
"permissions": [
"sidePanel"
]
...
}
साइड पैनल पेज पर, स्क्रिप्ट और कॉल एक्सटेंशन एपीआई को लोड किया जा सकता है, जैसा कि किसी दूसरे एक्सटेंशन पेज पर किया जाता है. आपके साइड पैनल का आइकॉन आपके एक्सटेंशन के आइकॉन से लिया जाएगा - ज़्यादा पॉलिश करने के लिए इस आइकॉन को सेट करना न भूलें.
अतिरिक्त सुविधाएं
साइड पैनल को ऐक्शन आइकॉन से लिंक किया जा सकता है, ताकि इसे किसी भी समय आसानी से खोला जा सके:
service-worker.js:
await chrome.sidePanel.setPanelBehavior({ openPanelOnActionClick: true });
अगर आपको अपना साइड पैनल सिर्फ़ चुनिंदा पेजों पर दिखाना है, तो उसे कंट्रोल किया जा सकता है. साथ ही, उसे ऐसी जगहों पर दिखने से रोका जा सकता है जहां वह लोगों के काम का न हो:
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 });
}
});
ज़्यादा जानें
हमने Side Panel API दस्तावेज़ पब्लिश किया है. इसे आज ही पढ़ा जा सकता है. हमने Chrome एक्सटेंशन के सैंपल डेटा स्टोर करने की जगह में नमूने भी जोड़े हैं. यहां यह देखा जा सकता है कि एपीआई का इस्तेमाल कैसे किया जा सकता है.
जैसा कि बताया गया है, हमारे नीति पेजों और सबसे सही तरीकों में भी बदलाव किए गए हैं. ऐसा इसलिए किया गया है, ताकि लोगों को बेहतरीन अनुभव देने वाला साइड पैनल बनाने के बारे में आपको ज़्यादा जानकारी दी जा सके.
हमारे नया क्या है पेज पर जाकर, Chrome एक्सटेंशन की खबरों के बारे में जानकारी रखी जा सकती है. साथ ही, साइड पैनल एपीआई से जुड़ा कोई सवाल पूछने या मदद पाने के लिए, Chromium एक्सटेंशन Google Group पर जाएं.
Unस्प्लैश पर वर्डन पापिक्यान की फ़ोटो