Change a Logo in a Page Template
After completing this How-To, you should be able to understand:
Application Express (formerly called HTML DB) uses template that are fully customizable. These templates may reference images and cascading style sheets (CSS). Using only a web browser, you can create and modify these HTML based templates to get exactly the look and feel you desire. In this How To, we will decribe how you can modify the template supplied with the sample application to change the logo.
To upload an image, follow the following steps:
Modifying a page template
Now that the image is uploaded, it's stored in the database and we can use it in a page template to modify the look and feel of an application. To reference an image you have uploaded in a page template, follow these steps:
Listing 1 - Sample HTML referencing logo in page template, before change
<table width="100%"> <tr> <td style="vertical-align:top;text-align:left;width:170px;padding-left=5px;padding-top=5px;">The body section of the page template is currently referencing a default image that ships with HTML DB. To reference the image we just uploaded, my_logo.gif, we need to change this section of HTML. First, we need to include the substitution string #WORKSPACE_IMAGES# referring to the location of images we uploaded. Secondly, we need to reference the correct image name, in this case: my_logo.gif. See sample HTML below.
Listing 2 - HTML referencing logo in page template, after change
<table width="100%"> <tr> <td style="vertical-align:top;text-align:left;width:170px;padding-left=5px;padding-top=5px;">After applying the change to the template, your application should now use a new logo on each page that uses the default page template.
Discuss this how-to in the OTN HTML DB Forum.