Fullscreen Image

Page Layout Editor

Reports, Forms, and Page Layouts contain a build layout link. Certain aspects of the Page Layout Editor are specific to each item.

Save your changes frequently by clicking the Save Layout at the bottom of the Layout Builder window.

  1. Click A small, white, square button with a plus symbol in its center. next to the item you want to build a layout for.

    The layouts associated with the item display as child items.

  2. Click Build Layout link in the Actions column.

    The Layout Builder opens in a window.

ClosedShow Field Associations

  • To view the field associations on a layout, click Show Field Associations at the bottom of the window.

    A window opens with the field and table associations.

ClosedShow Conditional Field Associations

To show the conditional field rules applied in a layout:

  • Click Show Conditional Field Associations.

    A window opens, displaying the conditional field rules.

ClosedClear Layout

  • To clear the layout of all formatting, click Clear Layout at the bottom of the window.

    The layout is cleared of all formatting. If you want to return to the previous layout, close the window without saving your layout.

ClosedRemove Empty Rows

  • To remove all empty rows from your layout, click Remove Empty Rows at the bottom of the window.

    The empty rows are removed from your layout.

    This action will not remove blank rows or the row at the bottom of your layout.

ClosedAdd a Field to a Layout from the Fields Pane

  1. Do one of the following:

    • In Search, enter the name of the field you want to add to your layout.

    • Navigate to the field you want to add to your layout by opening folders.

      Click A small square gray button with a plus symbol in its center. to expand the field folders, and click A small gray button with a minus in its center. to contract the folders.

      If you added fields to your item previously, you can find those fields by opening the Available Fields > [Item Type] > [Item Name] folder.

      If you have created sub-layouts, you can find them in the Available Fields > Sub Layouts folder.

  2. Select the field you want to add to your item.

  3. Drag the field to the layout.

  4. Drop the field on a A small square gray button with a plus symbol in its center. icon in the layout.

    The field is added to the cell.

ClosedMove a Field

To move a field from one cell to another:

  1. Click and drag the A small gray button with a four-pointed intersection of arrows on it. of the field you want to move.

  2. Drop the field on the A small square gray button with a plus symbol in its center. of the cell where you want the field.

    As you hover your cursor over the + button, a small dialog box will open with a green check mark icon.

  3. Click A small square gray button with a plus symbol in its center. of the cell where you want the field once more.

    The field moves to the cell.

ClosedRemove a Field

Important!

Only click Delete or Remove if you are sure you want to delete the item. The system does not prompt you to confirm the deletion.

To remove a field, click A small gray button with a black x in the center. in the field cell.

ClosedChange the Size of a Cell

To change the size of a cell, click:

  • A small gray square button which looks like an arrow pointing right. Expand Right: Increase the width of the current cell by one cell width.

  • A small gray square button which looks like an arrow pointing left. Collapse Left: Decrease the width of the current cell by one cell width.

  • A small gray square button which looks like an arrow pointing down. Expand Down: Increase the height of the current cell by one cell height.

  • A small gray square button which looks like an arrow pointing up. Collapse Up: Decrease the height of the current cell by one cell height.

ClosedAdd Additional Field Types to a Layout

To add additional field types, see the expanding sections below:

ClosedBlank Space

To add an empty cell:

  1. Click A small square gray button with a plus symbol in its center. of the cell where you want the empty space.

    The Insert opens.

  2. Select Blank Space from the field.

    An empty cell is inserted into your layout.

ClosedLabel Field

A label field is a label that appears in your layout.

To insert a label field in your layout:

  1. Click A small square gray button with a plus symbol in its center. of the cell where you want the label.

    The Insert opens.

  2. Select Label Field from the field.

    The Label Field window opens.

  3. Enter the text of your label in the Enter Label field.

  4. Select or clear the following check boxes:

    • Underline

    • Bold

    • Italic

    • Display as Section Header: Select this check box to make this label into a section header.

      A section header is the black header bar with white text.

    • Accept HTML: Select this check box to allow HTML code in the Enter Label field.

      For example, you could use HTML to hard-code the size or color of your label.

      If the HTML you use is not written correctly, the system will suggest valid code at the top of the window.

  5. Select one of the size options to customize the size of the label text.

  6. Select one of the Alignment Options options to set the alignment of the label.

  7. Click Save.

    The window closes. The label field appears in the layout.

ClosedMath Field

This section teaches you how to build and manage math fields.

ClosedAdd a Math Field

Note:

It is our best practice recommendation that you create math fields on the Manage Data Fields page, so they will be available across the entire firm.

