# Grafiki produktowe dla e-commerce z szablonu: karty, promocje i piny
> Karty produktów do udostępniania, grafiki wyprzedaży i obniżek, kupony i piny na Pinterest z katalogu — każdy produkt, każdy rozmiar, jeden szablon.
Opublikowano 2026-11-04 · https://shareglint.com/pl/use-cases/ecommerce-product-images
Grafiki produktowe, które niosą informację — cenę, rabat, „znowu dostępne”, kod kuponu — to ten sam układ powtarzany w całym katalogu. W Shareglint trzymasz ten układ jako szablon i generujesz obrazek każdego produktu z jego danych: jedno zapytanie, gdy spada cena, zlecenie hurtowe dla całego katalogu albo automatyczna karta do udostępniania dla każdej strony produktu. Szablony zrobione z myślą o sklepach to m.in. `product-og`, `product-sale`, `price-drop`, `flash-sale`, `coupon-code`, `product-review` i `product-grid`; działa też twój własny HTML i CSS.
To grafiki marketingowe, nie zdjęcia katalogowe. Twoje zdjęcia produktów zostają bez zmian; wygenerowany obrazek wstawia je do karty z nazwą, ceną i ofertą tam, gdzie taka karta pomaga: w podglądach linków, postach w social mediach, mailach, reklamach i pinach.
## Karta do udostępniania dla każdej strony produktu
Gdy ktoś udostępnia link do produktu, podgląd pokazuje `og:image` strony ([protokół Open Graph](https://ogp.me/)) — często źle przycięte pierwsze zdjęcie produktu albo logo sklepu. Adres auto OG naprawia cały katalog jednym tagiem: odczytuje tytuł, opis i zdjęcie strony produktu i renderuje kartę, gdy pierwszy crawler o nią poprosi. Dopuść domenę sklepu w panelu, a potem wstaw tag do motywu:
```liquid
{%- assign og_card = canonical_url | url_encode | prepend: 'https://shareglint.com/u/acc_YOUR_ACCOUNT_ID.png?url=' -%}
```
[Strona o Shopify](https://shareglint.com/pl/og-image-generator/shopify) ma pełny fragment dla pliku `meta-tags.liquid` motywu Dawn, łącznie z informacją, który istniejący tag zastąpić, żeby `og:image` był jeden, a nie dwa; ten sam pomysł działa w [WooCommerce (WordPress)](https://shareglint.com/pl/og-image-generator/wordpress), [Webflow](https://shareglint.com/pl/og-image-generator/webflow) i innych kreatorach stron. Za niezmieniony produkt nigdy nie płacisz dwa razy, a parametry śledzące, takie jak `?utm_source=`, nie tworzą nowych obrazków.
## Grafiki wyprzedaży, obniżek i kuponów
Przy kampaniach wartości wysyłasz sam:
```bash
curl -X POST "https://shareglint.com/v1/images?wait=true" \
-H "Authorization: Bearer sk_live_..." \
-H "Content-Type: application/json" \
-d '{
"template": "price-drop",
"sizes": ["square", "story"],
"modifications": {
"name": "Trail Runner 2",
"brand": "Northwind",
"old_price": "$129",
"price": "$89",
"saving": "Save $40",
"cta": "Shop now",
"photo": "https://cdn.example.com/products/trail-runner-2.jpg"
}
}'
```
`sizes` zwraca w jednym wywołaniu kwadratowy post i relację z tą samą grafiką — presety to og 1200×630, square 1080×1080, portrait 1080×1350, story 1080×1920, pinterest 1000×1500, youtube 1280×720 — więc zmiana ceny w sklepie może opublikować się sama: webhook przy aktualizacji ceny wywołuje API i przekazuje adresy obrazków do twojego narzędzia do planowania postów. `flash-sale` przyjmuje rabat i datę końca, `coupon-code` kod do pokazania (wpisz go też w tekst posta albo maila, żeby dało się go skopiować), a `product-grid` do czterech produktów na jednym obrazku, do postów z nowościami. Ceny to tekst, który wysyłasz, więc sformatuj je pod dany rynek: `"89 zł"`, `"€89"`, `"$89"`.
## Cały katalog z CSV
Większość platform sklepowych eksportuje produkty do CSV. Zostaw kolumny pasujące do pól szablonu — `name`, `brand`, `price`, `old_price`, `photo` — dodaj `filename` (nada się SKU) i `id`, a potem wyślij plik:
```bash
curl -X POST "https://shareglint.com/v1/batches" \
-H "Authorization: Bearer sk_live_..." \
-H "Content-Type: application/json" \
-d '{ "template": "product-sale", "sizes": ["og", "pinterest"],
"csv_url": "https://example.com/exports/products.csv" }'
```
Każdy produkt × rozmiar to jeden obrazek; `GET /v1/batches/{id}` podaje każdy adres (z twoim `id`) i jedno archiwum ZIP. Limit wierszy na zlecenie według planu: Free 50, Starter 500, Pro 1 000, Scale 2 000, Business 5 000. Uruchom zlecenie ponownie po aktualizacji cen, a od nowa wyrenderują się tylko zmienione produkty — reszta wróci za darmo. Preset `pinterest` to 1000×1500, czyli pin w proporcjach 2:3; `columns` przypisuje nagłówki CSV, które nie pasują do nazw pól.
## Gdzie te grafiki mogą trafić, a gdzie nie
- **Zakupy Google: nie z nakładkami.** Zasady dotyczące zdjęć w Merchant Center mówią, że główne zdjęcie produktu nie może zawierać „tekstu promocyjnego, znaków wodnych ani ramek”, a zdjęcia dodatkowe mogą pokazywać produkt w użyciu albo zawierać grafiki, ale nie promocyjne nakładki ([Google Merchant Center](https://support.google.com/merchants/answer/7052112?hl=pl)). W pliku danych produktów używaj czystych zdjęć, a kart — wszędzie indziej.
- **Platformy sprzedażowe** (marketplace’y) mają własne zasady dotyczące zdjęć (białe tło, bez tekstu) — obowiązuje ten sam podział.
- **Social media, maile i twoje własne strony** to miejsca, w których karty naprawdę się opłacają: podglądy linków, posty organiczne, newslettery, maile o porzuconym koszyku i piny.
- **Reklamy**: przed wgraniem sprawdź zasady danej sieci reklamowej dotyczące tekstu na obrazkach.
## Praktyczne uwagi
- **Zdjęcia pochodzą z twojego CDN-u.** Pola obrazków przyjmują publiczne adresy, pobierane w chwili renderowania obrazka. Adresy prywatne i wewnętrzne są odrzucane.
- **Zdjęcia produktów na przezroczystym tle** najlepiej wyglądają w szablonach z jednolitym albo gradientowym tłem; ustaw `accent` na kolor swojej marki, a `theme` na light albo dark.
- **Animacja** do posta o premierze: `animated-product-reveal` renderuje MP4 albo GIF o długości do 5 sekund, a każdy zużywa 5 renderów z limitu.
- **Kroje pisma** to rodziny zainstalowane w naszym rendererze (`GET /v1/fonts`); własnych plików z fontami nie można wgrać.
## Koszt
Jeden render na obrazek i rozmiar; powtórki z tymi samymi wartościami są darmowe. Katalog 2 000 produktów w dwóch rozmiarach to za pierwszym razem 4 000 renderów, a potem już tylko zmienione produkty. 100 renderów miesięcznie w planie Free ma znak wodny. Starter kosztuje $9 miesięcznie za 2 000 renderów, Pro $29 za 10 000 ([cennik](https://shareglint.com/pl/pricing)).
## Czego nie robi
- Nie usuwa tła, nie retuszuje i nie generuje scen produktowych przez AI — szablon układa zdjęcie, które mu dasz.
- Nie publikuje w social mediach i nie wgrywa niczego do Google Merchant Center; z gotowymi adresami robi to twoje narzędzie do planowania postów albo do plików danych produktów.
- Nie zmienia ceny w już udostępnionym obrazku: nowa cena to nowy obrazek.
## FAQ
### Czy każda strona produktu może dostać własny og:image bez kodu?
Tak, przez adres auto OG: jeden tag w motywie wskazuje adres obrazka, który odczytuje tytuł, opis i zdjęcie strony produktu i renderuje z nich kartę. W Shopify tag trafia do fragmentu motywu z metatagami. Obrazki dostają tylko domeny dopuszczone w panelu.
### Czy mogę używać tych grafik w Zakupach Google?
Nie tych z cenami albo banerami promocji. Zasady dotyczące zdjęć w Google Merchant Center mówią, że główne zdjęcie produktu nie może zawierać tekstu promocyjnego, znaków wodnych ani ramek. W pliku danych produktów używaj czystego zdjęcia, a wygenerowanych kart w postach w social mediach, w reklamach, w których nakładki są dozwolone, i w mailach.
### Jak zrobić grafiki dla całego katalogu?
Wyeksportuj produkty do CSV — nazwę, cenę, starą cenę, adres zdjęcia — i wyślij plik do POST /v1/batches z szablonem produktu i potrzebnymi rozmiarami. Każdy produkt wraca jako adres obrazka, a wszystkie razem w jednym pliku ZIP; niezmienione wiersze są przy kolejnym uruchomieniu darmowe.
### Czy grafiki aktualizują się, gdy zmienia się cena?
Nowa cena to nowy obrazek: wyślij nowe wartości, a dostaniesz nowy plik, podczas gdy stary zachowa swój adres. Adresy auto OG odczytują stronę ponownie najwyżej raz na okres przechowywania w pamięci podręcznej, więc zmieniona cena pojawi się po jego upływie.