A Hello World Example Using the Image Tag

One of the simplest code generation tags is the Image tag.  The Image tag displays an image in the web page, and can reference a URL, a file name, or database table.  The example below shows an Image code generation tag in the Layout Editor and the resulting page.

<GEN:Image Name=“Logo” />

The Image tag is placed anywhere in the Layout Editor where you wish the image to be displayed.  The Image tag has no other parameters than Name, which distinguishes one Image tag from another.

Note: to change a Name parameter you need to change it in the Property Sheet > (ID). Do not change it in HTML Editor

After setting the Image tag’s URL and updating the application, the resulting page looks like this.

We can build on this example by adding a second Image tag.

This is the first image: <br><GEN:Image Name="Logo1" /><br>

This is the second image: <br><GEN:Image Name="Logo2" />

Two different Name values distinguish one Image tag from the other.  This allows Iron Speed Designer to create separate components for each tag.

After setting two Image tags to two different URLs and updating the application, the resulting page looks like this.

Use the Property Sheet to configure the Image code generation tag to the actual image.

See Also

Code Generation Tags

A Hello World Example Using the Image Tag