> For the complete documentation index, see [llms.txt](https://developer.harness.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://developer.harness.io/internal-developer-portal/3.0/admin-and-customization/layout-and-appearance/workflows-page-customization.md).

# Workflows Homepage Customization

You can organize your IDP Workflows into groups such as Service Onboarding, Infrastructure Use Cases or Day 1 Onboarding using the Workflows Homepage Customization. You can also change the icons of individual groups and each Workflow. You can also change the primary button text from "Execute" to more suitable verbs such as "Create", "Delete" or "Run" with appropriate intent colors. Finally, you can change the order of the groups and Workflows within an individual group as well.

This will help you surface out the most useful Workflows for your developers, while rest of workflows will continue to live under "All Workflows" page.

### Available customizations <a href="#available-customizations" id="available-customizations"></a>

**Platform Engineers** (users assigned with the role of [IDP Admin](/internal-developer-portal/admin-and-customization/rbac/scopes.md#idp-admin-role) or having [Layout edit permission](/internal-developer-portal/admin-and-customization/rbac/scopes.md#permissions--resources-idp-20)) can customize the **Workflows homepage** under **Configure** → **Layouts** → **Workflows** section by creating **groups** and adding Workflows to each group. These groups can be further customized using a **name**, **icon**, and **description** and they can be arranged in a specific order to determine how they appear on the Workflows homepage.

The option to create new groups is also available under the Workflows homepage which will take you to the **Layout** → **Workflows** under **Configure**.

#### Group workflows <a href="#group-workflows" id="group-workflows"></a>

We can add a new **Group** by navigating to **Configure** → **Layout** → **Workflows**.

* Start by clicking on the **+New Group** icon.
* Now add a Name for the group based on the use-cases. Such as
  * Backend
  * Frontend
  * Infrastructure
  * Day 1 Onboarding
  * Cloud 2.0 Initiative
* Add a **Description** of the group. Ensure you mention the purpose, who is the owner of the group and where can users reach out if they need help. Examples
  * Reach out to #architecture-board if you have any questions.
  * All infrastructure workflows. Owner: #infra-team
  * Reach out to #engops-self-service for support.
* Choose a meaningful **icon** for the group.
* Once the Group is created you can **add** new workflows under that and **save** the changes.
* You can also arrange the Workflows, using drag and drop, in specific order to appear under the group. Use this to promote your recommended Golden Paths to your developers. For example, if you use both Java and Golang for backend services, but want to promote Java more, that should be your first Workflow.

#### Remove workflows from groups <a href="#remove-workflows-from-groups" id="remove-workflows-from-groups"></a>

To remove workflows under a group, select the **add/remove** workflows option and remove the workflow, then **save** the changes.

#### Remove a group <a href="#remove-a-group" id="remove-a-group"></a>

You can Remove a Group by clicking on the **three dots** on the Groups tabs and select **Delete**.

#### Customize a workflow using icons and action button <a href="#customize-a-workflow-using-icons-and-action-button" id="customize-a-workflow-using-icons-and-action-button"></a>

You can now add an **icon** and change the **action** button **name** and **color** according to the use case.

* **Icons:** Under the `metadata` add `icon` and [mention a name](https://github.com/harness-community/idp-samples/blob/678537d76978267dcf1b137c17634b0e381afab3/icons-actions-buttons.yaml#L7) from the [list of icons](/internal-developer-portal/admin-and-customization/layout-and-appearance/workflows-page-customization.md#icons-supported-in-harness-idp) under **Configure** → **Layout** → **Workflow**.

```yaml
...
## Example Workflow Definition <a href="#example-workflow-definition" id="example-workflow-definition"></a>
metadata:
  name: delete-infrastructure
  title: Delete Infrastructure
  icon: python
spec:
...
```

* **Button:** Under the `metadata` field add `actionButton:` and [provide the values](https://github.com/harness-community/idp-samples/blob/678537d76978267dcf1b137c17634b0e381afab3/icons-actions-buttons.yaml#L8-L10) for `intent`(updates the color of the button) and `text` (could be anything according to the use-case e.g., Create, Run, Stop, Delete etc.). Here is the supported list of intent/colors.

| Supported Intent | Colors |
| ---------------- | ------ |
| primary/default  | BLUE   |
| `success`        | GREEN  |
| `warning`        | YELLOW |
| `danger`         | RED    |

* [Source YAML](https://github.com/harness-community/idp-samples/blob/main/icons-actions-buttons.yaml)

```yaml
...
## Example Workflow Definition <a href="#example-workflow-definition" id="example-workflow-definition"></a>
metadata:
  name: delete-infrastructure
  title: Delete Infrastructure
  actionButton:
    intent: warning
    text: Run
spec:
...
```

### Navigate the HomePage <a href="#navigate-the-homepage" id="navigate-the-homepage"></a>

1. **Register New Workflow**: [Register](https://github.com/iKettles/harness-gitbook/tree/main/new-to-idp/get-started/step-3-workflows.md) a new workflow in Harness IDP.
2. **Favourites**: List all the starred workflows
3. **All Workflows**: Lists all the workflows irrespective of the groups they are part of.
4. **Search**: Search the list of workflows based on the workflows title.
5. **Tags & Categories**: You can filter workflows based on **tags** and **categories**. Category is defined by [`spec.type`](https://github.com/harness-community/idp-samples/blob/678537d76978267dcf1b137c17634b0e381afab3/icons-actions-buttons.yaml#L13) in Workflow definition YAML.
6. **Workflows Details**: The three dots on each Workflows now allows you to **View**, **Edit** and **Refresh**(updates Workflow with the latest changes in definition YAML) the YAMLs.
7. **Open Playground**: Template Editor is part of the **Open Playground**, where you can preview your workflows changes live.

### Extended reading <a href="#extended-reading" id="extended-reading"></a>

#### Icons supported in Harness IDP <a href="#icons-supported-in-harness-idp" id="icons-supported-in-harness-idp"></a>

* Go to Icons under **Configure** → **Layout**, and highlight the icon name you want to add, it will be copied, and now you can add it under the `metadata.icon` in the Workflow definition YAML.