# HTML Advanced

HTML Portlet allows for creating a Portlet with customized content using HTML code. It is possible to use styling and scripts to fit your choice and needs.

## General

General data is required for all portlets.

[General configuration](https://help.novacuraflow.com/development/flow-portal-2/common-configuration#general)

## Listeners

The portlet can listen to the following events:

* On Row Selection
* On Refresh
* On Point Selection

<div align="left"><img src="https://529897662-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LtPTgZOYmpJka4jqs1v%2F-M8tbrSaGIRYe9EthohB%2F-M8tdX9KoUxjxEGK1TEF%2Fimage.png?alt=media&#x26;token=79b84e5b-1239-49e1-aa34-3efe42db5c44" alt=""></div>

[Listeners configuration](https://help.novacuraflow.com/development/flow-portal-2/common-configuration#listeners)

## Data

### Data source

The portlet data source configuration enables the portlet to execute specified queries towards the chosen database connector to fetch data, or fetch data from a workflow.

* Database: uses a flow connector to retrieve data from a database
* Workflow: runs a workflow to retrieve data

[Data source configuration](https://help.novacuraflow.com/development/flow-portal-2/common-configuration#database-source)

[Workflow source configuration](https://help.novacuraflow.com/development/flow-portal-2/common-configuration#workflow-source)

### Data source columns

Manage: the columns can be configured as a grid view as well as the list view. This view can help for a better overview and quicker configuration when a lot of columns are in use.

Click *Execute* in the data source section to fetch the columns. Each column can be configured with:

* display name
* column type

There are a number of column types to choose from. The default column type is text.

* Text: use to display column as a text fields
* Number: use for number fields where the number is an integer
* Decimal: use for numbers with decimals
* Date: will display the column as a date with no time
* Date & Time: use to display date and time

### Default presentation

<div align="left"><img src="https://529897662-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LtPTgZOYmpJka4jqs1v%2F-M0cMM76QMiiD7D7ZA7J%2F-M0cMY09VrTUHk-MfLWJ%2Fimage.png?alt=media&#x26;token=5cb142ab-294f-48da-b543-039be107d754" alt=""></div>

## Content

In content use script, header and body sections to configure the portlet content.

## Style

Change the header text color and add a header stripe by configuring style.

[Style configuration](https://help.novacuraflow.com/development/flow-portal-2/common-configuration#style)