Raport z audytu w oknie przeglądarki: adres w pasku adresu, do czterech pierścieni w kolorach progów Lighthouse i opcjonalny zrzut ekranu.
To prawdziwe rendery z API z przykładowymi wartościami z tabeli niżej. Przełącz rozmiar wyżej: ten sam szablon układa się w każdym z 6 rozmiarów — wyślij size albo sizes w zapytaniu.
Dla agencji, hostingów, narzędzi SEO i deweloperskich, które chwalą się wynikami strony: wydajnością, dostępnością, dobrymi praktykami i SEO. Pierścienie są ograniczone do 0–100 i robią się czerwone poniżej 50, pomarańczowe poniżej 90 i zielone od 90; wyświetlana liczba to ta, którą wysłano. W kadrach poziomych cztery wskaźniki stoją w rzędzie, a zrzut ekranu po prawej, przycięty od góry; w kwadratowych i pionowych zrzut jest nad siatką dwa na dwa.
Każde pole jest opcjonalne. Za długi tekst zmniejsza się, zamiast wychodzić poza kadr; pole obrazka przyjmuje publiczny adres URL, który pobieramy po naszej stronie.
| Pole | Typ | Opis | Przykład |
|---|---|---|---|
url |
tekst | Adres badanej strony, np. northwind.dev/cennik. domyślnie: example.com | northwind.dev/pricing |
scores |
tekst | Do czterech wyników jako pary etykieta:liczba oddzielone przecinkami albo średnikami, np. Wydajność:98, Dostępność:100, Dobre praktyki:96, SEO:100. | Performance:87, Accessibility:100, Best practices:96, SEO:100 |
device |
tekst | Urządzenie audytu: mobile albo desktop. jedna z wartości: mobile | desktop | mobile |
date |
tekst | Data audytu w dowolnym zapisie. | Oct 26, 2026 |
screenshot |
adres obrazka | Zrzut ekranu strony. | https://example.com/images/phone-app.png |
logo |
adres obrazka | Logo w dolnym rogu okna. | https://example.com/images/logo-northwind.png |
accent |
kolor | Kolor marki w zapisie hex, np. #6366f1. Barwi przyciski, wyróżnienia i poświatę w tle. domyślnie: #2563eb | #2563eb |
theme |
dark | light | Schemat kolorów: dark albo light. domyślnie: light | — |
Slug podajesz jako template. W odpowiedzi dostajesz adres gotowego PNG; ?wait=true trzyma połączenie, aż obrazek będzie gotowy.
curl -X POST "https://shareglint.com/v1/images?wait=true" \
-H "Authorization: Bearer sk_live_YOUR_KEY" \
-H "Content-Type: application/json" \
-d '{
"template": "lighthouse-scores",
"modifications": {
"url": "northwind.dev/pricing",
"scores": "Performance:87, Accessibility:100, Best practices:96, SEO:100",
"device": "mobile",
"date": "Oct 26, 2026",
"screenshot": "https://example.com/images/phone-app.png",
"logo": "https://example.com/images/logo-northwind.png"
}
}'
Dla stron statycznych, Webflow, Shopify i narzędzi no-code: pola idą w query stringu, a całość podpisujesz swoim sekretem. Pierwsze żądanie renderuje obrazek, każde kolejne to przekierowanie na gotowy plik. Jak policzyć podpis.
<meta property="og:image" content="https://shareglint.com/i/acc_YOUR_ACCOUNT_ID/lighthouse-scores.png?date=Oct%2026%2C%202026&device=mobile&scores=Performance%3A87%2C%20Accessibility%3A100%2C%20Best%20practices%3A96%2C%20SEO%3A100&url=northwind.dev%2Fpricing&s=YOUR_SIGNATURE">
accent i theme zmieniasz w każdym żądaniu. Jeśli chcesz więcej, skopiuj szablon na swoje konto: dostajesz zwykły szablon HTML z tymi samymi polami, który edytujesz w panelu albo przez API. Jeśli slug jest na Twoim koncie wolny, kopia go przejmuje — Twoje integracje przechodzą na Twoją wersję bez zmiany jednej linijki.
curl -X POST "https://shareglint.com/v1/templates/library/lighthouse-scores/copy" \
-H "Authorization: Bearer sk_live_YOUR_KEY"
Repozytorium GitHub
Endpoint API
Fragment kodu
Nowa wersja pakietu
Biuletyn bezpieczeństwa
Okno przeglądarki
Stos technologiczny
Przepis automatyzacji
Karta promptu AI
Wszystkie szablony w kategorii Dla programistów (11) → · Wszystkie szablony →