Beehiiv: Designing models and global elements

beehiiv·Jan 2025

Demo summary

Walks through the models tab for designing pop-ups (like sign-up forms) and editing global elements like headers and footers.

Step-by-step

Navigate to the Models tab in the website editor
Select a specific model, such as the sign-up or login popup, to open its dedicated editor
Insert a button onto a page and select it
Go to the Action menu for that button
Choose a model from the list to trigger it upon clicking the button

Options

Trigger models via default navigation bar buttons
Trigger models via custom buttons inserted on a page
Disable global elements like headers and footers on specific pages

Watch out for

Global elements like navigation bars and footers are applied to all pages by default

All demos from “How to use the beehiiv Website Builder (Beta)”

0:080:56Onboarding and initial website setup in beehiivShows the initial setup process including template selection, color theme configuration, and font pairing for a new beehiiv website.Beehiiv· Build a lead-capture landing page
1:041:15Managing default pages and SEO settingsDemonstrates how to navigate default pages like the homepage and archive, replace placeholder data, and access SEO settings for individual pages.Beehiiv· Build a lead-capture landing page
2:190:39Using the Layers tab to rearrange componentsShows how to use the layers panel to drag and drop components to change their visual order on a page.Beehiiv· Build a lead-capture landing page
2:581:05Designing models and global elementsCurrentWalks through the models tab for designing pop-ups (like sign-up forms) and editing global elements like headers and footers.Beehiiv· Add an opt-in popup
4:031:58Inserting layout sections and widgetsDemonstrates how to insert sections, containers, and widgets (like pricing cards or sign-up forms) into a page layout.Beehiiv· Build a lead-capture landing page
6:011:16Creating reusable component templatesShows how to save a customized component or an entire section as a reusable template for future use in the website builder.Beehiiv· Use / customize email templates
7:260:26Saving and publishing the websiteDemonstrates the difference between saving a draft and publishing changes to the live website.Beehiiv· Build a lead-capture landing page
Watch “How to use the beehiiv Website Builder (Beta)” →

Add an opt-in popup

2:581:05Designing models and global elementsCurrentWalks through the models tab for designing pop-ups (like sign-up forms) and editing global elements like headers and footers.beehiiv
8:001:03Setting up Beehiiv Subscription PopupsA brief walkthrough of the subscriber pop-up interface and how it appears to users to drive newsletter conversions.Austin Armstrong