Это каталог элементов пользовательского интерфейса, доступных в расширениях. Каждая запись содержит:
- Изображение элемента (если применимо).
- Описание для чего это нужно.
- Сопутствующие элементы интерфейса (если применимо).
- Ссылки на инструкции по реализации и примеры кода.
Эти элементы представляют собой различные способы вызова функций расширения. Вам не обязательно реализовывать их все. Фактически, в некоторых случаях использования ни один из них может не использоваться. Например, более короткая ссылка может воздействовать на отображаемый URL-адрес с помощью сочетания клавиш и программно помещать сокращенную ссылку в буфер обмена.
Действия
Действие — это то, что происходит, когда пользователь щелкает значок действия вашего расширения. Действие может либо вызвать функцию расширения с помощью Action API , либо открыть всплывающее окно , позволяющее пользователям вызывать несколько функций расширения. Сообщите пользователям, что делает действие, с помощью всплывающей подсказки .
Чтобы научиться создавать действие, см. раздел «Реализация действия» или изучите примеры действий .
Значки действий
Расширению требуется хотя бы один значок для его представления. Пользователи щелкают значок, чтобы вызвать действие , независимо от того, вызывает ли это действие функцию расширения с использованием Action API или открывает всплывающее окно .
Вы также можете добавить к значку метку, называемую здесь «значком», чтобы сообщать о таких вещах, как состояние расширения или о том, что действия требуются пользователем.
Чтобы научиться создавать действие, см. раздел «Реализация действия» или изучите примеры действий .
Значки
Значки — это фрагменты форматированного текста, размещаемые поверх значка действия для обозначения таких вещей, как состояние расширения или действия, необходимые пользователю. Вы можете установить текст значка, вызвав chrome.action.setBadgeText() , а цвет баннера, вызвав chrome.action.setBadgeBackgroundColor() .
Чтобы научиться создавать действие, см. раздел «Реализация действия» или пример «Пейте воду» .
Команды
Команды — это комбинации клавиш, которые вызывают функцию расширения. Определите комбинации клавиш в файле манифеста.json и реагируйте на них с помощью API команд . Чтобы научиться реализовывать команду, см. справочник по API или пример chrome.commands .
Контекстное меню
Контекстное меню появляется при альтернативном щелчке мыши (часто называемом щелчком правой кнопкой мыши). Определите контекстные меню с помощью API контекстных меню .
Чтобы научиться реализовывать контекстное меню, ознакомьтесь с примерами контекстного меню .
Омнибокс
Взаимодействовать с пользователями можно с помощью омнибокса Chrome. Когда пользователь вводит ключевые слова, определенные расширением, в омнибокс, ваше расширение контролирует то, что пользователь видит в омнибоксе. Определите ключевые слова в манифесте.json и отвечайте на них с помощью API Omnibox .
Чтобы научиться переопределять омнибокс, см. раздел «Действия триггера из омнибокса» или краткий справочный пример API .
Переопределить страницы
Расширение может переопределить одну из этих встроенных страниц Chrome:
- История
- Новая вкладка
- Закладки
Чтобы научиться переопределять страницы Chrome, см. раздел Переопределение страниц Chrome или пример переопределения .
Всплывающие окна
Всплывающее окно — это действие , которое отображает окно, позволяющее пользователям вызывать несколько функций расширения. Всплывающие окна можно открыть, если пользователь щелкнет значок действия , с помощью сочетания клавиш или путем вызова chrome.action.openPopup() .
Чтобы научиться создавать всплывающее окно, см. раздел «Добавление всплывающего окна» . Вы также можете скачать шаг по одному из примеров действий .
Боковые панели
Боковая панель позволяет пользователям вызывать функции расширения рядом с веб-страницами (см. изображение). Боковую панель можно прикрепить к одной вкладке или ко всему окну. Боковая панель управляется с помощью Side Panel API .
Чтобы научиться создавать боковую панель, ознакомьтесь с примерами использования боковой панели или изучите примеры боковой панели.
Подсказки
Всплывающая подсказка – это способ показать, что делает действие вашего расширения, когда пользователь наводит указатель мыши на значок вашего действия . По умолчанию во всплывающей подсказке отображается имя расширения.
Чтобы научиться добавлять всплывающую подсказку, используйте член "default_title" ключа "action" файлов манифеста.
Инструменты разработчика
Вы можете добавить пользовательские панели (вкладки, которые называются в DevTools) в DevTools с помощью DevTools Panels API . Другие API DevTools позволяют отслеживать окна и сетевой трафик . Вы также можете настроить панель записи DevTools. Собственная панель Chrome DevTools Lighthouse зародилась как расширение DevTools.
Уведомления
Публикуйте сообщения на панели задач пользователя с помощью API уведомлений расширений или API уведомлений веб-платформы.
Чтобы научиться использовать уведомления, см. раздел Уведомление пользователей .
Темы
Тема — это особый вид расширения, которое меняет внешний вид браузера. Темы упакованы как обычные расширения, но не содержат кода JavaScript или HTML.
Чтобы научиться создавать темы, см. Что такое темы? .
Другие способы взаимодействия с пользователями
В этом разделе описаны другие способы взаимодействия вашего расширения с пользователями. Хотя они и не являются строго необходимыми для базового расширения, они могут быть важной частью вашего расширения. Для многих пользователей некоторые из этих функций абсолютно необходимы для использования расширения.
Доступность
Для многих пользователей специальные возможности — это буквально пользовательский интерфейс, и его функции часто могут быть полезны для тех, кому специальные возможности не нужны в качестве основного средства взаимодействия с вашим расширением. Изучите основы обеспечения доступности вашего расширения .
Интернационализация
Говорите с пользователями на их родном языке. Научитесь интернационализировать интерфейс .