With the multi-step order box (MSOB), you can embed an order form directly on your sales page.
Important
In the European Union (EU), it is legally required to provide an accessible version of the order form.
Digistore24 automatically provides accessible versions for most order form types. However, this does not apply to the MSOB, as you embed it directly on your own website. In this case, you are responsible for ensuring accessibility.
If you don't want to handle the accessibility implementation yourself, it's better to use a different type of order form instead. You can learn more about this here.
Preparing images
Images must be approved by Digistore24. If you want to use images, such as background or header images, you can upload them in advance. You can also add images in the MSOB, but you can only use them once they are approved.
Templates
There are templates with different display variants. When creating the MSOB, select a template that fits well into the sales page. The display variants are helpful for split tests, which you can use to check and optimize your conversion rate.
Create and publish MSOB
Follow these steps:
- In the vendor view, go to Product setup > Order forms.
- Click on create multi-step order box.
- Click the button select template on a template.
- Click on a variant and then click create multi-step order box. A window will appear.
- Enter a name and click create. The MSOB will be created and displayed.
The MSOB is displayed as a web application in the same browser tab. It has its own menu items in the top bar:
- The MSOB by default displays a desktop version of the page. Click the screen icons
to switch between display types.
- Click the save button to apply changes.
- Click the publish button to make changes visible to prospects. You cannot undo the publication. Instead, make changes as needed, review them in the preview, and then publish again.
- Click the exit button to return to Digistore24.
Set default product
After setting a default product, the MSOB will always be displayed with the properties of the default product when opened. This way, you always have a real product example when editing the MSOB. You can still assign the MSOB to different products.
- Click the settings button in the top bar and then product. The settings sidebar will appear.
- Select a product. The change will take effect immediately and be visible in the MSOB.
- Click the save button in the top bar to apply changes without publishing them.
Set preview & check publication status
In the preview, you can see how the MSOB would look to visitors in its current form and whether the current form has already been published.
- Click the preview button in the top bar. A window will appear.
- Select a product and a language for the preview.
- Click the preview button. The preview will open in a new browser tab. If the preview differs from the currently published version, a notice will appear. Close the tab when you're done.
- Click the save button in the top bar to apply changes without publishing them.
- Click the publish button to apply and directly publish changes.
Set background
You can set a background for the area around the MSOB. You can first select an image and/or background color and then overlay a video.
- Click the settings button in the top bar and then background. The background sidebar will appear.
- Select the image option under background type to fill the page background with an image or color.
- Click the image icon under background image to select an image. The uploaded images window will appear.
- Select how the image should be positioned under image position.
- Select a color under overlay color to overlay the background. Use a slider in the color selection window to determine the transparency of the color. For example, you can overlay the selected image with a white veil so that it is still visible but not too distracting.
- Select a color under background color to be placed under a selected image. This is useful if your selected image does not cover the entire screen and you want to adjust the background color. With the overlay color, you can further influence the shade of the background color.
- Select the video option under background type to run a video over the entire background page.
- Enter the web address of a YouTube video under YouTube URL.
- Select what happens after the video under end action:
- Select loop to have the video start over continuously.
- Select hide video to hide the video after one run. If you have selected a background color and/or image, it will be displayed.
- Select redirect to URL to display a selected website after the video run. The redirect URL field will appear below, where you can enter the web address of the desired redirect page.
- Click the save button in the top bar to apply changes without publishing them.
Set typography
You can set the font and font color for headings, texts, and links.
- Click the settings button in the top bar and then typography. The typography sidebar will appear.
- Select fonts for headings and content (texts).
- Select colors for headings, content (texts), and links.
- Click the save button in the top bar to apply changes without publishing them.
Set language
Texts provided by Digistore24 are displayed in the language of the MSOB. The default language is German. You can change the default language and/or add additional languages for multilingualism. In multilingual MSOBs, page visitors can change the displayed language using the language selection component.
- Click the language selector in the top bar and then manage languages. A window will appear.
- Select the language in which standard texts of components and the preview should be displayed under default language.
- More languages that you can add are displayed:
- You can remove languages by clicking the trash icon.
- You can add removed languages again by clicking add language.
- Click the save button to apply changes.
Edit language
You can translate self-written texts in all set languages.
-
Click the language selector in the top bar and then the language you want to edit.
Note
When editing non-default languages, you cannot make layout changes or add or remove components. Main menu items will be grayed out. Switch back to the default language to access them again.
-
Texts that you can edit are displayed with a green frame:
- Click directly into the text of a free text field of a component to edit it.
-
Click the gear icon on headings. A sidebar will appear where you can edit the heading.
- Click the save button in the top bar to apply changes.
-
Add the language selection component so that page visitors can change the MSOB language.
Note
If you want multilingualism (e.g., because you link the MSOB in multilingual sales pages) but do not want a language selection in the form itself, you can omit the language selection component. You can use the GET parameter for languages ?language= to link the MSOB in the desired language: