Documentation

Embed options

Configure your feed directly in HTML using data- attributes on the container element.

Basic usage

The only required attribute is data-feedembed-feed. All others are optional and will use sensible defaults.

<div
  data-feedembed-feed="abc123"
  data-columns="4"
  data-gap="8"
  data-border-radius="12"
></div>

Available attributes

AttributeTypeDefaultDescription
data-feedembed-feedstring—Required. Your feed's unique embed key, found in the dashboard under Feeds.
data-columnsnumber3Number of columns in the grid. Recommended values: 2–6. The grid is always equal-width columns.
data-gapnumber (px)4Gap between posts in pixels. A value of 0 creates a seamless mosaic effect.
data-border-radiusnumber (px)0Border radius of each post in pixels. Set to 8 or 12 for a card-like look.

Examples

3-column grid (default)

<div data-feedembed-feed="your-key"></div>

4-column seamless mosaic

<div
  data-feedembed-feed="your-key"
  data-columns="4"
  data-gap="0"
></div>

2-column rounded cards

<div
  data-feedembed-feed="your-key"
  data-columns="2"
  data-gap="12"
  data-border-radius="16"
></div>

Post count

The number of posts displayed is controlled from the dashboard, not via HTML attributes. Go to your feed’s settings and adjust Max posts. This is enforced server-side to prevent clients from requesting more posts than your plan allows.

Multiple feeds on one page

You can embed multiple feeds on the same page. Each container needs its owndata-feedembed-feed key. The script tag only needs to appear once.

<!-- Feed 1 -->
<div data-feedembed-feed="key-one"></div>

<!-- Feed 2 -->
<div data-feedembed-feed="key-two"></div>

<!-- Script — only once -->
<script src="https://widget.feedembed.io/script.js" defer></script>