The Mad Lib element in Experiences by Jebbit enables you to combine form fields and text within a single narrative, transforming traditional data capture into an engaging, conversational experience. This makes forms feel more personal, intuitive, and less intrusive for your audience.
Before you begin
Confirm the data points you want to collect (e.g., name, location, preferences).
Plan how you want to structure the conversation to maximize user engagement.
Add the mad lib element
Locate your desired experience from the workbench.
Via the Editor, click Add Elements.
Select Mad Lib to add it to your screen.
By default, the Mad Lib element includes some text and a couple of different inputs.
Add and remove content
Click directly on the Madlib input (it will highlight), then click the Trash Can icon that appears to the left of the Canvas to remove an input.
To add different inputs, click within the Mad Lib element (you can be sure you’ve clicked on it correctly when you see the title ‘Mad Lib’ appear above the highlighted selection). Then, click on the green plus button that appears at the bottom of the element.
To edit the elements within, simply click on the element and customize it in the left Editor Window (the same way you customize any element).
Add form elements like:
Dropdown menus (e.g., favorite color).
Text inputs (e.g., first name).
Email fields or other standard inputs.
To create line breaks inside a Mad Lib, just press Enter on your keyboard where you want the break. This behaves like a regular text editor, allowing for flexible layout formatting.
Rearrange content
To move/rearrange existing inputs, click on the element you wish to move, and use the up/down arrows that appear to the left of the Canvas.
For example, you could build a sentence like:
“Hi there [First Name]! We want to send you something in your favorite color: [Favorite Color]. What state are you in?”
Customize the layout
These adjustments help you tailor how inputs and text appear across screen sizes.
Click on the Mad Lib element to ensure that it is highlighted, and then use the controls in the Editor Window on the left.
Width: Adjusts the entire width of the Mad Lib element.
Input Height: Controls height of all input fields.
Input Width: Controls width of all input fields.
Element Spacing: Controls space between each text/input element.
Line Spacing: Adjusts vertical spacing between lines.
Text: Update the text within the Madlib by adjusting its Font, color, size, etc.
Spacing: Add space to the top, bottom, left and right of your Madlib.
Name your form elements
You can now assign unique names to each form element for clearer analytics reporting:
Click on a form element.
In the left-hand editor, assign a meaningful name (e.g., “Favorite Color” or “Favorite Cheese”).
These names appear in your reports and help segment responses.
Tip: You can now use the same label (like “Select”) multiple times, as field naming is independent of the visible label.
Next steps
Preview your Mad Lib to confirm layout and flow.
Test data entry to ensure input fields function correctly.
Launch your experience to capture leads using a more engaging format.
FAQ
What are the main use cases of a Mad Lib experience? Can you share examples?
The Mad Lib feature is designed to easily collect a LOT of data on a single screen, without the user feeling like they are filling out a standard form. It is often tied to creative use cases to increase user engagement and lead capture rates, for instance, like having someone write a letter to themselves.
Examples:
What elements can be added inside a Mad Lib element?
The Mad Lib element is a container in which both Forms (dropdowns, email, and other ‘type-in’ inputs) and text elements can be added. You can add any form elements into a Mad Lib, as well as new text elements.