Skip to content

Documentation: Using the HubSpot QuickEmail Module on a Page (Drag and Drop)

This documentation details the use of the HubSpot "QuickEmail" module to integrate a customizable email field with a submit button on your web pages. You will learn how to add, configure, and customize this module to enhance user engagement.

Prerequisites

Before you begin, make sure you have the following:

  • Access to HubSpot: A HubSpot account with necessary permissions to edit pages.
  • HubSpot QuickEmail Module: Installed and ready to use on your pages. Verify that this module is available in your HubSpot account.

Features of the QuickEmail Module

The QuickEmail module is fully customizable with numerous options, including:

  • Sizes: Adjust the size of the email field and submit button.
  • Alignment: Position the module left, center, or right on the page.
  • Spacing: Define space around the module for better layout.
  • Borders: Add borders with customizable thickness and colors.
  • Fonts: Choose from different fonts for button and email field text.
  • Text and Background Colors: Customize text and background colors to match your branding.
  • Icons (+1700): Integrate predefined icons to enhance the user interface.
  • Custom Image: Use a custom image for the submit button if needed.
  • Thank-You and Error Messages: Configure custom message boxes for validation responses.

Steps to Use the QuickEmail Module on a Page (Drag and Drop)

Follow these steps to integrate and customize the QuickEmail module on your web pages:

Step 1: Access the Page Editor

  1. Log in to your HubSpot account.
  2. In the dashboard, select "Marketing," then "Website," and finally "Pages."

Step 2: Select or Create a Page

  1. Choose an existing page to edit by clicking on its name or create a new page by clicking "Create a new page."
  2. Give your page a name and select a template if necessary. Click "Create."

Step 3: Add the QuickEmail Module with Drag and Drop

  1. Once in the page editor, locate the section where you want to integrate the QuickEmail module.
  2. Drag the "QuickEmail" module from the "Modules" sidebar to the desired location on the page.
  3. Release the mouse to drop the module. It will automatically adjust to the existing layout.

Step 4: Configure and Customize the Module

  1. Click on the added QuickEmail module to open its configuration options.
  2. Configure the email field and submit button by entering necessary options: button text, email field placeholder, etc.
  3. Use style options to adjust the module's appearance:
    • Choose size, alignment, background, and text colors.
    • Define borders and spacing according to your preferences.
    • Select an appropriate font for the text.

Step 5: Preview and Publish

  1. Preview the page to see how the QuickEmail module will appear to visitors.
  2. Ensure all configurations and customizations are correct.
  3. Click "Publish" to make the page accessible to the public.

Support and Additional Resources

For more information on using the QuickEmail module or for further assistance:

  • Refer to the official HubSpot documentation or specific QuickEmail module guides.
  • Contact us via email at contact@comconception.fr