# Code Examples for Common Widget Integrations on Your Web Page
In this article, you'll find a collection of practical, ready-to-use code snippets designed to help you customize your widget installations based on various user interactions and scenarios.
Each section below details a specific use case, accompanied by the corresponding code that you can directly copy and paste for immediate implementation.
## Custom Widget Initialization
### On Button Click
```html
```
### After a Specified Time Delay
```html
```
### **On Scroll to a Specific Element**
```html
```
## Interacting with the Widget
### **Opening the Widget After a Delay**
```html
```
## Page Actions Triggered by Events
### **Actions Triggered by an Answer**
An interesting scenario to consider is triggering a modal when a specific response is activated in the bot.
For example, consider a situation where you want to prompt user registration after a series of message exchanges culminates in the bot delivering a `registration` response. In such cases, we can utilize the `$answer` event to catch this response and initiate corresponding actions.
{% hint style="danger" %}
Responses may be triggered multiple times if there are reroutes within the conversation flow. It's crucial to carefully manage how responses are linked within the platform to ensure that the same event isn't triggered multiple times.
{% endhint %}
```html
...
```
### Google Analytics
A common setup involves linking Google Analytics to track when the chat opens.\
Here's how you can structure the widget installation for this purpose:
```html
```
---
# 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://guide.indigo.ai/tech-deep-dives/web-chat-integration-and-customization-on-your-website/code-examples-for-common-widget-integrations-on-your-web-page.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.