A Product Form is a specification of the product configuration interface. With CodeCPQ Custom Product Forms, you can define and design configuration experiences that dynamically adapt to user input. Easily and flexibly, both for fron-end and back-end users.
Freely designable control elements for flexible user forms
Add a control element to your CodeCPQ Custom Product Form even with simple
Python functions, or with elaborate code. Add the arguments, generate the form, and see the control element being displayed. Control elements include text fields, drop-down menus, image selectors, and many more.
Integrated custom CSS
Style your CodeCPQ Custom Product Forms with custom CSS. Specify the desired effects directly from the back-end: Just add the CSS code to the respective snippet page
and generate the form.
Front-end and back-end use
With a CodeCPQ Custom Product Form, sales offers can be created from the front-end for website visitors as well as the back-end for the own sales staff. The front-end version can differ from the back-end version.
Aligns with the product logic
The CodeCPQ Customizable Product Form can follow the product logic, thus creating a natural and consistent connection between product data, technical or organizational rules and configuration experience.
Dynamic display of text and control elements
CodeCPQ Custom Product Forms display information text and control elements dynamically, according to the product know-how and the user configuration on the front-end. Texts and control elements update on each
response cycle. Use this feature to guide the user through the product configuration with information texts that only display at certain steps of the configuration or the checkout. For example, notify the user that the elected configuration is tailor-made, and therefore the product cannot be returned.
For re-use across several products
Each Custom Product Form can be assigned to as many products as you want.
Saves costly front-end user support
Thanks to the flexibility of the Custom Product Forms, costly (live) sales consultation during the configuration gets replaced by efficient dynamic text support in the front-end user form.
Facilitates the configuration by phone for sales representatives
The custom input form helps address and capture all required technical and administrative topics during the configuration process, e.g., when performed by a sales representative in a phone call with the customer. In this regard, CodeCPQ supports the sales process like scripting software for call centers and outbound sales.
Highly flexible, Python code based input form instead of Odoo XML form generation
The backend user can precisely control the content and structure of the product configuration input form through the backend by using Python program code. The input form generated in this manner is by far more customizable than the forms that can be generated by Odoo via XML files.
FAQ: CodeCPQ Custom Product Forms.
Read answers to frequently asked questions. Or discover more with our free trial.
In the CodeCPQ back-end, a Python code snippet called "Build Input Form" determines the look of the dynamic product configuration form. In this snippet, add the desired control element via a simple Python function or any more elaborate code that defines it. Obviously, that requires at least some Python programming skills.
CodeCPQ offers a wide range of control elements, such as:
- Input field for an integer
- Input field for a single-line text
- Input field for a multi-line text
- Date selector
- Color selector
- Checkbox
- Dropdown element for text options
- Selector element with custom images
Add custom CSS to the product form by adding CSS code to the code snippet in
the backend tab "CSS". Whatever CSS effects you specify there get applied to the form. Custom classes can
also be added, i.e., style can be defined for specific
elements.
Yes. Once the user of the product configuration form has made an input, the server processes the input and then refreshes the form in the browser. To refresh the form, it executes the Python code in the Build Input Form snippet.
Case distinctions (like IF structures) can be used in the code to determine which inputs should be queried in the updated form, and which should not.
Yes. There are two types of images you can add to the Custom Form:
- Static images are prebuilt. You make them visible or unvisible or can exchange them.
- Dynamic images are built automatically build and adapted depending on parameters already entered by the end user.
You can also display static and dynamic images in selection controls.
No. The structure of the input form can dynamically adapt to the information already entered and thus follow the product logic.
The relatively simple Python program code entered in the backend causes all the controls of the input form, as well as all the texts, images, drawings and selection fields to change order, change labels, adjust the choices displayed, appear or disappear altogether. In short, the input mask is programmable and therefore highly flexible.
Want to learn more about Custom Product Forms?
Sign up for the free trial now and start exploring.