Met de HTML-widget kun je tekst en afbeeldingen toevoegen door aan jouw digitale formulieren.

1. Tekst toevoegen

Je kunt teksten zoals algemene informatie of algemene voorwaarden toevoegen aan jouw digitale formulieren met de HTML-widget. Met de HTML-widget kun je gebruik maken van HTML-code. Om de gewenste tekst toe te voegen vul je deze in binnen de volgende HTML-code:


<p>TEXT</p> 


Als je dikgedrukte tekst wil toevoegen gebruik dan deze HTML-code:


<p><b>TEXT</b></p>


Je kunt ook schuingedrukte tekst toevoegen, gebruik hiervoor deze HTML-code:


<p style="font-style: italic;">TEXT</p>


Als je de tekst in een bepaald lettertype wilt, kun je dit doen met de volgende code:


<font face="PREFERRED STYLE"<p>TEXT</p>



Als je bijvoorbeeld het lettertype Times New Roman wilt gebruiken, doe je dat met deze code:


<font face="Times New Roman"<p>TEXT</p>


2. Opsommingstekens toevoegen

Je kunt ook opsommingstekens toevoegen met de HTML-widget. Opsommingstekens kun je gebruiken om voorbeelden of opties weer te geven. Gebruik deze code voor opsommingstekens:

<p><ul style="list-style: inside disc">
<li>TEXT</li>
<li>TEXT</li>
<li>TEXT</li>



3. Afbeelding toevoegen


Je kunt ook afbeeldingen toevoegen met deze widget, dit is handig voor bijvoorbeeld het toevoegen van een logo. Zorg er voor dat je de URL hebt van de afbeelding die je wil toevoegen. Als je de URL hebt kun je deze HTML-code gebruiken:


<div style="text-align: center"><img src="IMAGE URL" width="660" height="100" style="max-width: 100%"></img></div>


Zoals je ziet kun je de hoogte en breedte van de afbeelding aanpassen in de HTML-code.


4. Een link toevoegen


Het is ook mogelijk om een URL link toe te voegen met de HTML-widget. Gebruik hier de volgende code voor:

 <a href="URL LINK" onclick="window.open(this.href,'_system'); return false;">TEXT</a>


Je kunt tekst gebruiken om de URL link aan te kondigen, bijvoorbeeld:

 

Om dit design van een introductietekst boven de URL link voor elkaar te krijgen gebruik je deze code:

<center><p>I Love Digital Forms<br> <a href="https://platform.moreapp.com/#/signup";; onclick="window.open(this.href,'_system'); return false;">Sign Up Now!</a></p></center>


Zoals je kan zien kan je gebruik maken van deze code om de tekst te centreren:

<center><p>TEXT</p></center>


5. Kleuren toevoegen


Je kunt kleuren toevoegen in de HTML-code. Om dit te kunnen doen heb je de hex code nodig van de gewenste kleur.

  • Achtergrondkleur

Je kan een achtergrondkleur toevoegen voor de tekst in de HTML-widget met deze code:


<div style="background-color:HEX COLOR CODE"><p>TEXT</p>

 

  • Tekstkleur

Om een tekstkleur toe te voegen gebruik je deze code:


<div style="color:HEX COLOR CODE"><b>TEXT</b> 


  • Achtergrondkleur van afbeelding

Je kunt ook de achtergrondkleur van een afbeelding toevoegen, dit doe je met deze HTML-code:

<div style="float:POSITION;background-color:HEX COLOR CODE"><img src="IMAGE URL" style="margin:5px" width="32" height="32"></div>







6. Een iframe gebruiken


<iframe src="https://moreapp.com/assets/MoreApp-Privacy-Policy.pdf" width="100%" height="300">
  <p>Your browser does not support iframes.</p></iframe>


7. Een streep toevoegen


<HR>


8. Een formulier toevoegen aan een website


<p align="center"><iframe src="Plak link hier" width="90%" height="600" style="border:1px solid lightgrey;"></iframe></p>


Klik hier om naar de Help Center post te gaan.



Dankjewel! 

Dankjewel dat je gebruik maakt van MoreApp. Onthoud dat er nog veel meer mogelijkheden met HTML codes beschikbaar zijn, de bovengenoemde zijn maar een aantal voorbeelden. 


MoreApp biedt verder geen support over HTML codes. 


Leer meer over de mogelijkheden om jouw formulieren aan te pasen met kleurenthema's!


Wil je meteen op de hoogte zijn van de nieuwste tutorials? Ga naar de MoreApp YouTube pagina en klik op de rode Abonneren knop!