> For the complete documentation index, see [llms.txt](https://docs.zingy.ai/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.zingy.ai/app-editor/page-flow/references/popup-customization.md).

# Popup Customization

The Show Popup Form, Show Information Popup and Show Confirmation Popup blocks accept a Value Parameter called Customization that accepts an *object* value.

The *object* provided can have one or more of the following properties:

<table data-full-width="true"><thead><tr><th width="239">Property</th><th>Description</th></tr></thead><tbody><tr><td>okBtnText</td><td>Specify the label of the popup's OK button. If not set the default value of <em>OK</em>.</td></tr><tr><td>cancelBtnText</td><td>Specify the label of the popup's Cancel button. If not set the default value of <em>Cancel</em>.</td></tr><tr><td>hdrBgColor</td><td>Specify the background color of the header section of the popup. Uses an internal default if not provided.</td></tr><tr><td>hdrTxtColor</td><td>Specify the text color of the header section of the popup. Uses an internal default if not provided.</td></tr><tr><td>bodyBgColor</td><td>Specify the background color of the body section of the popup. Uses an internal default if not provided.</td></tr><tr><td>footerBgColor</td><td>Specify the background color of the footer section of the popup. Uses an internal default if not provided.</td></tr><tr><td>hdrTxtClass</td><td>Add space separated list of CSS classes to customize the text in the header section of the poup.</td></tr><tr><td>hdrH6</td><td>If set to <em>true</em>, uses the <strong><code>h6</code></strong> size for the text in the header and uses <strong><code>h5</code></strong> otherwise.</td></tr><tr><td>modalClass</td><td>Customize the horizontal size, vertical centering and other options of the popup using <a href="https://getbootstrap.com/docs/4.6/components/modal/">Bootstrap's classes</a> and/or your own. </td></tr><tr><td>cancelBtnClass</td><td>Specify the CSS classes for styling the Cancel button.</td></tr><tr><td>okBtnClass</td><td>Specify the CSS classes for styling the OK button</td></tr><tr><td>oneBtn</td><td>If set to <em>true</em>, only shows the OK button and hides the Cancel button.</td></tr><tr><td>noBtn</td><td>If set to true, hides both the OK and Cancel buttons.</td></tr><tr><td>type</td><td>Can be one of the following: modal (a popup that is shown with semi-transparent backdrop), right-sidebar (a popup that appears from the right edge and is position on the right edge of the page), left-sidebar (a popup that appears from the left edge and is position on the left edge of the page), top-sidebar (a popup that appears from the top edge and is position on the center of the page).</td></tr><tr><td>sidebarTop</td><td>The gap in pixels from the top of your page for right-sidebar, left-sidebar and top-sidebar type popups.</td></tr><tr><td>noBackdropClickQuit</td><td>For right-sidebar, left-sidebar and top-sidebar type popups, if set to <em>true</em>, prevents the popup from being closed when the user clicks outside the popup.</td></tr><tr><td>sideBarNoHeader</td><td>If set to <em>true</em>, shows right-sidebar, left-sidebar and top-sidebar type popups without a header section.</td></tr><tr><td>sideBarNoFooter</td><td>If set to <em>true</em>, shows right-sidebar, left-sidebar and top-sidebar type popups without a footer section.</td></tr></tbody></table>


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## 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, and the optional `goal` query parameter:

```
GET https://docs.zingy.ai/app-editor/page-flow/references/popup-customization.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

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.