animated-quote-fade

Szablon obrazka OG: cytat pojawiający się słowo po słowie

Cytat, który wyłania się słowo po słowie, a pod nim zdjęcie, imię i rola autora.

Użyj tego szablonu — zacznij za darmo Dokumentacja
Szablon cytat pojawiający się słowo po słowie w rozmiarze square (1080×1080)
Szablon cytat pojawiający się słowo po słowie w rozmiarze portrait (1080×1350)
Szablon cytat pojawiający się słowo po słowie w rozmiarze story (1080×1920)
Szablon cytat pojawiający się słowo po słowie w rozmiarze pinterest (1000×1500)
Szablon cytat pojawiający się słowo po słowie w rozmiarze youtube (1280×720)

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.

Na opinie klientów, cytaty z wywiadów i fragmenty wystąpień jako GIF albo MP4. Słowa pojawiają się kolejno, za nimi podpis, a potem cały cytat stoi. Format statyczny pokazuje pełny cytat.

Pola

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
quote tekst Treść cytatu. domyślnie: Quote goes here The best preview image is the one people stop scrolling for.
author tekst Imię i nazwisko autora. Maya Chen
role tekst Rola albo stanowisko. Head of Growth, Northwind
site tekst Twoja domena albo krótki adres. northwind.dev
photo adres obrazka Zdjęcie autora, okrągłe, obok imienia. https://example.com/images/avatar-woman.jpg
accent kolor Kolor marki w zapisie hex, np. #6366f1. Barwi przyciski, wyróżnienia i poświatę w tle. domyślnie: #0ea5e9 #0ea5e9
theme dark | light Schemat kolorów: dark albo light. —

Wyrenderuj go jednym żądaniem

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": "animated-quote-fade",
    "modifications": {
        "quote": "The best preview image is the one people stop scrolling for.",
        "author": "Maya Chen",
        "role": "Head of Growth, Northwind",
        "site": "northwind.dev",
        "photo": "https://example.com/images/avatar-woman.jpg"
    }
}'

Albo wklej podpisany adres w og:image

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/animated-quote-fade.png?author=Maya%20Chen&quote=The%20best%20preview%20image%20is%20the%20one%20people%20stop%20scrolling%20for.&role=Head%20of%20Growth%2C%20Northwind&site=northwind.dev&s=YOUR_SIGNATURE">

Dopasuj do siebie

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/animated-quote-fade/copy" \
  -H "Authorization: Bearer sk_live_YOUR_KEY"
Użyj tego szablonu — zacznij za darmo

Więcej szablonów: Blog i artykuły

Szablon obrazka Open Graph „wpis na blogu” wyrenderowany przez Shareglint Wpis na blogu Szablon obrazka Open Graph „Karta strony internetowej” wyrenderowany przez Shareglint Karta strony internetowej Szablon obrazka Open Graph „strona dokumentacji” wyrenderowany przez Shareglint Strona dokumentacji Szablon obrazka Open Graph „wydanie newslettera” wyrenderowany przez Shareglint Wydanie newslettera Szablon obrazka Open Graph „karta z cytatem” wyrenderowany przez Shareglint Karta z cytatem Szablon obrazka Open Graph „case study / opinia klienta” wyrenderowany przez Shareglint Case study / opinia klienta Szablon obrazka Open Graph „Cytat redakcyjny” wyrenderowany przez Shareglint Cytat redakcyjny Szablon obrazka Open Graph „Przegląd tygodnia” wyrenderowany przez Shareglint Przegląd tygodnia Szablon obrazka Open Graph „Lista „X sposobów"” wyrenderowany przez Shareglint Lista „X sposobów"

Wszystkie szablony w kategorii Blog i artykuły (13) →  ·  Wszystkie szablony →