การดำเนินการคือสิ่งที่จะเกิดขึ้นเมื่อผู้ใช้คลิกไอคอนแถบเครื่องมือ ซึ่งโดยทั่วไปจะเรียกว่าไอคอนการดำเนินการสำหรับส่วนขยาย การดำเนินการจะเรียกใช้ฟีเจอร์ส่วนขยายโดยใช้ Action API หรือเปิดป๊อปอัป หน้านี้แสดงวิธีเรียกใช้ฟีเจอร์ส่วนขยาย หากต้องการใช้ป๊อปอัป โปรดดูหัวข้อเพิ่มป๊อปอัป
ลงทะเบียนการดำเนินการ
หากต้องการใช้ chrome.action
API ให้เพิ่มคีย์ "action"
ลงในไฟล์ Manifest ของส่วนขยาย ดูส่วนไฟล์ Manifest ของข้อมูลอ้างอิง API ของ chrome.action
สำหรับคำอธิบายโดยละเอียดเกี่ยวกับคุณสมบัติที่ไม่บังคับของช่องนี้
manifest.json:
{
"name": "My Awesome action Extension",
...
"action": {
...
}
...
}
ตอบสนองต่อการดำเนินการ
ลงทะเบียนเครื่องจัดการ onClicked
เพื่อให้ผู้ใช้คลิกไอคอนการดำเนินการ เหตุการณ์นี้จะไม่ทริกเกอร์หากมีการลงทะเบียนป๊อปอัปในไฟล์ Manifest.json
service-worker.js
chrome.action.onClicked.addListener((tab) => {
chrome.action.setTitle({
tabId: tab.id,
title: `You are on tab: ${tab.id}`});
});
เปิดใช้งานการดำเนินการอย่างมีเงื่อนไข
chrome.declarativeContent
API ช่วยให้คุณเปิดใช้ไอคอนการทำงานของส่วนขยายโดยอิงตาม URL ของหน้าเว็บหรือเมื่อตัวเลือก CSS ตรงกับองค์ประกอบในหน้าเว็บ เมื่อไอคอนการดำเนินการของส่วนขยายถูกปิดใช้งาน ไอคอนจะเป็นสีเทา หากผู้ใช้คลิกไอคอนที่ปิดใช้งาน เมนูตามบริบทของส่วนขยายจะปรากฏขึ้น
ป้ายการทำงาน
ป้ายคือข้อความที่มีการจัดรูปแบบขนาดเล็กซึ่งอยู่ด้านบนไอคอนการทำงานเพื่อระบุข้อมูลต่างๆ เช่น สถานะของส่วนขยาย หรือการดำเนินการต่างๆ ที่ผู้ใช้ต้องทำ เพื่อสาธิตวิธีการนี้ ตัวอย่างน้ำดื่มจะแสดงป้ายที่มีคำว่า "เปิด" เพื่อแสดงให้ผู้ใช้เห็นว่าได้ตั้งปลุกเรียบร้อยแล้ว และจะไม่แสดงอะไรเลยเมื่อส่วนขยายไม่มีการใช้งาน ป้ายมีอักขระได้สูงสุด 4 ตัว
กำหนดข้อความของป้ายโดยเรียก chrome.action.setBadgeText()
และกำหนดสีพื้นหลังโดยเรียกใช้ chrome.action.setBadgeBackgroundColor()
`
service-worker.js
chrome.action.setBadgeText({text: 'ON'});
chrome.action.setBadgeBackgroundColor({color: '#4688F1'});
เคล็ดลับเครื่องมือ
ลงทะเบียนเคล็ดลับเครื่องมือในช่อง "default_title"
ใต้คีย์ "action"
ในไฟล์ Manifest.json
manifest.json:
{
"name": "Tab Flipper",
...
"action": {
"default_title": "Press Ctrl(Win)/Command(Mac)+Shift+Right/Left to flip tabs"
}
...
}
คุณยังตั้งค่าหรืออัปเดตเคล็ดลับเครื่องมือโดยเรียกใช้ action.setTitle()
` ได้ด้วย หากไม่ได้ตั้งค่าเคล็ดลับเครื่องมือไว้ ชื่อของส่วนขยายจะปรากฏขึ้น