# 💡 Using notranslate to Prevent Automatic Translation in Specific Components

**URL:** https://community.glideapps.com/t/using-notranslate-to-prevent-automatic-translation-in-specific-components/85797
**Category:** Community Resources
**Tags:** custom-css, tutorial, custom-code
**Created:** [December 26, 2025, 8:49am UTC](https://community.glideapps.com/t/using-notranslate-to-prevent-automatic-translation-in-specific-components/85797 "2025-12-26T08:49:07Z")
**Posts on this page:** 1
**Page:** 1

<div class="post-metadata">

### Author: ![Himaladin](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/himaladin/32/71023_2.png) [@Himaladin](https://community.glideapps.com/u/Himaladin)
#### Post date: [December 26, 2025, 8:49am UTC](https://community.glideapps.com/t/using-notranslate-to-prevent-automatic-translation-in-specific-components/85797/1 "2025-12-26T08:49:07Z")

</div>

I recently remembered a simple but very useful trick: adding the **notranslate** class to a component’s custom class.

This helps prevent automatic translators from modifying text inside that component, including text exposed through **HTML attributes** in the DOM.

You can combine it with your own class—for example, `custom-class notranslate`—to protect parts of the UI where translation could cause unintended changes.

When applied to a **container component** , `notranslate` typically affects all content inside it, including deeply nested components. This reduces the need to apply it repeatedly to each child.

**Tip:** Use your own class (e.g. `custom-class`) for styling or logic. Treat `notranslate` purely as a translation safeguard.

**⚠ Note:** This reduces the risk of automatic translation, but behavior may vary across different translators. Avoid relying on translation-sensitive behavior when 100% reliability is required.
