Embedding on Your Website

Written By Team LoveBoard

Last updated 2 months ago

This guide covers how to install Loveboard embeds on your website, regardless of what platform you use.

The Embed Code

Every Loveboard embed uses a simple JavaScript snippet:

<script src="https://app.loveboard.io/public/widget.js" data-workspace="your-workspace-slug" data-embed="your-embed-slug"></script>

Replace your-workspace-slug and your-embed-slug with your actual values (found in the embed editor).

How to Get the Embed Code

  1. Go to Embeds in the sidebar
  2. Click on the embed you want to install
  3. In the embed editor, click Get Embed Code or look for the code snippet
  4. Copy the entire <script> tag

Installation by Platform

WordPress

Using the HTML Block:

  1. Edit the page where you want the embed
  2. Add an HTML block (also called "Custom HTML")
  3. Paste the embed code
  4. Save/publish the page

Using a Widget Area:

  1. Go to Appearance → Widgets
  2. Add a "Custom HTML" widget to your desired area
  3. Paste the embed code
  4. Save

Webflow

  1. Drag an Embed element onto your page
  2. Paste the embed code in the code editor
  3. Save and publish

Squarespace

  1. Edit your page
  2. Add a Code Block (available in the content blocks menu)
  3. Paste the embed code
  4. Toggle "Display Source" off
  5. Save

Wix

  1. Add an Embed HTML component (Add → Embed → Custom Embeds → Embed a Widget)
  2. Click "Enter Code"
  3. Paste the embed code
  4. Adjust the size of the component
  5. Save and publish

Shopify

  1. Go to Online Store → Themes → Edit Code
  2. Open the template file where you want the embed (e.g., product.liquid, page.liquid)
  3. Paste the embed code at the desired location
  4. Save

Custom HTML Sites

Paste the embed code directly into your HTML file at the location where you want the testimonials to appear:

<body> <!-- Your page content --> <section class="testimonials"> <script src="https://app.loveboard.io/public/widget.js" data-workspace="acme" data-embed="homepage-wall" ></script> </section> <!-- More content -->

How the Widget Works

  1. Loads asynchronously — It doesn't block your page from rendering
  2. Fetches testimonials — Pulls your approved testimonials from Loveboard's servers
  3. Renders the embed — Displays the configured layout (Wall of Love, Carousel, etc.)
  4. Auto-resizes — Adjusts its height to fit the content. No fixed height needed.
  5. Stays responsive — Adapts to any screen size (desktop, tablet, mobile)
  6. Lazy loads — Only loads when the visitor scrolls to it for optimal performance

Troubleshooting

Embed Not Showing

  • Verify the embed code is pasted correctly (the full <script> tag)
  • Check that data-workspace and data-embed values are correct
  • Make sure the embed has approved testimonials to display
  • Open your browser's developer console (F12) and check for JavaScript errors

Embed Shows Empty

  • Go to your Loveboard dashboard and check that you have approved testimonials
  • Verify the embed's filters (form, type, rating) aren't excluding all testimonials
  • Check that the embed is connected to a form that has testimonials

Sizing Issues

  • Don't set a fixed height on the embed container — the widget handles sizing automatically
  • If the embed appears too narrow, ensure the parent container has sufficient width
  • For iframes, make sure auto-resizing scripts are allowed

Multiple Embeds on One Page

You can have multiple Loveboard embeds on the same page. Each embed works independently based on its data-embed attribute.