If you’re a Showit user looking to elevate your email marketing game, integrating Flodesk forms into your website is a game-changer. Flodesk’s beautifully designed forms combined with Showit’s customizable templates can help you grow your email list effortlessly. In this guide, we’ll walk you through the process of adding a Flodesk form to your Showit template, ensuring a seamless experience for both you and your site visitors.

Why Integrate Flodesk with Showit?

Flodesk is known for its intuitive design and user-friendly interface, making it a favorite among creatives. When paired with Showit’s drag-and-drop website builder, you get a powerful combination that allows for:

• Seamless Design Integration: Maintain consistent branding across your website and email campaigns.
  
• Enhanced User Experience: Provide visitors with easy-to-use sign-up forms.
  
• Efficient Email Marketing: Automate your email sequences and manage subscribers effectively.
  

Read More: Flashing Callout Words Effect in Showit

Step-by-Step: Adding a Flodesk Form to Your Showit Template

1. Create and Customize Your Flodesk Form

• Log in to Flodesk: Navigate to the ‘Forms’ section and click on ‘New Form’.
  
• Choose Form Type: Select ‘Inline’ for embedding directly into your page or ‘Popup’ for a modal window.
  
• Design Your Form: Customize the form’s appearance to match your brand. You can adjust fonts, colors, and fields.
  

2. Obtain the Embed Codes

• Click ‘Embed’: After customizing, click the ‘Embed’ button.
  
• Copy Codes: You’ll receive two codes: a ‘Header code’ and an ‘Inline code’. Both are essential for the form to function correctly.
  

3. Add the Header Code to Showit

• Open Showit: Navigate to the page where you want the form.
  
• Access Page Settings: Click on the page name to open settings.
  
• Insert Header Code: Under ‘Advanced Settings’, paste the ‘Header code’ into the ‘Custom Head HTML’ box.
  

Learn More: Nested Dropdown with Image Background in Showit

4. Embed the Inline Code

• Add Embed Code Widget: In the Showit editor, add an ‘Embed Code’ box to the desired location on your page.
  
• Paste Inline Code: Click on the box and paste the ‘Inline code’ into the ‘Custom Code’ section.
  
• Adjust Size and Position: Resize and position the box to fit your design.

5. Test and Publish

• Preview Your Page: Ensure the form appears correctly and functions as intended.
  
• Test Submission: Submit a test entry to verify that the data is captured in Flodesk.
  
• Publish: Once satisfied, publish your page to make the form live.
  

Read More: How We Design and Build Showit Templates That Sell

Tips for a Smooth Integration

• Consistent Styling: Match the form’s design with your website’s aesthetics for a cohesive look.
  
• Mobile Responsiveness: Ensure the form displays correctly on mobile devices by adjusting the embed box in Showit’s mobile view.
  
• Avoid Multiple Forms: Embedding multiple Flodesk forms on a single page can cause conflicts. Stick to one form per page.
  

Common Questions

Q: Can I use Flodesk forms in Showit’s blog posts?
A: Yes, but only if you’re on Showit’s Advanced Blog plan, which allows custom code in blog posts.

Q: What if my form doesn’t display correctly?
A: Ensure both the ‘Header code’ and ‘Inline code’ are correctly placed. Also, check for any conflicting scripts on the page.

Q: Can I customize the form’s appearance further?
A: Absolutely! You can style the form within Flodesk and further adjust its placement and size within Showit.

Final Thoughts

Integrating Flodesk forms into your Showit website is a straightforward process that can significantly enhance your email marketing efforts. By following the steps outlined above, you can create a seamless experience for your visitors and grow your subscriber list effectively.

Remember, the key to successful email marketing is not just about collecting emails but providing value to your subscribers. Ensure your content is engaging, relevant, and consistent to keep your audience interested and invested in your brand.