Create custom modules to use on quote templates

If you're a Super Admin, you can opt your account into the Custom Coded Modules for Quotes beta.

Create custom modules for quote templates to customize appearance, content, and logic. Custom modules can be used to tailor quotes to your buyers, based on the needs of your business.

Before you get started

Before you begin working with custom modules, understand what steps should be taken ahead of time, as well as the limitations of the feature and potential consequences of using it.

Understand requirements

If you're unfamiliar with React, HTML, JavaScript, and CSS, work with a developer to create custom modules.

Limitations and considerations

• It isn't possible to create or add custom coded modules to a quote using the API. API users can select templates that have custom modules included on them.

• Only one drag-and-drop area exists. Complex page layouts, such as a single module as an aside for the entire quote, isn't supported.

• You must use the fixed container of the quote. The site header HTML can be updated to modify the width of the drag-and-drop area.

• Use custom CSS to hide the status bar at the top of quotes.

Common use cases

Custom modules offer flexibility to customize quote templates in several ways. Review the following common use cases.

Create a line items table module

Build a custom line items table to match your business needs. For example:

• Add sections: display line items in sections based on properties. For example, separate sections for products and services or one-time and recurring line items.

• Custom totals module: display a summary of the quote or custom calculations.
• Display a billing schedule: create a schedule based on line items in the quote.

• Optional line items: display line items as optional. Buyers can update the quote and deal amount using serverless functions.

• Ramps: display line item price changes over time set by a predefined schedule. For example, a product that costs $5,000 in the first year, $10,000 in year 2. You could also set a line item to discount for the first 3 months, before it increases to the non-discounted price in the fourth month.

  Please note: custom coded modules can't manage the billing implications of ramps outside of respecting billing start dates.

Create a conditional terms and conditions module 

Display different terms or content based on quote data. For example, you can show region-specific legal language based on a buyer’s country or include product-specific terms when certain line items are added.

Create a parties section

Hide the standard parties module and create a custom module with your own branding and formatting. You can also integrate custom data such as shipping addresses or child company properties.

Create a custom navigation menu

Add a navigation menu to help buyers navigate long quotes.

Require acknowledgment of sections

Add interactive custom coded modules with checkboxes or buttons for buyers to acknowledge specific modules before accepting the quote.

Please note: this requires a separate script in the site header HTML to disable the acceptance until checkboxes are acknowledged.

Style modules

Create modules with custom image formatting, shadows, rounded corners, branding, and more.

Create custom modules

Learn more about creating custom modules.