Collect feedback from your audience, convert visitors into leads and offer promotions with Tally's beautiful popup forms. It’s free, up and running in seconds, and connects to all your favorite tools.
Popup forms are available for free to all Tally users
Create a popupPopup optionsOpenPositionWidthHide form titleAlign content to the leftDark overlayEmojiHide on submitShow only onceDon't show after submitCustomize your popupCustomization optionsCustomize popups with a custom domainAdd the popup to your websiteCopy the embed codeOpen on button clickSave website page and query parameters with hidden fieldsUse JavaScriptAdd a popup form to your Notion site
Create a popup
Start by creating a form and publishing it. You can start from scratch or choose one of our pre-made templates.
Publish your form, go to the Share tab and click Popup.
Popup options
The configuration panel lets you edit your popup, and on the right you will get a preview of how your popup will look like.
If you close the embed panel before copying the code, you will lose your embed settings. When you change popup options, you always need to click Get the code to get the latest version.
Open
Choose when you want your popup form to appear on your site.
- On page load: the form will appear immediately when the page opens.
- After elapsed time: the form will appear after a specified amount of seconds.
- On exit intent: the form will appear when the visitor moves their cursor to the top bar of the browser window (not supported on mobile).
- On scroll: the form will appear when the visitor has scrolled a specified % down the page.
- On button click: the form will appear when a visitor clicks a button on your website.
Opening the popup on exit intent is not supported on mobile devices.
Position
Choose whether to display your popup in the center of your website or in the bottom right corner.
Want to display your pop-up in the left corner? You can do this by adding this CSS to your website (where you embed the popup):
<style> .tally-popup { left: 20px !important; right: auto !important; } </style>
Width
You can change the width of the popup by adding the desired width in pixels.
Hide form title
You can choose to hide the form title in your popup.
Align content to the left
Use this option when you want to align the content of your popup to the left. This is especially useful when you increase the width of your form.
Dark overlay
Add a dark overlay on top of the content of your website to increase the visibility of your popup.
Emoji
Add an emoji attention seeker to your popup, and choose from our list of animations. Just type an emoji, and check the preview to see the animation in action.
Hide on submit
Hide the popup when a respondent has submitted your popup form. You can decided when the popup should close after clicking the closing button. If you want the popup to close immediately after form submission, choose 0 seconds.
Show only once
Turn this option On, if you want your visitors to see the popup only once and then never again.
Don't show after submit
Turn this option On, if you want your visitors to see the popup until they submit the form and after submit never again.
Customize your popup
Customization options
You can fully control the design of your forms with the design options, available in the form builder. Read more about Tally’s customization options here.
Customize popups with a custom domain
Forms hosted on a custom domain can be customized by injecting Custom CSS or using the code injection box. Afterwards, paste your custom domain form URL in the
Custom domain field.
Add the popup to your website
There's several ways to add to a popup to your website. You can simply copy the embed code and add it to your website's HTML code, or as a developer you can use JavaScript.
Copy the embed code
- Click
Get the codeand copy the embed code.
- Paste the copied snippet below in your site's head or body HTML code.
Open on button click
When opening your popup on a button click, you need to instruct the Tally snippet to open the popup when clicking on a specific button. This requires an extra step:
- Copy and paste the snippet into your website's HTML code.
- Add the custom `data-tally` attributes to the button or any other clickable element.
or
2. Alternatively, if you cannot modify the button's HTML, you can open the popup by adding a link with a custom URL hash to text or a button on your site.
Example: https://yourwebsite.com#tally-open=wL58yn&tally-emoji-text=👋&tally-emoji-animation=wave
Save website page and query parameters with hidden fields
The website's page and all query parameters will be automatically forwarded to the Tally form and could be saved using hidden fields. For example, if your page's URL looks like the one below and you have hidden fields for
originPage, ref and email, you will see originPage=/register, ref=downloads and email=alice@example.com in your form submissions.https://company.com/register?ref=downloads&email=alice@example.com
Use JavaScript
Developers can add popups to a website using JavaScript. It comes in handy when you want to define your own business logic on when to open a certain popup. Copy the code examples and share them with your developer.
