# Product Details Group With Progress Bar

## Overview

![](/files/-MW810f-qit2Hrf4UtRW)

This fully-responsive block includes tags, a button (with additional options in a menu focus group), and a progress bar. It is ideal for displaying a list of fields on an object. No workflows are associated with this block.

## Structure

* When this block is added to a page, it is placed within a group called **Blocks container 860 (do not rename)** on the page. This group contains the responsive settings for all blocks.
* **Group listingDetailsWithButtonProgressBar** contains three main groups:
  * **Group Main header** - This group contains a title and a button reusable element called **new\_buttonwithmenufocusgroup**. In the reusable element, clicking on Group More will toggle the menu focus group.
  * **Group Inner details content** contains disabled multidropdown tags and a line of description text. You can add additional UI components to the group by resizing **Group PLACEHOLDER 1**. Please ensure the placeholder group is not overlapping with any other elements.
  * **Group Collapsible progress** contains a title text, body text, and a progress bar. You can add additional UI components to the group by resizing **Group PLACEHOLDER 2**. Please ensure the placeholder group is not overlapping with any other elements.

## How to set up

* Go to **new\_buttonwithmenufocusgroup** reusable element and add a workflow to **Button Actions**. Show or hide options groups in GroupFocus button. Add workflows to the options groups in the workflows tab.

![](/files/-M3BBTXehT_-Bl5xKB3I)

* Update the data sources of text elements, multidropdowns, and the progress bar 


---

# 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.airdev.co/canvas-pages-and-modules/modules/listing-details-with-tags-button-and-progress-bar.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.