# Editing HTML Screens
* [Edit HTML Elements + AI Editing](#edit-html-elements--ai-editing)
* [Anonymize Elements](#anonymize-elements)
* [Embed Content](#embed-content)
* [Global Search & Replace](#global-search-and-replace)
* [Typewriter Effect](#typewriter-effect)
* [Text Triggers](#text-triggers)
* [Copy/Paste Elements](#copy-paste-elements)
* [Screen interaction hints](#screen-interactions)
***
### 👉 **Edit HTML elements + AI editing**
HTML demos provide great control over demo environments, here's what you can edit:
* **Edit text** - Select any text element and make inline edits
* **Replace Images** - Select logos/images and update media straight from your library
* **Graphs / Charts** - Edit graphs and charts when they are captured in SVG format.
* **AI editing** - Need help editing your HTML demo? Just prompt our AI editor to make it happen — no developer dependency needed.
***
### 👉 **Anonymize Elements**
Need to anonymize certain aspects of your product screens? Here are a few ways to go about it:
* **Blur elements** - Click on any element and blur the content — useful to protect sensitive data/PII
* **Hide elements** - Useful if you want to remove an element but don't want the screen to auto-align. This also gives you the option to "un-hide" the element at a later point.
* **Delete elements** - Remove elements from your screen and auto-adjust screen alignment.
***
### 👉 **Embed Content**
Customize your demos by embedding external content
* Click on the element you would like to embed with new content
* Select "Embed content" in the menu and pick your content. We support:
* Videos / GIFs / Audio / PDFs
* Media players (Youtube/Vimeo/Loom, etc), maps, charts, etc.
***
### 👉 **Global Search & Replace**
Search and replace will list the total matches found on each screen allowing you to verify and replace them.
* Select the "Search Content" 🔍 icon in the tool bar
* Enter *search* and *replace with* strings
* Review and confirm the replacement
***
### 👉 Typewriter Effect
The typewriter effect in the HTML demo enhances the viewing experience by mimicking real-time writing, creating more interactive and engaging demos for users.
* Select the text element you'd like to add the effect to
* Click on the 3-dots menu
* Select **Typewriter Effect**
* Confirm your typing speed
* Hit save and you're set
***
### 👉 Text Triggers
Adding a text trigger to an HTML demo is a great way to engage your user and demonstrate your product. There are two ways to add them based on your use case - in the guided experience, or the clickable experience.
Try Interactive Demo Yourself 👇
{% @storylane/embed subdomain="app" linkValue="akebmutohi9i" url="" %}
***
### 👉 **Copy / Paste Elements**
A handy feature to quickly clone or replace your HTML elements
* Select on the desired element and click on the three dots
* Select "Copy Element"
* Select the element you would like to update
* And select "Paste Element".
{% hint style="info" %}
If you made any mistake during the editing of your screen, you can click on the **undo** icon to revert changes.
{% endhint %}
### 👉 Screen interactions
HTML Editor Glow-Up! Now you can jazz up clickable areas with custom colors to make them pop against your product's interface. Give your UI a fresh, eye-catching look with just a few tweaks!
{% hint style="info" %}
If you need help or have any questions, feel free to contact us at .
{% endhint %}
