Managing HTML Page Elements

Adding HTML Page Elements to Pages

To add an HTML area page element to a page:

1. Access the Layout grid on the Layout Designer – Layout page.

   Select PeopleTools > Mobile Application Platform > Layout Designer. to access the page.

2. Determine the position in the grid to add the page element.

3. Click the row directly above where you want to add the page element to make it the current row.

   The Current Row icon (blue arrow) displays in the first column of the row to indicate that it’s the current row.

   Field or Control	Definition
   	The Current Row button.

4. Click the Add HTML Area button on the Layout grid toolbar.

   Field or Control	Definition
   	The Add HTML Area button.

After you click the button the HTML Page appears where you enter code in HTML5 format that you want to appear on the layout page.

Using the HTML Page to Add HTML to Pages

Image: HTML page

This example illustrates the HTML page.

In the HTML long edit box, enter the HTML that you want to appear on the layout page.

Note that after you’ve defined an HTML page element you can define properties for it using the HTML Area Properties page.

Viewing Defined HTML Area Page Elements in the Layout Grid

HTML Area page elements are indicated in the Layout grid by the maphtml element ID.

Image: HTML Area page element defined in the Layout grid

This example illustrates an HTML Area element defined in the Layout grid.

The label text for HTML area elements does not appear on the user interface at runtime, however you may find it useful to enter a value in the field for reference during development.

To define properties for an HTML element click the Properties link. Defining properties for HTML area elements is described in the next section.

To apply custom styles to the element, use the Class, Style, Theme and No Style Overrides fields and controls to apply custom styles to the element. See Defining Styles and Themes for Page Element Labels

Understanding Defining HTML Page Element Properties

To define properties for HTML elements use the HTML Properties page.

Many properties that appear on the HTML Properties page also appear on the properties pages for other page elements. For more information and links to topics about these common properties, see the topic Common Layout Page Element Properties

This topic discusses using the properties on the HTML Properties page that are unique to working with HTML areas. These properties are located in the HTML Area section of the page.

Defining HTML Element Properties

To access the HTML Properties page, in the Layout grid on the Layout Designer – Layout page click the Properties link next to the HTML element for which you want to define properties.

Image: HTML Area section

This example illustrates the fields and controls in the HTML Area section of the HTML Properties page. You can find definitions for the fields and controls later on this page.

Field or Control	Definition
HTML	The long edit box displays the HTML current defined for the element. Use the field to modify or update HTML for the element.
Change Mapping	Click the link to access the Change HTML Mapping page to change the HTML from HTML code to a primitive element or vice versa. See the next section for information about using the Change HTML Mapping page.
	Click the icon to view the HTML in a modal window.