Attention
This type of order form can no longer be created. We are migrating all existing order forms of this type to our new order form. If you still have order forms of this type, you can continue to use them.
The responsive order form automatically adapts to the screen size of the respective device, unlike the classic order form. You also determine the arrangement of the order form elements yourself with the responsive order form. This provides your customers with an optimal user experience. Google also prefers websites with responsive design and takes this into account for ranking in search results.
Set up responsive order form
Step-by-step guide: set up responsive order form
-
In the vendor view, go to account > order forms and click the Create responsive order form button.
-
You will now see the order form editor, where you can resize elements as you wish. The left column contains all the elements that you can select, drag to the right, and place.
-
To edit an element, click the pencil icon on that element. For example, in the header image element, you can select an already added header image. If you haven't uploaded one yet, you can do so under account > images by clicking Add new image. Choose order form header as the image type.
-
To name the order form, click Settings in the left column. In the window that opens, enter a name.
-
Here you can also select a custom favicon. If you haven't uploaded one yet, follow the same instructions as in step 4, but choose order form favicon as the image type. If you do not make a selection here, the Digistore24 logo will appear in place of the favicon.
-
The custom CSS code field allows web designers to further customize the order form. Important note: Only CSS can be modified – HTML and JavaScript cannot be modified in the CSS field.
-
When you have arranged and set all the elements to your liking, click the Save button.
-
If you click Preview in the left column, your responsive order form will be displayed.
You have now successfully set up your responsive order form – you just need to link it to one of your products.
Step-by-step guide: link responsive order form to your product
-
In the vendor view, go to account > products.
-
Click the pencil icon of the product you want to link to your newly created responsive order form.
-
Switch to the Order form tab.
-
Scroll down to the Order form window. Select your newly created order form here.
-
Finally, click Save.
Further notes:
-
You can position the guarantee element under the payment methods element. The customer will then see a guarantee seal that corresponds to the return policies you set under settings > return policy by clicking Create return policy for the respective product.
-
The texts of the order forms are product-specific and are set in the individual product settings.
-
The header of the responsive order form is optimized for conversion. You can change it, but keep in mind that it contains important conversion elements.
-
Images for testimonials as well as product images, favicons, etc., are uploaded under account > images.
Customize order form for a product
Once you have set up your order form, you can customize it for a specific product as needed.
Step-by-step guide
-
In the vendor view, go to account > products.
-
Click the pencil icon of the product whose order form you want to edit.
-
Switch to the Order form tab.
-
Select the appropriate product image for your order form.
-
In the Product description for order form and Product description for order confirmation page fields, you can now enter the respective descriptions.
-
In the field for the order confirmation page, you can use the placeholder [THANKYOU_URL], which will display the URL of the order confirmation page to your customers. This is also included in the order confirmation email. If you leave the field for the product description on the order confirmation page blank, the description from the order form will be inserted there.
-
In the Technical support window, you can provide your support email address and usage instructions for the customer. This includes, for example, how the customer can access their product. These instructions will be displayed to the customer on the order confirmation page and in the order confirmation email after payment. Here, too, you can use the placeholder [THANKYOU_URL].
-
In the Order form window, you can make specific settings for querying contact data. You can also select a custom order form and add a social proof bubble.
-
Finally, click Save.
Add custom input fields to the order form
If you want to request information from your customers that is not available by default on your order form, you can add additional custom input fields (e.g., year of birth, additional requests). Follow this guide.