# Design Portal Page

A portal page can contain one or multiple portlets. The portlets use Components and Applications to fetch and process data.

### Open a Portal Page from the Hub

* Open the application by selecting the Portal Page or use the context menu **Edit in Portal** in Hub.
* The Portal Page is opened.

### Add portlets

* Go to **Add New** and select **Portlet** to open the modal containing the available portlets.
* Choose a portlet and drag it into the design area.
* Enter a name for the portlet and click **Create**.
* Resize the portlet by dragging its edges or corners.
* Move the portlet by grabbing the header banner (where the portlet title is).

<figure><img src="https://1716064794-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIIgl6sNaTky0iALxYWHH%2Fuploads%2FqOCjrfTDaEUeEdzzJBz4%2Fimage.png?alt=media&#x26;token=c450ce95-743d-4068-8fea-4649b376d817" alt=""><figcaption></figcaption></figure>

<figure><img src="https://1716064794-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIIgl6sNaTky0iALxYWHH%2Fuploads%2FEP9tIe2LyRWL59IWJoDj%2Fimage.png?alt=media&#x26;token=1b6d71a8-cf86-4ca8-afe0-e03418c37e8a" alt=""><figcaption></figcaption></figure>

### Portlet configuration <a href="#managing-sequence-arrows" id="managing-sequence-arrows"></a>

* Click **Edit** (the pen icon in the header banner) to modify the portlet.
* Most portlets use a component as the data source, see [Components ](https://docs.novacura.com/flow-connect/working-with-connect/create-and-design/components)for more details.
* For more information about configuring individual portlets, refer to [Portlets](https://docs.novacura.com/flow-connect/reference/reference/portal/design-items/portlets).
* Once the portlet is configured, click **Preview** to run the data source component, fetch the data, and preview it in the portlet.
* When you're happy with the configuration, click **Apply** to save the portlet.

### Copy, cut and delete portlet

Click on the tree dot context menu in the portet header section to open the action menu:

* Select **Delete** to remove a portlet.
* Select **Copy** to duplicate a portlet. The copied portlet will be available in the copy clipboard. *Drag* the clipboard into the design area and *drop* it to create the new portlet. You can copy multiple portlets into the clipboard to create a container (see [Container ](https://docs.novacura.com/flow-connect/reference/reference/portal/design-items/container)for more details). You can add the clipboard to any page, whether it belongs to the same application package or a different one. If the target page is in a different package, the portlet’s data sources will be disconnected unless they are global components.
* Select **Cut** to move a portlet. The cut portlet will be available in the Cut clipboard. *Drag* the clipboard into the design area and *drop* it to place the portlet. You can cut multiple portlets into the clipboard to create a container (see [Container ](https://docs.novacura.com/flow-connect/reference/reference/portal/design-items/container)for more details). You can add the clipboard to any page, whether it belongs to the same application package or a different one. If the target page is in a different package, the portlet’s data sources will be disconnected unless they are global components.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.novacura.com/flow-connect/working-with-connect/create-and-design/portal-pages/design-portal-page.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
