Jak napisać wtyczkę do Google Chrome?

ChromeQuizy to 55 polska wtyczka do przeglądarki Google Chrome. Opisuję materiały dostępne dla programistów, na co warto zwracać uwagę podczas pisania wtyczek i jak wygląda to od strony programisty.

Po rozprawieniu się z API Opery przyszedł czas na niekwestionowanego Firefox killera czyli Google Chrome. Nie trzeba chyba nikomu uzmysławiać jak ta przeglądarka zdobywa popularność w imponującym tempie. Do napisania wtyczki zainspirował mnie zeszłoroczny wpis Kamila Ciuksy.

Galeria rozszerzeń Google Chrome istnieje przynajmniej od roku czasu, a pod koniec tegoż ma przemienić się w Chrome Web Store, czyli sklep z aplikacjami, gdzie będą już nie tylko aplikacje darmowe ale i płatne.

Ale zacznijmy od początku, najważniejsze linki to:

Katalog rozszerzeń

Blog developerów Chrome

Strona dla twórców rozszerzeń

Przewodnik a’la szybki start

Dokumentacja

Przykłady

Materiały są przygotowane dobrze. W porównaniu do API Opery mamy do dyspozycji trochę więcej rzeczy: desktopowe notyfikacje (okna koło zegarka), menu kontekstowe, okna ustawień itp. Wydaje się być więcej a przykłady pokrywają większość dostępnych funkcji.

W momencie pisania tego posta były 54 aplikacje polskie. W odróżnieniu od Opery nie ma moderacji wtyczek. W efekcie Quizy na Chrome są 55 wtyczką polską, którą możecie zainstalować stąd.

Żeby dodawać wtyczki trzeba uiścić jednorazową wpłatę w wysokości 5 dolarów czyli około 13 złotych. Nie jest to duża kwota, ale jednak parę piw do tyłu 😉

Quizy Google Chrome

A teraz wyczekiwana przez każdego cześć dla programistów, na którą czekacie równie bardzo co Michał z poprzedniego posta, który napisał, że “Gdyby się dało dodawać oceny to dałbym 10/10 za wpis :)“.

Czytaj podobne  Współpraca grafika (UX designera) i programisty

Budowa wtyczek jest równie prosta co Opery. Wtyczka składa się z pliku manifestu, tym razem w JSON o nazwie manifest.json, ikon, obrazków itp., pliku popup.html, który ma się wyświetlić po naciśnięciu przycisku wtyczki i innych plików, które będziecie potrzebowali, ale taka jest podstawa.

Podobnie jak w Operze pliki trzeba skompresować ZIP-em, ale nie zmieniać rozszerzenia pliku na OEX ani żadne inne.

Testowanie wtyczki jest łatwiejsze niż w Operze, dlatego, że można wskazać rozpakowane pliki wtyczki w trybie developera. Aby wejść w tryb developera klikamy w ikonę klucza, wybieramy Rozszerzenia (albo Narzędzia -> Rozszerzenia) i wybieramy z prawej strony Narzędzia developera. Wtedy pojawi się przycisk otwarcia wtyczki z rozpakowanego pakietu.

Drugi powód dla którego testowanie jest łatwiejsze to przycisk “Odśwież” który powoduje przeładowanie wtyczki. (W Operze trzeba było odinstalować wtyczkę i zainstalować ją ponownie).

Dodanie wtyczki do katalogu jest proste, przejrzyste. Przejrzystsze niż w Operze. Pamiętajcie, aby w manifeście podać dosyć krótki tytuł i opis, dlatego, że są limity około 30 i 140 znaków, a w momencie dodawania do katalogu macie większe pole popisu, w którym możecie rozpisać się na temat wtyczki.

Przykładowy manifest.json:

{
“name”: “Tytuł”,
“version”: “1.0”,
“description” : “Opis”,
“permissions”: [
“tabs”, “http://*/*”, “https://*/*”
],
“browser_action”: {
“default_title”: “Tytuł po najechaniu na ikonę”,
“default_icon”: “icon.png”,
“popup”: “popup.html”
}
}

Jak widzicie wskazujemy tutaj opisówki, ikonę, plik html który ma pokazać się po kliknięciu na ikonę i uprawienia. Uprawienienia to szerszy temat. Warto jednak pamiętać, że Chrome pyta / straszy użytkowników pytaniem o zgodę na udostępnienie zasobów. W powyższym przypadku pyta czy zgadza się na dostęp do historii i wszystkich stron. Dlatego czym mniej uprawnień będziecie wymagać tym lepiej dla Was.

Czytaj podobne  Diagram pełnego środowiska programisty PHP

No i to tyle. Piszcie wtyczki i wpisujcie w komentarze linki do nich. Jeżeli interesują Was newsy o platformach developerskich Chrome i Opery to zachęcam do zapisania się na Polishwords na Facebooku.

Jak myślicie, jaką teraz przeglądarkę powinienem wziąć na tapetę?

Przeczytaj też

Najlepsza książka do Pythona Nie wiesz, z jakiej książki/ebooka uczyć się programowania w języku Python? Postanowiłem zrobić zestawienie 10 książek z Heliona na ten temat, abyś mó...
Komplet 28 ebooków i kursów, aby zostać programist... Od jakiegoś czasu dostaję zapytania na temat tego jakie książki, kursy i ebooki polecam. W związku z tym postanowiłem przygotować dzisiaj zestaw, któr...
120 tapet programistycznych za darmo do pobrania Trochę mi się nudziło, więc przygotowałem zestaw 120 tapet dla programistów. Możesz go pobrać. Tapety są w rozdzielczości 1366x768. Podzielone ...
10 fiszek do nauki programowania w Pythonie Uczysz się programowania w Pythonie? Pobierz te 10 fiszek, które ułatwią Ci zapamiętanie funkcji wbudowanych* w Pythona! Programowanie potrafi ...
Napisano w Kolumna Tagi: , , , ,

Menu