For first time users, it is ideal to customize an existing Style so you can understand how the editing process of a Style works and which Style element pertain to which aspect of your DataPage.

In this article, you edit the current style settings for a particular DataPage element.

  1. In Caspio Bridge, select and open an app or All Assets. On the App Overview page, click Styles on the sidebar menu and on any Style, click Edit .
  2. On the screen Define Style Settings,  the DataPage Elements panel is arranged in three categories:
  • Forms/Details – This category lists all elements that appear on web forms, details pages, search forms, login forms, and Password Recovery forms.
  • Results Page – This category lists all elements that appear on the results page of Search and Report DataPages.
  • HTML Tags – They are the tags in your HTML blocks, headers, and footers.

Click a category if collapsed. You can edit the styling setting for a particular element under every category. In this scenario, Forms/Details is expanded. Select Labels.

Forms/Details - Labels settings

On the right side of the wizard, the Element Type indicates the type of element that can be configured and the Current Settings indicate the current style setting applied. You can change and customize the label style settings under the Font Options section. Click Preview on the bottom right-hand corner to view the style. You can see that the default style for text labels is applied in the image below. Click X to close.

Style Preview

  1. You may perform the following actions:
  • Click Clear All to remove all style changes from this Style and start back at default. A message will appear to confirm this action.
  • Click Clear to remove all styling from the currently selected Element Type and starting styling it from scratch.
  • Click Reset to reset any changes you have made to the currently selected Element Type and restore previously saved settings.

You can continue to perform edits in the Settings tab or go to the Source tab to customize each Element Type with an HTML code.

Under Apply Style to DataPages section, you can check any DataPages you wish to apply this Style to. This lists all DataPages in your account that can be styled. Select the checkboxes next to the DataPages to which you wish to apply this particular Style. The name of the DataPage, the folder location of the DataPage, and the Style the DataPage currently uses are also displayed. Click Reset to reset any changes you have and restore previously saved settings.

A few notes about this section:

  • If you are creating or editing a Style within an App, all DataPages within the App are displayed.
  • If you are creating or editing a Style in All Assets, all DataPages in your account are displayed.

Click Save when done.