weekly-digest

Szablon obrazka OG: Przegląd tygodnia

Numer wydania w kolorowym bloku obok trzech ponumerowanych tytułów z tego wydania.

Szablon obrazka Open Graph „Przegląd tygodnia” wyrenderowany przez Shareglint
Szablon Przegląd tygodnia w rozmiarze square (1080×1080)
Szablon Przegląd tygodnia w rozmiarze portrait (1080×1350)
Szablon Przegląd tygodnia w rozmiarze story (1080×1920)
Szablon Przegląd tygodnia w rozmiarze pinterest (1000×1500)
Szablon Przegląd tygodnia 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.

Do przeglądów linków i tygodniowych newsletterów: czytelnik widzi, co jest w środku, zanim kliknie. Numer wydania wypełnia blok w kolorze akcentu, a trzy teksty stoją obok na ponumerowanej liście — w formatach kwadratowych i pionowych pod nim.

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
issue tekst Numer wydania, duży, np. #87. domyślnie: #1 #87
newsletter tekst Nazwa newslettera w winiecie. Frontend Weekly
date tekst Data w takiej postaci, w jakiej ma się wydrukować. Oct 24, 2026
title tekst Nagłówek nad listą, np. W tym tygodniu. domyślnie: This week This week
item_1 tekst Pierwszy tytuł. Container queries are finally boring — and that is great news
item_2 tekst Drugi tytuł. A practical guide to view transitions across pages
item_3 tekst Trzeci tytuł. We measured 40 font-loading strategies so you do not have to
site tekst Twoja domena albo krótki adres. frontendweekly.dev
accent kolor Kolor marki w zapisie hex, np. #6366f1. Barwi przyciski, wyróżnienia i poświatę w tle. domyślnie: #0891b2 #0891b2
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": "weekly-digest",
    "modifications": {
        "issue": "#87",
        "newsletter": "Frontend Weekly",
        "date": "Oct 24, 2026",
        "title": "This week",
        "item_1": "Container queries are finally boring — and that is great news",
        "item_2": "A practical guide to view transitions across pages",
        "item_3": "We measured 40 font-loading strategies so you do not have to",
        "site": "frontendweekly.dev"
    }
}'

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/weekly-digest.png?date=Oct%2024%2C%202026&issue=%2387&item_1=Container%20queries%20are%20finally%20boring%20%E2%80%94%20and%20that%20is%20great%20news&item_2=A%20practical%20guide%20to%20view%20transitions%20across%20pages&item_3=We%20measured%2040%20font-loading%20strategies%20so%20you%20do%20not%20have%20to&newsletter=Frontend%20Weekly&site=frontendweekly.dev&title=This%20week&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/weekly-digest/copy" \
  -H "Authorization: Bearer sk_live_YOUR_KEY"

Więcej szablonów obrazków OG

Wszystkie szablony →