> For the complete documentation index, see [llms.txt](https://support.agentfire.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://support.agentfire.com/add-ons/ada-protect/articles-5654500-premium-add-on-ada-protect-modal-popup.md).

# How to Change the Accessibility Panel

How to change the ADA Protect panel that opens when visitors click the accessibility button: position, themes and behavior.

When visitors click the accessibility button, a panel opens with the tools. You can choose where it opens and how it looks.

Go to **Site Tools** > **ADA Protect**. If it's not there, see [How ADA Protect Works](/add-ons/ada-protect/articles-5650283-premium-add-on-ada-protect-general.md). Click **Modal Popup** on the left.

![ADA Protect settings with the Modal Popup tab highlighted](https://2039430885-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fq65vhH2v4k5rpDOha9Vm%2Fuploads%2Fgit-blob-191b18964b0245db30255f6f160c7ee774547b49%2Fada-3-popup.png?alt=media)

* **Settings:** **Popup position** (**Left**, **Center** or **Right**) and **Draggable**, which lets visitors move the panel.
* **Light Theme** and **Dark Theme:** the panel's **Background Color**, **Key Color** (buttons and switches) and **Text Color**.
* **Appearance and Behavior:** **Border radius**, **Animation** and its duration, **Popup Shadow**, **Overlay** (darkens the page behind), **Floating popup** (stays on screen while scrolling), **Scroll**, **Close anywhere** (closes when visitors click outside), and the **Reset Button** and **Hide Button** at the bottom.

Click **Update** at the top to save. Then open your live website in a private window and click the accessibility button to check.