Relay

Exchange · The block

The block

What a member actually puts on its pages: a strip of four headlines from other newsrooms, above the footer. One request, about 7 KB, no iframe, no cookies, no third-party tracker.

It takes the site's design, not the other way round

The same block, the same markup, four different host themes. Nothing below changes except the variables the host sets — no rule of the block is overridden.

Real headlines, live from the pool. On a member's site the same cards carry signed links; here they lead straight to the newsroom and no trade is booked.

The tag

<script src="https://relay.mib.news/w.js"
        data-key="pk_your_key"
        data-count="4"
        data-band="1" async></script>
data-keyThe member's public key. Bound to its domain — served anywhere, counted only at home.
data-countCards to ask for, 1–12. Default 4. Only full rows are rendered, so the last one may be dropped.
data-langOverride the language. By default the block speaks the language of the member.
data-labelYour own heading instead of the translated default.
data-targetCSS selector for where to render. Without it the block appears where the tag sits.
data-bandRender as a full-width strip above the footer rather than inline.
data-accentAccent colour for the block, if the theme wants a different one from its text colour.

What a theme sets

Every rule of the block sits in @layer relay, so a theme's own rule wins without !important. Most themes never need one: setting a few variables is enough.

--relay-gapSpace between cards. Default 1.25rem.
--relay-minNarrowest a card may get before the row breaks. Default 158px.
--relay-radiusCorner of the preview image. Default 3px.
--relay-ruleHairlines. Default: 18 % of the current text colour.
--relay-surfacePlaceholder behind an image. Default: 8 % of the current text colour.
--relay-accentAccent for the link and underline. Default: the text colour itself.
--relay-maxContent column of the strip. Measured from the theme if not set.
--relay-band-spaceAir above and below the strip.
--relay-title-sizeHeadline size — and --relay-label-size, --relay-meta-size.

How it behaves on the page

Rules the block follows so a member never has to think about it again after pasting the tag.

It matches your column

The strip measures the theme's own footer and main column and lines up with them. A strip running wider than everything above it reads as somebody else's furniture.

layout

It never leaves an orphan

Only full rows render. Six cards in a five-column grid means the sixth is dropped — and it is not counted as seen, because it never was.

layout

It reserves its height

The block claims its space before the cards arrive, so nothing on the page jumps when they do.

layout

It fails quietly

No answer from the exchange, or nothing worth showing: the block renders nothing at all rather than an empty frame.

robustness

It speaks your language

The heading is translated into all eleven languages of the network, and the cards only ever carry material in the language of the page.

content

It carries no tracker

No cookie, no fingerprint, no third-party request. One call for the headlines, one to report a block that was actually seen.

privacy

Getting a key

Keys are issued by hand while the exchange is closed. Every member has a public page here with its key on it — it travels in the page source anyway, and it only works from the domain it belongs to.

Membership terms →