# Advanced UI customization
{% hint style="danger" %}
This section is for more experienced users of the platform.
{% endhint %}
Your AIsuru Agent's user interface is highly customizable, letting you create a tailored experience for your users.
### Accessing customization options
To start customizing your Agent's interface, follow these simple steps:
1. Log in to the platform;
2. Select the desired Agent;
3. Click "Share me" in the side menu;
4. Find the icon on one of your created layouts and click it to open the widget configuration menu.
### Layout configuration
In this section, you can define the overall appearance of your Agent:
* **Layout**: choose from the available options:
1. **TOTEM**: A specialized layout that requires specific configuration for message positioning and other elements; ideal for interactive physical installations;
2. **FULLPAGE**: Occupies the entire web page for an immersive user experience;
3. **CHAT**: A classic chat-style interface for text-based interactions;
4. **WEBSITE\_ASSISTANT**: Appears as a clickable icon in the bottom right of the site; ideal for discreet web assistance;
5. **HIDDEN\_CHAT**: A side chat that stays hidden until activated; designed to avoid overlapping with the site's main content;
6. **ZOOMED\_FULL\_BODY**: This layout shows the avatar full-screen and is particularly effective on mobile devices, offering an experience similar to TOTEM but without the complex positioning configurations.
Note: **WEBSITE\_ASSISTANT and HIDDEN\_CHAT** are layouts available only through the icon.
* **Multilingual**: enable this option to let users interact with the Agent in different languages 🌍;
* **Initial context**: set the starting context for the conversation;
* **Opening question**: define the first question the Agent will send to the user;
* **Role**: select the role the user will be assigned at the start of the interaction.
### Toolbar customization
You can choose which elements to show in the widget toolbar:
* Show Login;
* **Show Share**: enables the share button, letting users:
* Share the Agent link on various social platforms (Facebook, Twitter, LinkedIn, WhatsApp, Telegram);
* **Share the current chat** with a link specific to the ongoing conversation;
* Send the link via email or copy it to the clipboard;
* Download a QR code for quick sharing.
* Enable audio;
* Show Settings.
### Chat action configuration
Customize the actions available during a conversation:
* Show clear chat button;
* Show only latest messages;
* Show loading text;
* Show copy message;
* Show original translation text.
### Language settings
Define language preferences for your Agent:
* **Default language**: Set the language the Agent will communicate in (default: Italian);
* **Interface language**: Choose the language for the user interface (default: IT).
### Embed code and preview
After configuring all the options, you'll be able to view and copy the generated embed code. This code lets you easily integrate the Agent into your website or application.
If your Agent is set to private, users will always be asked for the access password. You can find the password in the Share me section (below the private link) and in the Agent Settings.
### Technical tip
To prevent automatic zoom on touch inputs, add this meta tag to the `` of your page:
```html
```
Advanced UI customization lets you create a unique experience tailored to your users. Use these options to adapt your AIsuru Agent to the specific needs of your project, improving engagement and the effectiveness of your AI solution. 🚀
---
# 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.aisuru.com/en/sharing/advanced/advanced-ui-customization.md?ask=
```
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.