ITERAS Ordering forms are responsive (i.e. they adapt to the device they’re viewed on), configurable, dynamic, and easy to integrate into any website. You can configure them under Sales. Here, you can create as many ordering forms as you need.
The forms automatically adjust their width based on the available space.
Explanation of the fields
Form Title: Optional – could be the name of the associated offer, or simply “Web Form” if you only have one.
URL ID: The system assigns an ID automatically, but you can also choose a more descriptive one, such as “annualsubscription”.
Active: Enable this to activate the form.
Approval: There are three options – manual, automatic, or prepayment.
Manual approval requires you to manually approve subscribers before they become active. This is not ideal if users need immediate access to your website after signing up, but useful to prevent spam or harassment sign-ups.
Automatic approval grants access immediately, regardless of payment. We recommend Automatic, as it results in the lowest drop-off rate.
Prepayment approval grants access only after payment is confirmed.
Show prices with VAT: Prices for campaigns are displayed including VAT. If you mainly sell to businesses, you may want to show prices excluding VAT. You can disable VAT display here.
Product choices: Choose the campaign(s) users should be able to select in the form. Add additional campaigns using the “+” icon. You can also choose whether prices should show with or without VAT and whether that info should be stated next to the price.
Fields and layout: Choose which fields appear in the form, whether they are required, and in what order they appear. You can reorder them by dragging the cross icon on the right. If you need fields beyond the default ones, you can create more – see the article on fields for more info.
Fields can also be dynamic, meaning they change based on input in another field. This is set up using the chain icon on the right of each field. Some fields allow helper text, shown beneath the field to guide users. (article is in danish)
Summary: A summary page can be enabled to appear before the payment page. This is especially relevant for campaigns where the price is multiplied by a selected quantity – otherwise, users can’t see the final price before confirming.
Existing subscriber/member: This feature checks if an email address already exists in the system. If so, the form can suggest or require login, so the user doesn’t get registered as a new subscriber but instead reuses their existing account. You can also enable a login link for users to indicate they already have an account.
Send welcome email: Decide whether a welcome email should be sent when a user signs up through this form.
Redirect afterwards to: Enter a URL for a thank-you page to which users will be redirected after signing up. If left blank, the text in the “Thank You Page Template” will be shown instead.
Final message: A message displayed after successful signup – only shown if no redirect is used (see above).
Click “Save” to create your ordering form.
Using the forms
There are two ways to use the form: either embedded in your website via an iframe wherever you want it, or as a stand-alone version. When embedding the form on your site, you can configure your offer on the page around it. Since you can include either one or multiple offers in the same form, you have full flexibility—whether you want to present several offers on a single page or create a dedicated page for each offer.
Stand-alone is the easiest option. It’s simply a link you can click – you’ll find the link in the box on the left. Your logo will appear at the top, provided it has been uploaded under the publication.
The iframe code is found at the bottom of the box on the left. It needs to be inserted into your website – typically a task for a webmaster. You’re always welcome to reach out if you encounter any issues. See below for tips on ensuring it displays correctly.
Height and Width of the iframe. The best way to control the size of the form when inserted as an iframe is to place it inside a container that you control, and then apply
max-width
andmax-height
styling to that container using CSS. The form’s height automatically adjusts to its content, so we recommend not adjusting the height directly—only through the container as described above
Correct display of the form
If the form isn’t displaying correctly, it’s likely due to an incorrect embed. Below are common problems and how to fix them:
The iframe looks odd or has sizing issues: It’s not uncommon for a website to include various CSS files affecting different elements. One of these might have a rule targeting all
iframe
elements, unintentionally affecting the ITERAS iframe.
Use your browser’s developer tools to inspect the iframe and see which CSS rules apply to it and its parent elements. For example, if the iframe isn’t resizing in height, look for rules that limitmax-height
on its container elements.
Styling the iframe content: Due to browser security settings, iframes ignore external CSS rules. Therefore, styles must be added through the customization field in ITERAS. You can either add CSS directly there or link to a CSS file hosted on your own website.
Different styles for different iframes: Use the
cssclass
parameter when generating the iframe. This assigns a CSS class to the<body>
inside the iframe, allowing you to target it with specific styles.