Beehiiv: Creating reusable component templates

beehiiv·Jan 2025

Demo summary

Shows how to save a customized component or an entire section as a reusable template for future use in the website builder.

Step-by-step

Hover over the component you want to save and click the drag icon to select it
Click the 'Save as template' icon next to 'Actions' in the right sidebar
To reuse, click 'Insert' and select 'Blocks' under 'Templates' in the left sidebar
Select 'Mine' to view and insert your previously created templates
To save an entire section, select the specific section in the 'Layers' panel first before clicking 'Save as template'

Options

Save individual components (buttons, post layouts, text)
Save entire sections (groups of components)
Configure alignment, colors, font, and padding in the right sidebar

Watch out for

You must select the specific section in the layers panel specifically if you want to save a group of components rather than a single one

Tips

Use the text component for normal paragraph text instead of using it as a heading

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 elementsWalks 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 templatesCurrentShows 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)” →

Use / customize email templates

0:232:57Create and style a newsletter template in beehiivDemonstrates how to create a new template, add content components like logos and headers, and use the Basic and Advanced style tabs to customize fonts, colors, and layout.beehiiv
3:490:17Save an existing post as a templateShows how to use the 'save as template' icon within the post editor to capture the content and styling of a current draft for future use.beehiiv
6:011:16Creating reusable component templatesCurrentShows how to save a customized component or an entire section as a reusable template for future use in the website builder.beehiiv