این فهرستی از عناصر رابط کاربری موجود در افزونهها است. هر ورودی شامل موارد زیر است:
- تصویری از عنصر (در صورت وجود).
- توضیحی در مورد اینکه برای چه کاری است.
- عناصر رابط مرتبط (در صورت وجود).
- لینکهایی به دستورالعملهای پیادهسازی و نمونههای کد.
این عناصر روشهای مختلفی برای فراخوانی ویژگیهای افزونه هستند. شما ملزم به پیادهسازی همه آنها نیستید. در واقع، برخی از موارد استفاده ممکن است از هیچ یک از آنها استفاده نکنند. به عنوان مثال، یک کوتاهکننده لینک میتواند با استفاده از یک میانبر صفحه کلید روی URL نمایش داده شده عمل کند و لینک کوتاه شده را به صورت برنامهنویسی در کلیپبورد قرار دهد.
اقدامات
یک اکشن (عملکرد) اتفاقی است که وقتی کاربر روی آیکون اکشن افزونه شما کلیک میکند، رخ میدهد. یک اکشن میتواند یا یک ویژگی افزونه را با استفاده از Action API فراخوانی کند یا یک پنجره بازشو (popup) را باز کند که به کاربران امکان میدهد چندین ویژگی افزونه را فراخوانی کنند. با استفاده از یک tooltip به کاربران بگویید که این اکشن چه کاری انجام میدهد.
برای یادگیری ساخت یک اکشن، به بخش پیادهسازی یک اکشن مراجعه کنید یا نمونههای اکشن را بررسی کنید.
آیکونهای اکشن
یک افزونه حداقل به یک آیکون برای نمایش خود نیاز دارد. کاربران برای فراخوانی یک عمل ، روی آیکون کلیک میکنند، چه آن عمل یک ویژگی افزونه را با استفاده از Action API فراخوانی کند و چه یک پنجره بازشو (popup) باز کند.
همچنین میتوانید یک برچسب، که در اینجا «نشان» نامیده میشود، به آیکون اضافه کنید تا مواردی مانند وضعیت افزونه یا اقدامات مورد نیاز کاربر را به او اطلاع دهید.
برای یادگیری ساخت یک اکشن، به بخش پیادهسازی یک اکشن مراجعه کنید یا نمونههای اکشن را بررسی کنید.
نشانها
نشانها (Badges) بخشهایی از متن قالببندیشده هستند که در بالای آیکون عملیات قرار میگیرند تا مواردی مانند وضعیت افزونه یا اینکه عملیات مورد نیاز کاربر چیست را نشان دهند. میتوانید متن نشان را با فراخوانی chrome.action.setBadgeText() و رنگ بنر را با فراخوانی chrome.action.setBadgeBackgroundColor() تنظیم کنید.
برای یادگیری ساخت یک اقدام، به بخش پیادهسازی یک اقدام یا نمونهی نوشیدن آب مراجعه کنید.
دستورات
دستورات، ترکیب کلیدهایی هستند که یک ویژگی افزونه را فراخوانی میکنند. ترکیب کلیدهای مورد نظر را در فایل manifest.json تعریف کنید و با استفاده از API دستورات به آنها پاسخ دهید. برای یادگیری نحوه پیادهسازی یک دستور، به مرجع API یا نمونه chrome.commands مراجعه کنید.
منوی زمینه
یک منوی زمینه برای کلیک جایگزین (که اغلب کلیک راست نامیده میشود) ماوس ظاهر میشود. منوهای زمینه را با استفاده از API منوی زمینه تعریف کنید.
برای یادگیری پیادهسازی منوی زمینه، به نمونههای منوی زمینه مراجعه کنید.
امنیباکس
شما میتوانید با استفاده از omnibox کروم با کاربران تعامل داشته باشید. وقتی کاربری کلمات کلیدی تعریفشده توسط افزونه را در omnibox وارد میکند، افزونه شما آنچه را که کاربر در omnibox میبیند کنترل میکند. کلمات کلیدی را در manifest.json تعریف کنید و با استفاده از API Omnibox به آنها پاسخ دهید.
برای یادگیری لغو omnibox، به بخش «فعال کردن اقدامات از omnibox» یا نمونه مرجع سریع API مراجعه کنید.
صفحات را نادیده بگیرید
یک افزونه میتواند یکی از این صفحات داخلی کروم را لغو کند:
- تاریخچه
- برگه جدید
- نشانکها
برای یادگیری لغو صفحات کروم، به لغو صفحات کروم یا نمونه لغو مراجعه کنید.
پاپآپها
یک پنجره بازشو (popup) عملی است که یک پنجره را نمایش میدهد و به کاربران اجازه میدهد چندین ویژگی افزونه را فراخوانی کنند. اگر کاربر روی نماد عمل کلیک کند، از طریق میانبر صفحه کلید یا با فراخوانی chrome.action.openPopup() میتوان پنجرههای بازشو را باز کرد.
برای یادگیری ساخت یک پنجره بازشو، به «افزودن یک پنجره بازشو» مراجعه کنید. همچنین میتوانید یکی از نمونههای اکشن را دانلود کنید.
پنلهای کناری
یک پنل کناری به کاربران اجازه میدهد تا ویژگیهای افزونه را در کنار صفحات وب فراخوانی کنند (تصویر را ببینید). یک پنل کناری میتواند به یک تب یا کل یک پنجره متصل شود. یک پنل کناری با استفاده از API پنل کناری کنترل میشود.
برای یادگیری ساخت پنل کناری، به موارد استفاده پنل کناری مراجعه کنید یا نمونههای پنل کناری را بررسی کنید.
نکات راهنما
یک tooltip راهی برای نشان دادن این است که وقتی کاربر ماوس را روی آیکون action شما میبرد، action مربوط به extension شما چه کاری انجام میدهد. به طور پیشفرض، tooltip نام extension را نمایش میدهد.
برای یادگیری نحوه اضافه کردن یک tooltip، از عضو "default_title" از کلید "action" در فایلهای مانیفست استفاده کنید.
ابزارهای توسعه
شما میتوانید پنلهای سفارشی (همان تبهایی که در DevTools نامیده میشوند) را با استفاده از API پنلهای DevTools به DevTools اضافه کنید. سایر APIهای DevTools به شما امکان میدهند پنجرهها و ترافیک شبکه را رصد کنید. همچنین میتوانید پنل ضبطکننده DevTools را سفارشی کنید. پنل Lighthouse خود DevTools کروم، در ابتدا به عنوان یک افزونه DevTools شروع به کار کرد.
اعلانها
با استفاده از افزونهی Notifications API یا پلتفرمهای وب Notifications API، پیامها را به سیستم تری کاربر ارسال کنید.
برای یادگیری استفاده از اعلانها، به بخش «اعلان به کاربران» مراجعه کنید.
تمها
یک تم (یا قالب) نوع خاصی از افزونه است که ظاهر مرورگر را تغییر میدهد. تمها مانند افزونههای معمولی بستهبندی شدهاند، اما حاوی کد جاوا اسکریپت یا HTML نیستند.
برای یادگیری ساخت یک قالب، به بخش قالبها چیستند؟ مراجعه کنید.
راههای دیگر برای تعامل با کاربران
این بخش روشهای دیگری را که افزونه شما میتواند با کاربران تعامل داشته باشد، شرح میدهد. اگرچه این موارد برای یک افزونه ساده کاملاً ضروری نیستند، اما میتوانند بخشهای مهمی از افزونه شما باشند. برای بسیاری از کاربران، برخی از این ویژگیها برای استفاده از افزونه کاملاً ضروری هستند.
دسترسیپذیری
برای بسیاری از کاربران، دسترسیپذیری به معنای واقعی کلمه همان رابط کاربری است و ویژگیهای آن اغلب میتواند برای کسانی که به دسترسیپذیری به عنوان وسیله اصلی تعامل با افزونه شما نیاز ندارند، مفید باشد. اصول اولیه دسترسیپذیر کردن افزونه خود را بیاموزید.
بینالمللیسازی
با کاربران به زبان خودشان صحبت کنید. یاد بگیرید که رابط کاربری را بینالمللی کنید .