To add a mathematical operations field to your layout:

  1. Click A small square gray button with a plus symbol in its center. of the cell where you want the math field.

    The Insert opens.

  2. Select Math Field from the field.

    The Mathematical Operations Builder window opens.

  3. Enter the name of the field in the Field Name field.

  4. Select the table this field will be associated with from the Table Association field.

  5. Select the field type from the Field Type field.

    The available field types are:

    • Number

    • Currency

    • Percentage

    • Total

  6. Select the data group this field should be associated with from the Data Group field.

    This is the group on the Admin > Manage Data Fields page that this Math will be added to. Refer to this group to find this field later.

  7. Enter a unique database field name in the Accessor Name field.

    Note:

    Our best practice recommendation is not to create an accessor name, because the system will create a unique name for you. If you do decide to create an accessor name, the name must be unique from other field names, it must not contain spaces, and it must not contain special characters.

  8. Build your mathematical operation.

    You can build your mathematical field using three components: fields, numeric constants, and operations.

    • As you use fields and numeric constants, click the operations buttons to add them to the Current operation field.

    • To move a field from the Fields pane to the Current operation field:

      1. Select the field you want to use in the Fields pane.

        You can also search for a field using the Search field.

      2. Click > > in the center of the window.

        The field is moved from the Fields pane to the Current operation field.

    • To add a numeric constant to your operation:

      Note:

      A numeric constant is a number that does not change.

      1. Enter the number value you want to add to your current operation in the Numeric Constant field.

      2. Click > > to the right of the Numeric Constant field.

        The number is moved from the Numeric Constant to the Current operation field.

  9. Click Submit once you have completed your mathematical operation.

    The Mathematical Operations Builder window closes. The Math appears in your layout. If you need to make changes to your math field, follow the Edit a Math Field procedures below.

ClosedEdit a Math Field

To edit a mathematical operations field in your layout:

  1. Click F(x) A gray button with black text reading f(x). in the field cell on the layout.

    The Mathematical Operations Builder window opens.

  2. Make your changes.

  3. Click Submit.

    The Mathematical Operations Builder window closes. The Math is updated.

ClosedDate Expression

A date expression is the difference between two dates. For example, you could create the date expression: Contract Possession Date: Contract Execution Date to determine how many days fell between when a real estate contract was signed and when you took possession of the property.

To add a date expression field:

  1. Click A small square gray button with a plus symbol in its center. of the cell where you want the date expression field.

    The Insert opens.

  2. Select Date Expression from the field.

    The Mathematical Operations Builder window opens.

  3. Follow the Add a Math Field procedures above.

ClosedSlide Show

The Slide Show tool is primarily used in custom page layouts. It is not used in reports.

To add a slide show to your layout:

  1. Click A small square gray button with a plus symbol in its center. of the cell where you want the slide show.

    The Insert opens.

  2. Select Slide Show from the field.

    The Select default folder to contain Slide Show images window opens.

  3. Select the folder where your slide show images are located.

    This folder must be contained within your folder template. We recommend creating a folder titled Slide Show.

  4. Click Select.

    The window closes. The slide show is added to your layout.

ClosedGeo Map

The user interface for the layout editor is shared between custom page layouts, forms, and the report layout editor. The Geo Map tool is used in custom page layouts, but cannot be used in forms or reports.

ClosedEmpty Row Above

To add an empty row above the row you are currently working in:

  1. Click A small square gray button with a plus symbol in its center. in a cell in the row below where you want the empty row.

    The Insert opens.

  2. Select Empty Row Above from the field.

    An empty row is inserted into your layout above the row where you are currently working.

ClosedEmpty Column Left

To add an empty column to the left the column you are currently working in:

  1. Click A small square gray button with a plus symbol in its center. in a cell in the row where you want the empty column.

    The Insert opens.

  2. Select Empty Column Left from the field.

    An empty column is inserted into your layout to the left of the column where you are currently working.

ClosedBlank Row

A blank row is empty of any fields. Blank rows can be used to create space between other parts of your page layout.

To add a blank row:

  1. Click A small square gray button with a plus symbol in its center. in a cell in the row where you want the blank row.

    The Insert opens.

  2. Select Blank Row from the field.

    An blank row is inserted into your layout.

ClosedModify the appearance of a field

The settings that appear in the Edit Field window differ depending on the type of field.

