Przepływ „gdy stanie się to, zrób tamto”: węzły aplikacji na grubej rurze ze strzałkami, wyzwalacz oznaczony błyskawicą.
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 platform automatyzacji, marketplace’ów integracji i galerii szablonów, które publikują kartę dla każdego przepisu. Do pięciu kroków; dłuższy przepis pokazuje cztery i węzeł „+N more steps”. Krok bez ikony dostaje monogram w kolorze wybranym z nazwy aplikacji, a długie opisy działań kończą się po dwóch wierszach. W szerokich kadrach rura biegnie w poprzek karty; w kwadratowych i pionowych w dół po lewej, a każdy krok ma własną kartę.
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 |
|---|---|---|---|
title |
tekst | Co robi przepis — na górze. domyślnie: Automation recipe | Celebrate every big sale with the whole team |
steps |
tekst |
Kroki rozdzielone ;, każdy jako aplikacja|działanie, wyzwalacz pierwszy, np. Paybright|Nowa płatność powyżej 1000 zł;Chatterbox|Wpis na #wins.
|
Paybright|New payment over $1,000;Northwind|Render a thank-you card;Ledgerly|Add a row to the sales sheet;Chatterbox|Post it to #wins |
time_saved |
tekst | Opcjonalna plakietka obok tytułu, np. Oszczędza 3 h tygodniowo. | Saves 3 h a week |
site |
tekst | Adres strony albo przepisu, na dole. | northwind.dev/recipes |
icon_1 |
adres obrazka | Ikona aplikacji-wyzwalacza; icon_2 do icon_5 idą z kolejnymi krokami. | https://example.com/images/b06-icon-bolt.png |
icon_2 |
adres obrazka | Ikona drugiego kroku. | https://example.com/images/logo-northwind.png |
icon_3 |
adres obrazka | Ikona trzeciego kroku. | https://example.com/images/b06-icon-sheet.png |
icon_4 |
adres obrazka | Ikona czwartego kroku. | https://example.com/images/b06-icon-chat.png |
icon_5 |
adres obrazka | Ikona piątego kroku. | — |
accent |
kolor | Kolor marki w zapisie hex, np. #6366f1. Barwi przyciski, wyróżnienia i poświatę w tle. domyślnie: #a855f7 | #a855f7 |
theme |
dark | light | Schemat kolorów: dark albo 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": "automation-recipe",
"modifications": {
"title": "Celebrate every big sale with the whole team",
"steps": "Paybright|New payment over $1,000;Northwind|Render a thank-you card;Ledgerly|Add a row to the sales sheet;Chatterbox|Post it to #wins",
"time_saved": "Saves 3 h a week",
"site": "northwind.dev/recipes",
"icon_1": "https://example.com/images/b06-icon-bolt.png",
"icon_2": "https://example.com/images/logo-northwind.png",
"icon_3": "https://example.com/images/b06-icon-sheet.png",
"icon_4": "https://example.com/images/b06-icon-chat.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/automation-recipe.png?site=northwind.dev%2Frecipes&steps=Paybright%7CNew%20payment%20over%20%241%2C000%3BNorthwind%7CRender%20a%20thank-you%20card%3BLedgerly%7CAdd%20a%20row%20to%20the%20sales%20sheet%3BChatterbox%7CPost%20it%20to%20%23wins&time_saved=Saves%203%20h%20a%20week&title=Celebrate%20every%20big%20sale%20with%20the%20whole%20team&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/automation-recipe/copy" \
-H "Authorization: Bearer sk_live_YOUR_KEY"
Repozytorium GitHub
Endpoint API
Fragment kodu
Nowa wersja pakietu
Wyniki Lighthouse
Biuletyn bezpieczeństwa
Okno przeglądarki
Stos technologiczny
Karta promptu AI
Wszystkie szablony w kategorii Dla programistów (11) → · Wszystkie szablony →