Your Cart

Loading your cart...

Product added to cart!
0
showit embed convertkit form

How to Add a ConvertKit Form to Showit: A Step-by-Step Guide for Creatives

Showit Guide

July 24, 2025

If you’re a Showit user aiming to grow your email list and deliver lead magnets seamlessly, integrating a ConvertKit form into your site is a game-changer. This guide walks you through the process, ensuring your opt-in forms are both functional and beautifully aligned with your brand.

showit embed convertkit form

Why Integrate ConvertKit with Showit?

Combining Showit’s design flexibility with ConvertKit’s robust email marketing tools allows you to:

  • Grow your email list by capturing visitor information directly on your site.
  • Deliver lead magnets like PDFs or checklists automatically upon sign-up.
  • Maintain brand consistency by designing forms that match your site’s aesthetics.

Step 1: Upload Your Freebie to Showit

Before setting up your form, upload your lead magnet (e.g., a PDF guide) to Showit’s media library.

Steps:

Screenshot 2025 07 24 at 12.36.50 PM
  1. Navigate to the Site tab in Showit.
  2. Click on Media Library.
  3. Upload your freebie file.
Screenshot 2025 07 24 at 12.35.57 PM

Read More: Edit Hidden Text on Hover in Showit

Step 2: Design Your Opt-In Canvas in Showit

Create a dedicated space on your site for the opt-in form.

Tips:

  • Use a Site Canvas if you plan to reuse this form across multiple pages.
  • Design elements like headings, images, and descriptions to entice visitors.
  • Ensure the canvas is set to Window Height for a full-screen effect.

Step 3: Create and Customize Your ConvertKit Form

Now, set up the form in ConvertKit that will capture user information.

Steps:

image
  1. Log in to ConvertKit.
  2. Go to Grow > Landing Pages & Forms.
  3. Click + Create New, then select Form.
  4. Choose Inline as the form type.
  5. Select the Clare template for a minimal design.
  6. Rename the form for easy identification (e.g., “Freebie Opt-In”).
Screenshot 2025 07 24 at 12.52.08 PM
Screenshot 2025 07 24 at 12.50.21 PM
Screenshot 2025 07 24 at 12.49.57 PM
Screenshot 2025 07 24 at 12.55.16 PM
Screenshot 2025 07 24 at 12.57.10 PM

Customization:

Screenshot 2025 07 24 at 1.03.49 PM
  • Add a First Name field by clicking the + icon.
  • Rearrange fields by dragging them into the desired order.
  • Change the button text to something action-oriented like “Download Now”.
  • Adjust colors to match your brand.

Learn More: Vertical Accordion Effect in Showit

Step 4: Configure Form Settings in ConvertKit

Determine what happens after a user submits the form.

Options:

  • Success Message: Display a thank-you message upon submission.
  • Redirect to URL: Send users to a specific page, like a thank-you or download page.

Incentive Email:

  • Enable the Incentive Email to send the freebie.
  • Edit the email content to include a download link or further instructions.
  • Use the previously copied URL from Showit’s media library as the download link.

Step 5: Embed the ConvertKit Form into Showit

Integrate the form into your Showit site using the embed code.

Steps:

Screenshot 2025 07 24 at 1.08.27 PM
  1. In ConvertKit, click Publish on your form.
  2. Copy the JavaScript embed code.
  3. In Showit, select the canvas where you want the form.
  4. Click the Embed Code icon.
  5. Paste the copied code into the box and click Save.(learn.showit.com)
Screenshot 2025 07 24 at 1.15.52 PM
Screenshot 2025 07 24 at 1.12.36 PM

Read More: Convert SVG Icons for Use in Showit

Step 6: Test and Optimize

Ensure everything works smoothly and looks great on all devices.

Test and Optimize

Checklist:

  • Preview the form on both desktop and mobile views.
  • Submit a test entry to verify the incentive email and download link.
  • Adjust spacing and alignment as needed for a polished look.

Bonus: Set Up a Welcome Email Sequence (Optional)

Engage new subscribers with a series of welcome emails.

Set Up a Welcome Email Sequence (Optional)

Steps:

  1. In ConvertKit, go to Send > Sequences.
  2. Click + New Sequence and name it (e.g., “Welcome Series”).
  3. Add emails to the sequence, setting delays as desired.
  4. Publish the sequence.
  5. Create an Automation:
    • Trigger: Joins a Form (select your opt-in form).
    • Action: Add to Sequence (select your welcome series).
    • Activate the automation.

Common Questions

Q: Can I style the ConvertKit form to match my site’s fonts?

A: ConvertKit’s inline forms have limited styling options. For advanced customization, you can use custom CSS within Showit.

Q: What if the form doesn’t appear in Showit’s preview?

A: Sometimes, embedded forms may not display in Showit’s preview mode. Test the live site or use an incognito window to check.

Q: Is it necessary to use the Clare template in ConvertKit?

A: While not mandatory, the Clare template offers a minimal design, making it easier to style within Showit.

Final Thoughts

Integrating a ConvertKit form into your Showit site enhances user experience and streamlines your email marketing efforts. By following these steps, you ensure a cohesive design and efficient lead capture system.

Remember, the key is to test thoroughly and make adjustments as needed to provide the best experience for your visitors.

showit embed convertkit form

Leave a Reply

Your email address will not be published. Required fields are marked *

How To Choose Right Website Template

Marketing

How To Choose Right Website Template

Marketing

How To Choose Right Website Template

Marketing

How To Choose Right Website Template

Marketing

How To Choose Right Website Template

Marketing

How To Choose Right Website Template

Marketing

You May Also Like