With the HTML-widget you add text and images to your digital forms using HTML.
No MoreApp account yet? Sign up here.
You can not work with placeholders in the HTML-widget, but with static text, links and images.
1. Adding text
You can add text to your digital forms using the HTML-widget, such as general information, terms & conditions and certificates. With the HTML-widget you can use any HTML code. Add the desired text in between this HTML code:
If you want to adjust the size you can adjust the number behind the h:
1 = biggest and 6 = smallest
If you would like to add the text in a bold letter type then the HTML code is:
You can also add text in italic, to do so you use:
<p style="font-style: italic;">TEXT</p>
If you have a preferred font style you would like your text to be in, you can change the font to your desired style. To do so you will need to use the following code:
<font face="PREFERRED STYLE"<p>TEXT</p>
For example, if you would like to use a Times New Roman typeface, this is the code:
<font face="Times New Roman"<p>TEXT</p>
2. Adding bullet points
You can also add bullet points in the HTML-widget. You can use bullet points to portray examples or options. Use this HTML code for bullet points:
<p><ul style="list-style: inside disc"> <li>TEXT</li> <li>TEXT</li> <li>TEXT</li>
3. Adding an image
You can also add an image using this widget, you can use this option for example for your company logo. Please make sure that you have a URL of the image you would like to add. Once you have the URL of the image, use this HTML code:
<div style="text-align: center"><img src="IMAGE URL" width="660" height="100" style="max-width: 100%"></img></div>
As you can see you can customise the width and height of the image in the HTML code.
4. Adding a URL link
You can also add a URL link using the HTML-widget. Use the following code for this option:
<a href="URL LINK">TEXT</a>
You can add a text introducing the URL link, for example:
To achieve this design of having a text above the URL link, you use the following code:
<center><p>Love Digital Forms!<br><a href="https://moreapp.com/en/">Sign up here!</a></p></center>
As you can see you can use this code to center the text:
5. Adding a phone number or email address
6. Adding colors
You can add colors to the HTML-code. In order to do this, you will need the hex code of your desired color.
- Background color
You can add a background color for your text in the HTML-widget, using this code:
<div style="background-color:HEX COLOR CODE"><p>TEXT</p>
- Text color
To add a color to your text, you will need to use the following code:
<div style="color:HEX COLOR CODE"><b>TEXT</b>
- Image background color
You can also add a background color to an image in the HTML-widget. Use this HTML code for this option:
<div style="float:POSITION;background-color:HEX COLOR CODE"><img src="IMAGE URL" style="margin:5px" width="32" height="32"></div>
7. Adding an iFrame
<iframe src="https://moreapp.com/assets/MoreApp-Privacy-Policy.pdf" width="100%" height="300"> <p>Your browser does not support iframes.</p></iframe>
8. Adding a stripe
9. Embedding a form on your website
<p align="center"><iframe src="PASTE LINK HERE" width="90%" height="600" style="border:1px solid lightgrey;"></iframe></p>
Click here to go to the Help Center post.
Thanks for using MoreApp. Keep in mind that you can search for other possibilities of HTML codes, the codes mentioned here are just a few examples. MoreApp does not give other support on HTML coding.
Learn more about the possibilities of customising your forms with color themes!
Do you want to be the first one to see our latest tutorials, go to our YouTube Channel and hit the Subscribe button!