Table of contents
- 1. Overview
- 2. Customizing CSS
- 3. CSS Fields
- 4. Related
- 1. Overview
- 2. Customizing CSS
- 3. CSS Fields
- 4. Related
Overview
This section describes how to modify the CSS for a Z-Payments Page.
Customizing CSS
The CSS of the iFrame can be controlled in the Details page. The following is an example of some CSS code entered into the Details page and resulting iFrame:
In addition, various elements of the iFrame are tagged so that individual rows/labels can be customized. A full list of the CSS elements tagged in the iFrame can be found in CSS Fields table below. For illustrative purposes, here is an example:
CSS Fields
| Style Name | Description |
|---|---|
| z_hppm_maintable | Main table that holds all the elements. |
| z_hppm_page_title_row | <tr> element for page title. |
| z_hppm_page_title_cell | <td> element for page title. |
| z_hppm_page_description_row | <tr> element for page description. |
| z_hppm_page_description_cell | <td> element for page title. |
| z_hppm_field_row | <tr> element for field. |
| z_hppm_field_row_[Field Name] | <tr> element for a specified field. For example, z_hppm_field_row_creditCardNumber |
| z_hppm_field_label_cell | <td> element for field label. |
| z_hppm_field_label_cell_[Field Name] | <td> element for a specified field label. For example, z_hppm_field_label_creditCardNumber |
| z_hppm_field_value_cell | <td> element for a field value. |
| z_hppm_field_value_cell_[Field Name] | <td> element for a specified field value. For example, z_hppm_field_value_cell_creditCardNumber |
| z_hppm_field_value_cell_required | <td> element for a field value (if it is required). |
| z_hppm_field_info_cell | <td> element of an empty cell to the right of field value (space for “additional information”). |
| z_hppm_field_info_cell_[Field Name] | <td> element of an empty cell to the right of a specified field value (space for “additional information”). For example, z_hppm_field_info_cell_creditCardNumber |
| z_hppm_field_info | <div> element within an empty cell to the right of field value. |
| z_hppm_field_info_[Field Name] | <div> element within an empty cell to the right of a specified field value. For example, z_hppm_field_info_creditCardNumber |
| z_hppm_text_input | <input> element of a field of “text” type. |
| z_hppm_radio_input | <input> element of a field of “radio” type. |
| z_hppm_select_input | <select> element of a field. |
| z_hppm_input_[Field Name] | <input> element of a specified field. For example, z_hppm_input_creditCardNumber |
| z_hppm_input_required_[Field Name] | <input> element of a specified field (if it is required). For example, z_hppm_input_required_creditCardNumber |
| z_hppm_image | <img> element applied to each of the “accepted types”. |
| z_hppm_image_[Type] | <img> element applied to a specified “accepted type”. For example, z_hppm_image_Visa |
Comments