To modify the appearance of a field in your layout:

  1. Click A small square gray button with an ellipses on it. in the field cell.

    The Edit Field window opens.

  2. Make your changes.

    The settings in this window are as described below:

    • Field Label: This field displays how the field is labeled on the layout.

      It is our best practice recommendation that you modify the field label from the Manage Data Fields page.

    • Edit Mode Default Value: If you want this field to be pre-filled with a value, enter the value in the Edit Mode Default Value field. Users can still change the field value.

      This field does not apply to reports.

    • Is Required?: Select this check box to make this field required.

    • Read Only in Edit Form: Make this field non-editable. This does not apply to reports.

      When selected, Value JavaScript that uses this field or dependent fields must contain the prefix ProjectEntity_. For example:

      Copy

      Updated JavaScript that sets the field value

      var valueToSet = "";
      var facilityID = "${ProjectEntity_Facility.ClientEntityID}";
      var spaceID = "${Space.ClientNumber}";


      valueToSet = facilityID + " " + spaceID;

    • Accept HTML: Select this check box to allow HTML code in the field.

    • Show Hyperlink: If this field is a hyperlink and you want to display the hyperlink on the page, select this check box.

    • Edit Mode Label Layout: This setting changes how a field label aligns with the field value. This field does not apply to reports.

      Choose between three options:

      • Select the Above field option to have the field label appear above the field value.

      • Select the Side by Side, same cell option to have the field value appear immediately after the field label.

      • Select the Side by Side, separate cell option to have the field value appear in a separate cell to the right of the field label.

    • Edit Alignment: Select one of the three options to change the alignment of the field.

    • (Sub Layouts only) Show Table Header: Select this check box to display the section headers in your sub layout.

    • (Sub Layouts only) No Table Border: Select this check box to remove the table border from your sub layout.

    • (Sub Layouts only) Show Cell Border: Select this check box to display the cell borders in your sub layout.

    • (Sub Layouts only) Collapsible: Select this check box to make this sub layout collapsible.

      By default, the sub layout will be open.

    • Choose Color: Select a color to change the color of the data in the field.

    • Underline: Applies underlining to the field data.

    • Bold: Makes the field data bold.

    • Italic: Makes the field data italicized.

    • Font Size: Select a font size from this field to change the font size of the field data.

    • Style: This field displays the CSS code that has been applied to the field. CSS stands for Cascading Style Sheets, and it is a coding language used to modify the appearance of web content. You can also edit the CSS in this field to make changes to the field's appearance.

    • Hide Label: Select this check box to hide the Field Label.

    • Hide in Edit Mode: This field does not apply to reports. Select this check box if you do not want this field to be displayed in Edit mode.

      This setting is commonly used for fields that contain values populated by integrations.

    • Hide in View Mode: Select this check box to hide the field when viewing the layout as a form.

    • Hide in Update Mode: This field does not apply to reports. Select this check box if you do not want this field to be displayed in Edit mode.

      This setting is commonly used for fields that contain values populated by integrations.

    • Hide in Add Mode: This field does not apply to reports. Select this check box if you do not want this field to be displayed when a user is adding a form to an entity.

      This setting is commonly used for fields that are system-generated, such as the form number.

    • Hide in View Mode if No Value: Select this check box to hide this field if there is no data associated for it in the database.

    • Drop Down Options: Select the option you want:

      • Name: Only the menu option Name is displayed in the menu

      • Description: Only the menu option Description is displayed in the menu

      • Both: Both the Name and Description are displayed in the menu

        In View mode, only the Name will appear.

    • (Number Fields Only) Number of Decimals: Select the number of decimal values you want to have appear in this field.

      The maximum number of decimals you can select is six. If you do not select a value, the system will display a rounded value.

    • (Memo Fields Only) Number of Rows in Edit Mode: Enter the height you want for your text box in a number of rows.

    • (Memo Fields Only) Max Width in Edit Mode: Enter the maximum width of your text box you want displayed in Edit mode in pixels.

      The system will auto-size the field for you. We recommend viewing and saving the layout prior to setting a maximum width.

    • (Memo Fields Only) Max Width in View Mode: Enter the maximum width of your text box you want displayed in View mode in pixels.

      The system will auto-size the field for you. We recommend viewing and saving the layout prior to setting a maximum width.

      There is a Value JavaScript at the bottom of the window. JavaScript fields can be used to set field values that are a combination of fields, or to apply logic to a field that cannot be applied in a math field. For example, you could create a field which includes a Contract Name, Address, and ID.

      If you are creating a report layout, our best practice recommendation is to implement JavaScript report fields in Step 4 of the Report Builder.

  3. Click Set Options.

    The window closes. Your changes are saved.

Conditional Fields

ClosedSave Your Layout

  • Once you are satisfied with your layout, click Save Layout.

    The window closes. Your changes are saved.

Accruent logo in white text.

© Copyright Accruent 2025Privacy PolicyTerms of UseLegal