У створенні розширень для Opera немає нічого складного, особливо для тих, хто вже має досвід у створенні розширень для Chromium, так як архітектура розширень для обох браузерів ідентична (з невеликими відмінностями). У цій статті я розповім, як створити найпростіше розширення для Opera.
Що являє собою розширення для Opera?
Hello, world
Тепер, коли ми познайомилися з основами архітектури, давайте створимо просте розширення. Це розширення додасть кнопку на панель браузера, при кліці на яку буде створюватися вкладка з сайтом.
Крок 1: Визначення розширення
Перед початком створіть порожній каталог, де будуть лежати всі файли розширення.
Файл маніфесту містить дані в JSON-форматі; це досить поширений формат серед веб-розробників з огляду на його лаконічності і гнучкості. Скопіюйте текст нижче і збережіть в новому файлі manifest.json.
Крок 2: Взаємодія з браузером: фоновий скрипт
Фоновий скрипт грає важливу роль, так як він взаємодіє з інтерфейсом браузера. У нашому випадку розширення працює з вкладками, тому ми будемо використовувати методи з Tabs API. Про це можна почитати пізніше, а зараз досить створити файл background.js в каталозі розширення і вставити туди цей код:
Крок 3: Підключення іконок та інших ресурсів
Практично будь-якого розширення потрібна іконка, яка буде відображатися в панелі браузера. Рекомендується прочитати цю статтю. де обговорюються кращі практики по створенню якісних іконок для розширень. Для старту можна взяти першу-ліпшу картинку, перейменувати її в icon.png і покласти в каталог з розширенням.
Крім іконки розширення може містити зображення, шрифти тощо. Їх можна покласти в підкаталог, наприклад, assets.
Крок 4: Тестування розширення
Тепер, якщо ви все зробили правильно, можна протестувати наше розширення. Зазвичай закінчене розширення потрібно упакувати і підписати на сторінці управління розширеннями (opera: // extensions /). Але під час розробки нічого упаковувати не потрібно, а розширення буде запускатися прямо з каталогу з файлами:
Всього-то! Розширення повинно завантажуватися в режимі розробника. Цей режим дозволяє інспектувати різні частини розширення, використовуючи інструменти розробника браузера. Для того, щоб перевірити зміни в розширенні, досить натиснути кнопку «Перезавантажити».
Якщо все зроблено вірно, ви побачите іконку на панелі браузера, справа вгорі. Якщо клікнути по іконці, відкриється вкладка з сайтом Dev.Opera.
Крок 5: Упаковка
Коли ви задоволені результатом і розширення готове, потрібно запакувати розширення в NEX-файл:
Буде створено NEX-пакет в батьківському каталозі.
Що тепер?
Як ви бачите, в створенні розширень для Opera дійсно немає нічого складного. У наступних уроках будуть розглянуті інші можливості, доступні розробникам.
Дякуємо за увагу.