قبل عام، في أيار (مايو) 2022، أضفنا اللوحة الجانبية إلى Chrome. هذه مساحة عرض جديدة مصاحبة تتيح للمستخدمين استخدام الأدوات إلى جانب المحتوى الذي يتصفّحونه. يسرّنا اليوم الإعلان عن إمكانية بدء عرض المحتوى في اللوحة الجانبية من خلال الإضافة، وذلك بدءًا من الإصدار 114 من Chrome.
تجربة أفضل للمستخدمين، وتسهيل العمل على المطوّرين
لقد لاحظنا أنّ العديد من المطوّرين أضافوا تجارب مشابهة للشريط الجانبي إلى إضافاتهم، ولهذا السبب نحن متحمّسون لجعلها معيارًا أساسيًا في المنصة. باستخدام Side Panel API الجديدة، يمكنك الآن توفير واجهة مستخدم دائمة تفتح إلى جانب الصفحة التي يتصفّحها المستخدم. سيستفيد المستخدمون من التنسيق والتصميم المتسقَين بين الإضافات. بالإضافة إلى ذلك، تُعدّ إمكانية عرض واجهة المستخدم بدون طلب أذونات المضيف ميزة مهمة للمستخدمين من حيث الخصوصية، مع فائدة إضافية تتمثل في تقليل عدد التحذيرات التي تظهر للإضافة عند التثبيت.
تزيل Side Panel API المشاكل المرتبطة بإضافة محتوى إلى صفحة غير موثوق بها. ويقلّل أيضًا بشكل كبير من الحاجة إلى الحفاظ على التوافق مع المواقع الإلكترونية المختلفة وفحص تقارير الأخطاء بشأن الأعطال العرضية التي تسبّبت بها الإضافة.
مساعد للمستخدمين على الويب
عند إنشاء تجربة لوحة جانبية جديدة كجزء من الإضافة، عليك مراعاة أمر واحد، وهو: كيف تساعد المستخدمين في إكمال المهام على الويب؟ في ما يلي بعض الأسئلة التي يجب أخذها في الاعتبار:
- كيف تساعد اللوحة الجانبية المستخدم؟
- تنطبق سياسة الغرض الواحد أيضًا على اللوحة الجانبية. تأكَّد من أنّ اللوحة الجانبية توفّر وظائف ذات صلة مباشرة ببقية الإضافة وما يحاول المستخدم تحقيقه.
- هل تظهر اللوحة الجانبية فقط عندما تكون ذات صلة؟
- تتيح لك 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-extensions-samples، وهو مكان رائع لمعرفة كيفية استخدام واجهة برمجة التطبيقات عمليًا.
كما ذكرنا، تم أيضًا تعديل صفحات السياسات وأفضل الممارسات لمشاركة المزيد من المعلومات حول كيفية إنشاء لوحة جانبية تقدّم أفضل تجربة للمستخدمين.
يمكنك متابعة آخر الأخبار حول إضافات Chrome من خلال زيارة صفحة "آخر الأخبار"، وإذا كانت لديك أسئلة أو كنت بحاجة إلى مساعدة بشأن Side Panel API، يمكنك زيارة مجموعة Google إضافات Chromium.