After launching Defense Metrics on the new beehiiv website builder, one of the most common questions we received was regarding how we were able to embed an Airtable on the website.

While beehiiv doesn't offer a native Airtable integration (yet), the process is actually relatively straightforward. Below is a step-by-step guide to achieve this.

Prerequisites

  • An Airtable account with a base and view you want to embed.

  • A beehiiv account with access to the Website Builder for embedding on a webpage.

  • Basic knowledge of HTML for embedding on a beehiiv webpage.

Step 1: Create a Shareable Airtable View

  1. Open Your Airtable Base: Log in to your Airtable account and navigate to the base containing the data you want to share.

  2. Select or Create a View: Choose an existing view (e.g., Grid, Kanban, or Calendar) or create a new one to display your data. Ensure the view shows only the records and fields you want visible to your audience.

  3. Generate a Shareable Link:

    • Click the Share button in the top-right corner of the view.

    • Select Share to Web

    Optional: In the popup, under Manage link settings you can disable options like "Allow viewers to copy data out of this base" to prevent unauthorized data access, if desired.

  4. Get Embed Code (Optional for Webpage Embedding):

    • In the same Share menu, select Embed this page.

    • A new tab will open with the embed code (an <iframe>). Customize options like "Use card layout on desktop" if needed.

    • Copy the provided embed code.

Note: If you're on a paid Airtable plan, you can lock the view to prevent collaborators from modifying it.

Step 2: Embed the Airtable On Your beehiiv Website

Beehiiv allows you to embed custom code on a website, which is ideal for embedding an Airtable view. Here's how:

  1. Access the Website Builder:

    • Log in to your beehiiv account and navigate to Website > Website Builder V2 (as of June, 2025. This may just be called Website Builder in future)

    • Go to the page (or create a custom page) where you want to embed the Airtable view.

  2. Add an HTML Block:

    • In the Website Builder, go to +insert element and add the custom HTML widget to your page.

    • Paste the Airtable embed code (the <iframe> code from Step 1) into the HTML block.

  3. Customize and Save:

    • Adjust the size of the iframe (e.g., width and height) in the embed code to fit your page layout.

      Save the changes and preview the page to ensure the Airtable view displays correctly.

  4. Publish the Page:

    • Once satisfied, publish the page. Your Airtable view will now be embedded on your beehiiv website, updating in real-time as the Airtable view changes.

If you need any help at all feel free to reach out.

Keep Reading

No posts found