Google Sites Integration

Google Sites has no dev mode, no custom fetch code, and no server-side rendering — everything runs through its Embed block, which renders your HTML inside a sandboxed iframe. That makes the embed widget the only practical integration path, and it works well.

Note

This guide covers the new (2016+) Google Sites, at sites.google.com. The legacy “Classic Sites” product is being retired by Google and isn’t covered here.

Embed the Widget

1. Open your site in the Google Sites editor and navigate to the page you want to add content to.

2. In the right-hand Insert panel, choose Embed.

3. Select the Embed code tab (not “By URL”).

4. Paste the widget script and element:

   <script type="module" src="https://flarebuilder.com/widget/v1/flare-feed.min.js"></script>
   
   <flare-feed
     src="https://your-org.flarebuilder.com/feed"
     max-items="10"
     show-image
     show-date
     show-tags
   ></flare-feed>

5. Click Insert, then resize the embedded block to fit your layout. Google Sites doesn’t auto-size embeds to their content, so leave generous height — the widget scrolls internally if content exceeds it.

6. Click Publish to make the change live.

Your content now loads directly from FlareBuilder’s Feed API — publishing new content in FlareBuilder updates the embedded list automatically, with no further action in Sites.

Filtering and Styling

Both work exactly as documented in the widget guide — add query parameters to src to filter by tag or template, and CSS custom properties on the <flare-feed> element to restyle it:

<flare-feed
  src="https://your-org.flarebuilder.com/feed?templates=announcement&tags=featured"
  style="--ff-primary: #1a73e8; --ff-radius: 12px;"
  max-items="5"
  show-image
></flare-feed>

Caution

The embed sandbox is an isolated iframe, so --ff-font-family: inherit (the widget’s default) falls back to the iframe’s own default font, not your Google Sites theme’s font — it can’t see outside its sandbox. Set --ff-font-family explicitly to match your site.

Events: Use Google Calendar Natively

If your content is event-based, skip the widget for this and use Google Sites’ first-party calendar support instead — it’s a much better fit than a card list.

1. Follow Calendar Integration to subscribe a Google Calendar to your FlareBuilder ICS feed.
2. Back in Google Sites, use Insert → Calendar and select that calendar directly. No embed code or iframe needed — this is a native Sites block.

Limitations

• No way to run arbitrary fetch/JavaScript against the Feed API outside the Embed block’s sandbox — there’s no page-level code, so patterns like Wix Velo’s backend fetching or a React component don’t apply here.
• No dynamic/templated pages — every page’s embed code is static; you can’t generate one page per content item the way a framework’s dynamic routing would.
• Embeds are sandboxed per-block; a single <flare-feed> element and its script tag must live together in one Embed block (don’t split the <script> loader into a separate block from the <flare-feed> element).