Advanced Tutorial - HTML Images Tutorial

EZSurvey allows you to customize your forms with more options by embedding HTML tags into your EZSurvey form. Even if you don't know HTML, it is still possible to take advantage of some of these features.

To get started, this tutorial will show you how to transform a simple and very stark survey into a more attractive form with a minimum of difficulty by adding images to it. First, open Graphics.ezf. (Save this file to your desktop first.) Take a moment to view the Preview to see what it looks like.

While the form is informative, this page could certainly be made more visually attractive. Return to the Edit form window and select on the first question, labeled France. Then select inside the question text box. Change the question type to Plain Text and then replace the word "France" with the following:

<img src="france.jpg"><br><br>

Note: For images to appear in the form during preview, they must be in the same directory as the EZSurvey program.

If you click Preview, you'll see that now there is "France" written in fancy script. However, if you don't know any HTML, you may be confused by what you just typed. The HTML tags you used are:

<br>: This is the line break tag. It starts a new line at its location.

<img>: This is the image tag. You use it if you want to insert an image into your page. In order to display an image, however, you must also add, inside the tag, src="filename", where filename is the name of the image you want to display. So, the whole tag must look like this: <img src="filename">.

With just that information, you can now change each of the other three questions to use images as well. All you need to do is add those tags to the question text, using the name of the country as the name of the image file in each case (i.e., "japan.jpg" for Japan). Remember to add the two <br> tags after the image tag; it creates some room between the pictures.

If you look at the preview after you're done, you find that the survey is much more attractive than before; however, there are still elements that need some tweaking. That is covered in the Custom Tables tutorial.

Refer to the topic Insert a Picture below for additional information, and if you are having trouble getting your images to appear.

See also...